Question

基本上，我需要使用jQuery的滚动效果始终在其父级中显示最后一个子div。

顺便提一下，通过PHP生成父div的内容。

到目前为止，这是我目前的代码：

HTML CODE：

<div id="chattercontent" style="width:65%; display:block;">
    <div id="messageme">
        <div>PHP GENERATED CONTENT GOES HERE</div>
        <div>PHP GENERATED CONTENT GOES HERE</div>
        <div>PHP GENERATED CONTENT GOES HERE</div>
        <div>PHP GENERATED CONTENT GOES HERE</div>
        <div>PHP GENERATED CONTENT GOES HERE</div>
        <div>PHP GENERATED CONTENT GOES HERE</div>
    </div>
</div>
</div>

我在ajax中使用的JavaScript用于滚动效果：

$('html, body').animate({ scrollTop: $(document).height() }, 'slow');

我试图用来随时显示最后div个孩子的JavaScript：

<script>
    $( "#messageme div:last-child" )
    .css({ color:"red", fontSize:"80%" })
</script>

Answer 1

而不是引用

$(document).height()

您需要引用您的选择器

$( "#messageme div:last-child" )

所以你的代码看起来像

$('html, body').animate({ scrollTop: $( "#messageme div:last-child" ) }, 'slow');

如果要在动画后更改颜色，可以添加回调。

$('html, body').animate({ scrollTop: $( "#messageme div:last-child" ) }, 'slow', function() {
    //Do stuff after the animation is done
    $( "#messageme div:last-child" ).css({ color:"red", fontSize:"80%" })
});

请参阅此fiddle。

如何始终显示最后一个子div？

1 个答案: