jQuery spawn boxes and give css styling afterwards -


i'm trying make rain cookies on site. problem cookies spawn margin 50% , not @ 0 , margin 50 should be. i've found out that "alert();" make work, know, box appears every time. question is, there way make delay or make work?

this code:

i = 1;  function spawncookies(){      /*setinterval(function()         {              var min = 10;             var max = 60;              var margin = math.floor(math.random() * (max - min + 1)) + min;          }, 100);*/      setinterval(function()         {              bodywidth = $(window).width();              pos = math.floor(math.random() * bodywidth) + 0;              var minwidth = 10;             var maxwidth = 60;              var width = math.floor(math.random() * (maxwidth - minwidth + 1)) + minwidth;              thisdiv = $(".cookiearea").append("<div class='cookie "+i+"' style='width:"+width+"px; height:"+width+"px'></div>");                 $('.'+i+'').css('left',+pos+'px');              alert();              $('.'+i+'').css('margin-top','50%');              i++;          }, 800);  }  $(document).ready(function() {      spawncookies()  },4000); 

add styling stylesheet instead, , have prefix on class

javascript, add class instead:

$('.cookie' + i); 

css add this:

[class^=cookie]{margin-top: 0;} 

the cookie class spawn margin-top 0, , if change in javascript later should animate (if use animation)


Comments

Popular posts from this blog

google chrome - Developer tools - How to inspect the elements which are added momentarily (by JQuery)? -

angularjs - Showing an empty as first option in select tag -

php - Cloud9 cloud IDE and CakePHP -