javascript - Hide social buttons until fully loaded from external source -


how can show buttons untill loaded external source. before loading buttons there gif preloader indicates loading in progress. code posted working show buttons loads 1 one , not @ same time.

my code is:

<div class="social-holder">         <div class="social-buttons-holder">          </div> </div> 

when user hovers on div class "social-holder" buttons loaded external page named "social".

$('.social-holder').hover(function(){     if($(".social-buttons").length > 0){         $('.social-buttons-holder').show();     }      else {         $('.social-buttons-holder').addclass('preloader');         $('.social-buttons-holder').load('/social', function() {             $('.social-buttons-holder').removeclass('preloader');         });     } }, function(){     $('.social-buttons-holder').hide(); }); 

structure of external page is:

<div class="social-buttons">     <div class="social-button">      </div>     <div class="social-button">      </div>     <div class="social-button">      </div> </div> 

each div class "social-button" contains standard code social buttons wont post here. so, when user hovers on div class "social-holder", div class "social-buttons" loaded inside of div class "social-buttons-holder". if social buttons not loaded class "preloader" added div show preloader gif image. when jquery load loads external content, "preloader" class removed, buttons load 1 one in iframes, , want them load @ same time, because preloader should hide loading process


Comments

Popular posts from this blog

blackberry 10 - how to add multiple markers on the google map just by url? -

php - guestbook returning database data to flash -

delphi - Dynamic file type icon -