我的jcarousel组件有问题。组件工作正常,就在第一次滚动完成并重新启动后(它是关于圆形滚动),未显示前3个元素(显示空白项目)。滚动以第3个元素开始。
此问题仅在第一次滚动完成后,第二次滚动开始。否则按正确的顺序工作,也显示所有项目。
我的代码如下:
$(document).ready(function() {
$('#mycarousel').jcarousel({
wrap : 'circular',
scroll : 1,
auto: 1,
vertical : true,
animation : 400,
initCallback : function(carousel, state) {
if (state == 'init') {
carousel.clip.hover(function() {
carousel.stopAuto();
addAlertMessage(carousel);
}, function() {
carousel.startAuto();
});
}
}
});
});

.jcarousel ul {
width: 20000em;
position: relative;
/* Optional, required in this case since it's a <ul> element */
list-style: none;
margin: 0;
padding: 0;
}
.jcarousel li.alertMessageStyle {
/* Required only for block elements like <li>'s */
float: left;
width: 100%;
height: 60px;
background-color : #FF6666;
}
.jcarousel li.infoMessageStyle {
/* Required only for block elements like <li>'s */
float: left;
width: 100%;
height: 60px;
background-color : #99FF99;
}
.jcarousel li {
/* Required only for block elements like <li>'s */
float: left;
width: 100%;
height: 60px;
background-color : #FF6666;
}
.jcarousel p {
font-weight: bold;
font-family: "Comic Sans MS", "Comic Sans", cursive;
font-size: 14px;
vertical-align: middle;
text-indent: 25px;
}
.alertMessagePanelStyle {
position: relative;
overflow: hidden;
width: 100%;
height: 50px;
margin-top:10px;
border-style: solid;
border-width: 2px;
}
&#13;
<div id="alertMessagePanelId" class="alertMessagePanelStyle">
<ul id="mycarousel" class="jcarousel">
<li><p>Alert Message: 1</p></li>
<li><p>Alert Message: 2</p></li>
<li><p>Alert Message: 3</p></li>
<li><p>Alert Message: 4</p></li>
<li><p>Alert Message: 5</p></li>
<li><p>Alert Message: 6</p></li>
</ul>
</div>
&#13;
有人有类似的东西吗?