Zasadniczo próbuję zrobić pokaz slajdów, w którym obrazy znikają i znikają po 5 sekundach. Pokaz slajdów kilka zdjęć ułożonych na siebie, nie obok siebie. Jak zrobiłbym IMG1 Fadeout i IMG2 Fadein po 5 sekundach, a następnie MOG2 Fadeout i IMG3 Fadein po kolejnych 5 sekundach itp.?

Myślałem o korzystaniu z funkcji SetInterval (), ale nie wiem, jak to działa. Może opóźnić ()?

3
bigpotato 16 sierpień 2012, 02:01

3 odpowiedzi

Najlepsza odpowiedź

Dlaczego nie używać wtyczki, która to robi? Są tam mnóstwo, w tym cyklu

2
danwellman 15 sierpień 2012, 22:03

Nie potrzebujesz wtyczki. To bardzo łatwo zrobić z kilkoma liniami kodu:

HTML

    <div id="images">
    <ul
        ><li><img src="img/11.jpg" width="520" height="203" alt="" /></li
        ><li><img src="img/12.jpg" width="520" height="203" alt="" /></li
        ><li><img src="img/13.jpg" width="520" height="203" alt="" /></li
        ><li><img src="img/14.jpg" width="520" height="203" alt="" /></li
        ><li><img src="img/15.jpg" width="520" height="203" alt="" /></li
        ><li><img src="img/5.jpg" width="520" height="203" alt="" /></li
    ></ul>
</div>

CSS

#images ul{position:absolute;right:9px;top:1px;width:520px;height:202px;list-style:none;overflow:hidden}
#images li{display:none;position:absolute;left:0;top:0;}

JS

$(document).ready(
  function() {
    var i = 0, j = 0; 
    var imgs = $('#header ul').children();
    runIt(imgs);

    function runIt() {
      $(imgs).eq(i).fadeIn(3000, function() {
        setTimeout(runIt,'200');
      });
      i = i + 1; 
      if (i == imgs.length) {
        i = 0; $('#images li').fadeOut(1000)
      } 
    }
});
3
Moin Zaman 16 sierpień 2012, 06:55

Miałem problemy z IE, kiedy próbowałem użyć Fadein i Fadeout dla galerii plasterków. Używałem biblioteki jQuery "http: // ajax. Googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js ". Kiedy zmieniłem się na "http://code.jquery.com/jquery-1.9.1. JS "biblioteka wszystko było w porządku, np. Chrome i FF i mogłem pominąć wszystkie modyfikacje.

1
RobertoFRey 8 czerwiec 2013, 00:04