0 
<html>

<head>
<link rel="stylesheet" type="text/css" href="test.css">
<link href="jScrollPane.css" type="text/css" rel="stylesheet" >
<script src="jquery-1.10.2.min.js" type="text/javascript" charset="utf-8"></script>
<script src="jScrollPane.js" type="text/javascript"></script>
<script src="test.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
<div id="abc">

</div>
</body>

</html>

test.css

#abc{
    width: 300px;
    height: 300px;
}

test.js

$(document).ready(function(){

$('#abc').jScrollPane();

setInterval(function(){$('#abc').append('<p>UDB</p>');},1000);

}) ;

コンテンツを追加できるボックスを作成しようとしています。ボックスがいっぱいになると、メッセージ ボックスや通知ボックスなどをスクロールしてコンテンツを表示できます。しかし、追加しようとするたびにjScrollPane()、を使用して子を再帰的に追加することはできませんappend()。

4

1 に答える 1

1

これは、jScrollPane が 2 つのネストされた要素 (jspContainerおよびjspPane. jspPaneしたがって、要素を要素内に追加する必要があります#abc。

var target = $('#abc').jScrollPane();
setInterval(function()
{
    target.find('.jspPane').append('<p>UDB</p>');
    target.data('jsp').reinitialise();
},1000);

編集

またreinitialise、追加するたびに呼び出して、jScrollPane がそのディメンションを更新して新しいコンテンツに対応できるようにする必要があります。ここに実用的なフィドルがあります：http://jsfiddle.net/yC5k9/

于 2013-09-08T08:12:48.473 に答える