JScrollPane 不会滚动整个 div？ -- JScrollPane 不会在窗口调整大小时随 div 动态移动

Question

我在一个 div 上使用 JScrollPane 来滚动它。 div 包含一个自写的 javascript 代码，该代码从我的 tumblr 提要中获取最后几篇文章。然而，即使滚动窗格显示正常，由于某种原因，它并没有完全滚动通过 div。这意味着当我滚动到 jscroll 的末尾时，div 的可视区域下方还有更多内容没有显示出来。我想知道是否有人可以帮我解决这个问题.. 这是我正在使用的页面的链接： http://prisingh.com/#recent

这是在文档的开头部分：

<link type="text/css" href="css/jquery.jscrollpane.css" rel="stylesheet" media="all" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel.js"></script>
<script type="text/javascript" src="js/jquery.jscrollpane.min.js"></script>

<script type="text/javascript" id="sourcecode">
        $(function()
        {
            $('.scroll-pane').jScrollPane();
        });
</script>

这是在正文部分：

<div class="tumblr scroll-pane">
    <img src="images/recenttumblr.png" style="position:fixed;">
    <script type="text/javascript" src="js/tumblr.js"></script>
</div>

以下是正在使用的 javascript 代码： http://www.prisingh.com/js/

编辑：现在我已经解决了原始 div 加载问题，我想知道如何让 Jscrollpane 在窗口调整大小时动态移动 div。每次我调整窗口大小时，JScrollpane 都会保持在最初加载网站时所在的位置。我已经尝试了插件提供的代码：

$(function()
{
$('.scroll-pane').each(
    function()
    {
        $(this).jScrollPane(
            {
                showArrows: $(this).is('.arrow')
            }
        );
        var api = $(this).data('jsp');
        var throttleTimeout;
        $(window).bind(
            'resize',
            function()
            {
                if (!throttleTimeout) {
                    throttleTimeout = setTimeout(
                        function()
                        {
                            api.reinitialise();
                            throttleTimeout = null;
                        },
                        50
                    );
                }
            }
        );
    }
)

});

这并没有解决问题，滚动条使 div 保持与网站原始加载时相同的宽度。 如需演示，只需访问 prisingh.com/#recent 并在页面加载后尝试调整窗口大小。

Answer 1

试试这个

$(document).ready(function() {
  var $images = $(".tumblr img")
    , imageCount = $images.length
    , counter = 0;
    $images.one("load",function(){
         counter++;
         if (counter == imageCount) {
             $('.scroll-pane').jScrollPane();
         } 
    }).each(function () {
        if (this.complete) {
            $(this).trigger("load");
        }
    });
});