0

垂直スクロール コンテンツには、有名な jQuery vTicker プラグインを使用しています。ただし、ページをロードすると、コンテンツ「<li>私の場合の要素」が一瞬表示された後、コンテンツが再び非表示になり、期待どおりに機能し始めます。

これに対する解決策はありますか？

これは私のコードです:

    <script type="text/javascript">
        $(document).ready(function () {
            $('#lastminute').vTicker({
                speed: 500,
                pause: 3000,
                animation: 'fade',
                mousePause: true,
                showItems: 1
            });
        });
    </script>

    <div id="lastminute">
        <li>item 1</li>
        <li>item 2</li>
        <li>item 3</li>
    </div>

これがどのように見えるかです

4

1 に答える 1

0

css プロパティが のようにちらつきたくないすべての要素にクラスを追加しますvisibility:hidden。

$(document).ready()ハンドラーでこのクラスを削除します。

そうすれば、意図したとおりに表示する準備が整うまで、要素はユーザーには見えません。

CSS -

.hideuntilready{
    visibility:hidden;
}

JS -

<script type="text/javascript">
    $(document).ready(function () {
        $('#lastminute').removeClass("hideuntilready").vTicker({
            speed: 500,
            pause: 3000,
            animation: 'fade',
            mousePause: true,
            showItems: 1
        });
    });
</script>

HTML -

<div id="lastminute" class="hideuntilready">
    <ul>
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
    </ul>
</div>
于 2012-06-21T17:31:43.237 に答える