Ajax加载幻灯片失败

I'm trying to display text on a sliding div. The text to be displayed is loaded dynamically using ajax. Before the text is loaded the slider div works fine, but after a link is clicked and the div is populated with data, the slider stops working. I don't know how to fix this. A live sample is here. Try clicking on a link like events then click back on design see what happens. my html is here

<div class="coda-slider"  id="slider-id">
                    <div>
                        <?php
                        $counter = 0;
                        for ($x = 0; $x < 8; $x++) {
                            $counter++;
                            ?>
                            <div class="galleryitem">
                                <a href="images/flyer1.png" target="" rel="galleryitem"> <img src="images/flyer<?php echo $counter; ?>.png" alt="Flyer <?php echo $counter; ?>" title="Click to view more"/></a>
                                <!--strong>Flyer</strong-->
                                <span class="description"><strong>Item <?php echo $counter; ?></strong> Simple description..Lorem ipsum dolor sit amet, consectetuer adipiscing elit...<a href="product.php">more</a></span>

                            </div>
                        <?php } ?>
                    </div>

                </div>

my code for the ajax loader is here.

var default_content="";
$(document).ready(function(){
    checkURL();
    $('ul li a').click(function (e){
        checkURL(this.hash);
    });
    //filling in the default content
    default_content = $('#slider-id').html();
    setInterval("checkURL()",250);
});

var lasturl="";
function checkURL(hash)
{
    if(!hash) hash=window.location.hash;
    if(hash != lasturl)
    {
        lasturl=hash;
        if(hash=="")
            $('#slider-id').html(default_content);
        else
            loadPage(hash);
    }
}


function loadPage(url)
{
    url=url.replace('#','');
    $('#loading').css('visibility','visible');
    $.ajax({
        type: "POST",
        url: "load_page.php",
        data: 'page='+url,
        dataType: "html",
        success: function(msg){
            if(parseInt(msg)!=0)
            {

                $('#slider-id').html(msg);
                $('#loading').css('visibility','hidden');
            }
        }

    });

}

My code for the php back end is here.

<?php
if (!$_POST['page'])
    die("0");
$page = $_POST['page'];
if ($page == 'design') {
    ?>

    <div>
        <?php
        $counter = 0;
        for ($x = 0; $x < 4; $x++) {
            $counter++;
            ?>
            <div class="galleryitem">
                <a href="images/flyer1.png" target="" rel="galleryitem"> <img src="images/flyer<?php echo $counter; ?>.png" alt="Flyer <?php echo $counter; ?>" title="Click to view more"/></a>
                <!--strong>Flyer</strong-->
                <span class="description"><strong>Item <?php echo $counter; ?></strong> Simple description..Lorem ipsum dolor sit amet, consectetuer adipiscing elit...<a href="product.php">more</a></span>
            </div>
        <?php } ?>
    </div>
    <?php
} else {
    echo 'No lists in that category';
}
?>

Most probably here in your ajax change to this

$.ajax({
        type: "POST",
        url: "load_page.php",
        data: {'page':url }, /** this is syntax of POST**/
        dataType: "html",
        success: function(msg){
            if(msg.length > 0)
            {

                $('#slider-id').html(msg);
                $('#loading').css('visibility','hidden');
            }
        }

    }); 

I think you should do a get request instead of the post. You are not posting to the server you are getting something (your slider content). You'll have to change the load_page.php also.

Looking at your code it seems like you do not call any slider-function after adding the new content, you should probably do that in the success callback.

$.ajax({
        type: "GET",
        url: "load_page.php",
        data: 'page='+url,
        dataType: "html",
        success: function(msg){
            if(parseInt(msg)!=0)
            {
                // guess you have some slider function

                $('#slider-id').html(msg);
                $('#loading').css('visibility','hidden');
                $('#slider-id').slider(); //example of slider function
            }
        }