0
jcarouselコンポーネントに問題があります。コンポーネントは正常に動作しています。最初のスクロールが終了して再起動すると（循環スクロールの場合）、最初の3つの要素は表示されません（空白の項目が表示されます）。スクロールは3番目の要素から開始されます。jCarousel - スクロールリッチ最後の要素の後の最初の項目
この問題は、最初のスクロールが完了し、2番目のスクロールが開始された場合にのみ発生します。それ以外の場合は、正しい順序で作業しているすべての項目が表示されます。
私のコードは次のようになります。
$(document).ready(function() {
\t $('#mycarousel').jcarousel({
\t \t wrap : 'circular',
\t \t scroll : 1,
\t \t auto: 1,
\t \t vertical : true,
\t \t animation : 400,
\t \t initCallback : function(carousel, state) {
\t \t \t if (state == 'init') {
\t \t \t \t carousel.clip.hover(function() {
\t \t \t \t \t carousel.stopAuto();
\t \t \t \t \t addAlertMessage(carousel);
\t \t \t \t }, function() {
\t \t \t \t \t carousel.startAuto();
\t \t \t \t });
\t
\t \t \t \t
\t \t \t }
\t \t }
\t \t
\t
\t });
});.jcarousel ul {
\t width: 20000em;
\t position: relative;
\t /* Optional, required in this case since it's a <ul> element */
\t list-style: none;
\t margin: 0;
\t padding: 0;
}
.jcarousel li.alertMessageStyle {
\t /* Required only for block elements like <li>'s */
\t float: left;
\t width: 100%;
\t height: 60px;
\t background-color : #FF6666;
}
.jcarousel li.infoMessageStyle {
\t /* Required only for block elements like <li>'s */
\t float: left;
\t width: 100%;
\t height: 60px;
\t background-color : #99FF99;
}
.jcarousel li {
\t /* Required only for block elements like <li>'s */
\t float: left;
\t width: 100%;
\t height: 60px;
\t background-color : #FF6666;
}
.jcarousel p {
\t font-weight: bold;
\t font-family: "Comic Sans MS", "Comic Sans", cursive;
\t font-size: 14px;
\t vertical-align: middle;
\t text-indent: 25px;
\t
}
.alertMessagePanelStyle {
\t position: relative;
\t overflow: hidden;
\t width: 100%;
\t height: 50px;
\t margin-top:10px;
\t border-style: solid;
\t border-width: 2px;
}<div id="alertMessagePanelId" class="alertMessagePanelStyle">
\t \t <ul id="mycarousel" class="jcarousel">
\t \t \t <li><p>Alert Message: 1</p></li>
\t \t \t <li><p>Alert Message: 2</p></li>
\t \t \t <li><p>Alert Message: 3</p></li>
\t \t \t <li><p>Alert Message: 4</p></li>
\t \t \t <li><p>Alert Message: 5</p></li>
\t \t \t <li><p>Alert Message: 6</p></li>
\t \t </ul>
</div>
誰かが似た何かを持っていましたか？
また、jsfidleの私のexmapleです：http://jsfiddle.net/kutas04/wyxw3drz/1/ –
誰かが私の問題の解決策を持っていますか？なぜこのようなwokringなのか分かりません。私は正しく動作するはずです。 –
カルーセルが古くなっているようです。私はあなたがそれを更新し、自動スクロールプラグインを追加する必要があると思う：http://sorgalla.com/jcarousel/docs/ – Pete