我正在寻求您对这个tinyscrollbar插件的帮助。用户可以用一些文本/问题填充这个文本区域，滚动条应该更新 - 它没有:(也许我只是让用户给我打电话:)
这是我的代码：
<div id="ques-wrap">
<div id="scrollbar1">
<div class="scrollbar">
<div class="track">
<div class="thumb">
<div class="end"></div>
</div>
</div>
</div>
<div class="viewport">
<div class="overview">
<textarea id="ques" class=" required " onfocus="if (this.value == 'ask question') {this.value = '';}" onblur="if (this.value == '') {this.value = 'ask question';}"type="text" name="question" value="ask question" size="30">ask question</textarea>
</div>
</div>
</div>
</div>
jquery-版本 1
var oScrollbar = $('#scrollbar1');
$(document).ready(function () {
oScrollbar.tinyscrollbar();
oScrollbar.tinyscrollbar_update();
$('#scrollbar1').tinyscrollbar();
});
jquery-版本 2
$(document).ready(function () {
// To fix scrollbar not showing all content
function refreshScrollbar(scrollbar, counter, delay) {
if (counter > 0) {
counter--;
scrollbar.tinyscrollbar_update('relative');
setTimeout(function () {
refreshScrollbar(scrollbar, counter, delay);
}, delay);
}
}
$('#scrollbar1').tinyscrollbar();
$("#scrollbar1 .scrollbar .viewport .overview #ques").load(function () {
refreshScrollbar($('#scrollbar1'), 10, 250);
});
});
css
#ques-wrap #scrollbar1 { width: 405px; clear: both; margin: 0px 0 10px; }
#ques-wrap #scrollbar1 .viewport { width: 355px; height:40px; overflow: hidden; position: relative; left: -17px;}
#ques-wrap #scrollbar1 .overview { list-style: none; position: absolute; right: 0; top: 0; }
#scrollbar1 .thumb .end,#scrollbar1 .thumb { background-color: #fb4365; }
#ques-wrap #scrollbar1 .scrollbar { position: relative; float: right; width: 15px; }
#ques-wrap #scrollbar1 .track { background-color: #b5b4b4; height: 100%; width:2px; position: relative; right:2px; }
#scrollbar1 .track { background-color: #b5b4b4; height: 100%; width:2px; position: relative; right:2px; }
#scrollbar1 .thumb { height: 20px; width: 6px; cursor: pointer; overflow:hidden; -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; position: absolute; top: 0; right: -2px;}
#scrollbar1 .thumb .end { overflow: hidden; height: 5px; width: 6px; }
#scrollbar1 .disable{ display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml- user-select: none; -webkit-user-select: none; }
#ques-wrap {
padding-top: 40px;
}
#ques {
border:none;
width: 355px;
height:51px;
background: none;
color:#fff;
margin-right: 19px;
padding-left: 2px;
direction: rtl;
outline: none;
}