Question

I’ve working with the slideshow from jQuery Tools, as I have a dozen times in the past. However, on this current project the slideshow is loading all of the text from each slide at once and displaying it before the rotation begins. Essentially, for 1-2 seconds before the rotation, you see layers and layers of text on top of each other…very unappealing visually. Does anyone know how to prevent this? Site reference is http://www.AmyLayneLitzelman.com, thanks in advance!

Answer 1

Looking to your HTML page, you didn’t assign any .class in the DIV which wrapping the slide image and texts. So, I estimate that you apply the fade effects on the .slide-image and .slide-txt-blk .

You may want to .fadeIn()/.fadeOut() the wrap DIV, instead of fade its child elements one-by-one.

The position of the DIVs I’m talking about:

<!-- slide -->
<div class="this_one">
  <img class="slide-image" />
  <div class="slide-txt-blk" />
</div>

Control the fading effect using .this_one instead of its child elements.

Please provide the codes of running the slides.
So we can look into more details. And I would try to review my answer if need.