0

シンプルなjqueryスライドショーがあります。各画像の間隔時間を個別に変更する方法を知る必要があります

最初の画像だけを「9000」にして残りを「3000」にしたい

<script>
$(function(){
$('.fadein img:gt(0)').hide();
setInterval(function(){$('.fadein :first-child').fadeOut(2500).next('img').fadeIn(2500).end().appendTo('.fadein');}, 9000);});
</script>

<div class="fadein" >
<img src="1.jpg">
<img src="2.jpg">
<img src="3.jpg">
<img src="4.jpg"></div>
4

2 に答える 2

2

タイムアウトを 9000 に設定し、間隔を 3000 に設定します。

$(function(){
    function fade() {
        $('.fadein :first-child').fadeOut(2500).next('img').fadeIn(2500).end().appendTo('.fadein');
    }
    setTimeout(function() {
        fade();
        setInterval(fade, 3000);
    }, 9000);
});
于 2013-08-02T18:55:15.157 に答える
1

これはあなたが探しているものかもしれません。それは少なくともあなたに遊ぶ何かを与えるでしょう.

http://jsfiddle.net/BjornJohnson/42b8X/

必要な期間をデータ属性として設定します。これは、スクリプトによって setTimeout の遅延を設定するために使用されます。

お気に入り：

<div id="x">
    <img class="active" data-timeout="3000" src="https://si0.twimg.com/profile_images/2644394397/748dd7e11df8dbb93f0fcf2abc141526.png" />
    <img data-timeout="1500" src="https://si0.twimg.com/profile_images/3379531545/ce1eed2263515e4a173dffc815e1a6fc.jpeg" />
    <img data-timeout="5000" src="https://si0.twimg.com/profile_images/3632836331/6e3f4995bd41d49b724e13e694eb1a2d.jpeg" />
    <img data-timeout="2000" src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcQb09ZMKsDuY5lko2JNEfnXb8_8HTfedS9Uuk_7fdcTGoH5Ps-Xxg" />
</div>
于 2013-08-05T12:51:19.730 に答える