0

我有一个需要能够滚动的 div。不幸的是，默认浏览器非常难看，我试图使用JScrollpane来解决这个问题。

但是，它似乎与我不合作：我添加了必要的链接，当然还有 JQuery

<script type="text/javascript" src="js/jquery.mousewheel.js"></script>
<script type="text/javascript" src="js/jquery.jscrollpane.min.js"></script>
<link type="text/css" href="css/jquery.jscrollpane.css" rel="stylesheet" media="all" />

与我的文件结构相对应，并使用

<script type="text/javascript">
    $(window).load(function() {
        $('#slider').nivoSlider(); 
        $('.work-description').jScrollPane();
    });
  </script>

我的 div 似乎也到位：

<div class="workdescription" id="Plumbing">
                    <div id="shop">
                    <div class="item" data-id="1" data-name="This here is a very large piece of information" data-price="47.50">
                        <p><button class="add-to-cart" type="button">Add</button></p>
                        <p class="itemPrice">This is about the longest sentence you'll get</p>
                    </div>


            </div>

CSS 值为 overflow:auto;

我也试过溢出：隐藏；但这也没有奏效。我仍然坚持丑陋的滚动条。我没有收到任何 JScript 错误。这是怎么回事？

4

2 回答 2

1

我以前使用过 jScrollPane，您基本上需要一个容器，一个将用作包装器的段落，然后调用 jScrollPane，如果具有滚动条的容器来自 ajax 响应，您还需要重新初始化它。

根据您的代码，我假设您的 html 看起来像这样：

<div class="workdescription" id="Plumbing">
<p>
                    <div id="shop">
                    <div class="item" data-id="1" data-name="This here is a very large piece of information" data-price="47.50">
                        <p><button class="add-to-cart" type="button">Add</button></p>
                        <p class="itemPrice">This is about the longest sentence you'll get</p>
                    </div>
                    </div>
</p>
</div>

然后你的选择器，只需在 html 之后包含脚本，这样你就不需要在 window.load() 上包装你的脚本。

<script>
$('.workdescription').jScrollPane({autoReinitialise: true});
</script>
于 2012-07-09T22:53:17.497 回答
0

HTML 中的类名是“workdescription”，但您使用“.work-description”作为选择器。看来这就是问题所在；）

于 2012-07-09T22:50:07.570 回答