0

我真的被这个卡住了...

我在 div 上使用 tinyscrollbar.js 插件。在该 div 中，我有一个视口，其中包含一个段落和一个用于在 500px 和 1000px 之间切换段落高度的按钮。如何动态更新 tinyscrollbar 以注意新高度并自行纠正？（请想象还有九个其他“box_content review”div）

我尝试使用网站建议的 tinyscrollbar_update 方法，但它似乎不起作用。有人有想法吗？

谢谢

HTML -

<div id="scrollbar3">
<div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div>
    <div class="viewport">
    <div class="overview">
    <div class="box_content review">
    <h5 class="reviewTitle">Review title: D90 is the best camera</h5>
    <img src="../../images/gen_rating_5.png" />
    <div class="topCont">
    <img src="../../images/profile.png" />
    <p class="pros">Pros - LightWeight, Quality, Performance, Durable, Reliable  </p>
    <p class="cons">Cons - Expensive, Interchangable Parts </p>
    </div>
    <p class="reviewContent">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book... &nbsp <span><i><a class="readMore">read more</a></i></span></p>
</div>
</div>
</div>
</div>

jQuery -

$('#scrollbar3').tinyscrollbar({ sizethumb: 45 });
    $(".readMore").toggle(function(){
        $(this).parent().parent().parent().animate({height:530},400);
        $('#scrollbar3').tinyscrollbar_update();
    },function(){
        $(this).parent().parent().parent().animate({height:76},400);
        $('#scrollbar3').tinyscrollbar_update();
    });
4

2 回答 2

1

更新 tinyscrollbar 时动画尚未完成。动画完成后，使用complete 回调函数更新 tinyscrollbar。

$(this).parent().parent().parent().animate(
    { height:530 }, 
    400, 
    function() {
        $('#scrollbar3').tinyscrollbar_update();
    }
);
于 2013-05-12T14:38:04.890 回答
1

好的，所以我最后做的是预先添加内容并给父 div 一个溢出：隐藏和一个固定的高度来“隐藏”内容。然后单击我将高度更改为“自动”。

于 2013-04-14T08:53:10.367 回答