0

I have two scripts that work great independently, and now I want to combine them. The first one is a slider that can load any content.

<script>
$(function(){
    $('#slides').slides({
        preload: true,
        preloadImage: 'img/loading.gif',
        play: 10000,
        pause: 100000,
        hoverPause: true,
        effect: 'fade',
        slidesLoaded: function() {
            $('.caption').animate({
                bottom:0
            },200);
        }
    });
});
</script>

The second one is a script that can display a couple of div's with a smooth timed fade in.

<script type='text/javascript'>
  $(window).load(function(){
    $('.square').fadeTo(0,0).each(function(index) {
      var dif = index % 5;
      var lambda = parseInt(index / 8);
      $(this).delay(250 * (dif + lambda)).css('visibility','visible').fadeTo(500,1)
    });
  });
</script>

When the page loads, different images in div's are fading in one by one. (second script). All this is in a slider div that is activated by the first script. When the slider goes to the next slide, the second script is already activated because the document was ready. I would like it to be "reset" when the second slide is activated. Then the second slide will show the second batch of images smoothly fading in, one-by-one.

Alejandro Galera
  • 3,445
  • 3
  • 24
  • 42
user3797701
  • 19
  • 3
  • You're doing a big mistake embedding `$(document).ready()` within `$(window).load()`, read why here: [link](http://stackoverflow.com/questions/8396407/jquery-what-are-differences-between-document-ready-and-window-load) –  Oct 07 '14 at 10:10
  • @TrueBlueAussie IMHO a jQuery developer must avoid that behaviour. –  Oct 07 '14 at 10:14
  • @TrueBlueAussie well, as you like :) IMHO that's a relevant issue a jQuery developer won't never make. –  Oct 07 '14 at 10:21
  • $(document).ready() removed. Now back to the issue at hand... Is it possible to make the div.square visibility hidden again, when the second slide is about to appear? By the way, here is an URL to see what we are talking about... http://freehand.nl/hamptonbay/index2.php – user3797701 Oct 07 '14 at 10:41
  • @user3797701: It would be nice for you to provide a JSFiddle or SO Code Snippet so that any solution can be tested :) – iCollect.it Ltd Oct 07 '14 at 10:45
  • http://jsfiddle.net/cuLx3c46/ – user3797701 Oct 07 '14 at 10:55
  • In the fiddle you can see that the first slide of images is fading in one by one. In the second batch, they all appear simultaneously. – user3797701 Oct 07 '14 at 11:00

0 Answers0