1

理由はわかりませんが、div の 1 つである .load_post と .blog_posts がアニメーション化されません。理由がわかりません。これが私のコードです：

page1.php (メインページ)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<?php
include 'body/head.php';
?>

<body>
<?php
    include 'body/nav.php';
?>

<script>
    $(document).ready(function() {
        $('.blog_posts').load('blog_feed.php');
    });
</script>

<div style="position:absolute; top:90px; left:1px; width:550px; background-color:lightblue;">

    <h1>Blog Posts</h1>

    <div class="blog_posts">

    </div>

    <div class="load_post" style="position:absolute; top:250px; left:1500px; width:550px; background-color:lightblue;">

    </div>
</div>
</body>
</html>

page2.php (div の読み込みとアニメーション化)

<?php

mysql_connect('127.0.0.1', 'root', '');
mysql_select_db('awsomechat');

$query = mysql_query("SELECT * FROM `blog`");

?>

<?php
while ($rows = mysql_fetch_array($query)){

$id = $rows['id'];
$date = str_replace("-", "/", $rows['date']);
$title = stripslashes($rows['title']);

?>
<a href="#" class="post" rel="<?php echo $id; ?>"> <h2 style="padding:0px; margin:0px;"><?php echo $title; ?></h2></a>
<h6 style="padding:0px; margin:0px;"><?php echo $date; ?></h6>
<?php
}
?>

<script>
$('.post').click(function() {       
var value = $(this).attr('rel');

$('.load_post').html('Loading...').load('load_post.php?value='+value);
$('load_post').animate({"left": "-=1500px"}, "slow");
$('.blog_posts').animate({"left": "-=1500px"}, "slow");

});
</script>

page3.php (選択した投稿を読み込みます)

<?php

mysql_connect('127.0.0.1', 'root', '');
mysql_select_db('awsomechat');

$post = mysql_real_escape_string(htmlentities($_GET['value']));

$query = mysql_query("SELECT * FROM `blog` WHERE `id` = $post");

$rows = mysql_fetch_array($query);

?>
<div class="loaded_post">

<h2 style="padding:0px; margin:0px;"><?php echo stripslashes($rows['title']); ?></h2>
<h6 style="padding:0px; margin:0px;"><?php echo str_replace("-", "/", $rows['date']); ?></h6>
<p><?php echo stripslashes($rows['text']); ?></p>

</div>

.blog_posts がアニメーション化されない理由は誰にもわかりますか? なぜ左に動かないのか理解できません。

4

4 に答える 4

1

page1.phpこれをの代わりに追加してpage2.php、JS が次のようになるようにします。

<script>
$(document).ready(function() {
    $('.blog_posts').load('blog_feed.php');
    $(document).on('click', '.post', function() {       
        var value = $(this).attr('rel');
        $('.load_post').html('Loading...')
                       .load('load_post.php?value='+value, function(){
                            $(this).animate({"left": "-=1500px"}, "slow");
                            $('.blog_posts').animate({"left": "-=1500px"}, "slow");
                       });
    });
});
</script>

また、プロパティのアニメーション化が何かを行うように、.blog_postsが適切なスタイル (おそらくposition: absolute;のようなもの) を持っていることを確認する必要があります。.load_postleft

于 2013-05-23T21:23:22.843 に答える
0

jQuery ファイルがありません。

于 2013-05-23T21:28:03.603 に答える
0

load_posts適切に選択されていないため、現在はアニメーション化されません。.その前にが必要です。そう$('.load_post').animate({"left": "-=1500px"}, "slow");

于 2013-05-23T21:23:34.723 に答える