Databases
StackOverflow2013
Postsdbo
POjQuery .load() : callback slideshow function doesn't load all images to load first, but then loads correctly on second .load()
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery .load() : callback slideshow function doesn't load all images to load first, but then loads correctly on second .load()
    primarykey
    data
    text
    <p>I've got this function,</p> <pre><code>showcase_loader() </code></pre> <p>that loads html into a wrapper with .load() and then fires up a plugin function called .nivoslider() which formats a list of images into a slideshow, depending on the dimensions of all the images in that list (has to wait for all of them to load to do that).</p> <p>Once I fire .load() the first time (click on .projects a), it seems the images dont have enough time to load, and therefore the plugin cannot do its magic. I tried putting the slideshow function as:</p> <pre><code>.load(var, callback function) </code></pre> <p>to make sure all the images were loaded, but it seems to only work the second time I try (when the images are cached, I imagine). I say that because it doesn't screw up on my local copy, only the online one.</p> <p>you can try it live here (<a href="http://raphaelguilleminot.com/" rel="nofollow noreferrer" >raphaelguilleminot.com</a> log: furax75 pass: kjhdjj I HAVENT DEBUGGED CSS FOR IE YET)</p> <p>I've been stuck for a while... Any thoughts?</p> <p>JQUERY:</p> <pre><code>// showcase loader var showcase_loader = function() { //prepare loader $('html, body').animate({scrollTop:0}, 'slow'); var toLoad = $(this).attr('href')+' #showcase'; //check if there is already something loaded in wrapper if ( $('#project_showcase_wrapper').is(':hidden') ) { //mark link as selected $(this).addClass('opacity'); //load showcase content $('#project_showcase_wrapper').load(toLoad, function() { $('#project_showcase_wrapper').slideDown('normal', function() { $('#slider').nivoSlider({effect:'fade'}); $('#showcase').fadeIn('normal'); $('.showcase_badge').fadeIn(2000); $('#showcase_next, #showcase_previous').click(showcase_loader); }); }); }else{ $('.opacity').removeClass('opacity'); $(this).addClass('opacity'); $('#showcase').fadeOut('normal', function() { $('#project_showcase_wrapper').load(toLoad, function() { $('#slider').nivoSlider(); $("#showcase").hide(); $('#showcase').fadeIn('normal'); $('.showcase_badge').fadeIn(2000); $('#showcase_next, #showcase_previous').click(showcase_loader); }); }); } return false; } </code></pre> <p>LOADED HTML: </p> <pre><code>&lt;div id="showcase"&gt; &lt;div class="showcase_text"&gt; &lt;/div&gt; &lt;ul id="slider"&gt; &lt;img src="images/project1_slide1.jpg" alt="" title="" /&gt; &lt;img src="images/project1_slide2.jpg" alt="" title="" /&gt; &lt;img src="images/project1_slide3.jpg" alt="" title="" /&gt; &lt;img src="images/project1_slide4.jpg" alt="" title="" /&gt; &lt;img src="images/project1_slide5.jpg" alt="" title="" /&gt; &lt;img src="images/project1_slide6.jpg" alt="" title="" /&gt; &lt;/ul&gt; &lt;div id="showcase_nav"&gt; &lt;a href="index2.html" class="close_showcase"&gt;close&lt;/a&gt; &lt;a href="project_2.html" id="showcase_next"&gt;next project&lt;/a&gt; &lt;/div&gt; &lt;/div&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USBenjamin
    1. USRaphael
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POjQuery .load() : callback slideshow function doesn't load all images to load first, but then loads correctly on second .load()
      1. This table or related slice is empty.
      1. VTUpMod
    1. COHello, it just works fine on my PC ( though I cleared my cache ), I tried it using FF 3.6. one thing I suggest you is compress the size of Images, it takes around `22` seconds to download all your content
      singulars
      1. POjQuery .load() : callback slideshow function doesn't load all images to load first, but then loads correctly on second .load()
      1. This table or related slice is empty.
    2. COthanks! theres a lot of uncompressed fireworks pngs in there so ill try compressig that... well see, but can anyone confirm it works (ill update the images)
      singulars
      1. POjQuery .load() : callback slideshow function doesn't load all images to load first, but then loads correctly on second .load()
      1. USRaphael
    3. COI compressed all the images but the behaviour is still erratic, sometimes it loads, sometimes it doesnt... Help!
      singulars
      1. POjQuery .load() : callback slideshow function doesn't load all images to load first, but then loads correctly on second .load()
      1. USRaphael
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload