0

I'm using Jquery-Steps wizard. Currently when the page loads there is a brief delay whereby all the wizard steps display unstyled until the javascript and css kicks in. It looks terrible and negates the wizard effect.

Is there a way to only display the wizard step 1 upon page load without briefly displaying all the other hidden wizard steps?

Thank you!

sfuptown
  • 277
  • 1
  • 5
  • 14
  • Show some code or a demo, please. As this doesn't happen on the example pages (http://www.jquery-steps.com/Examples#basic-form), we'll need something more to go on. – isherwood Sep 12 '14 at 19:22
  • can you style them with css `display:none` and change the first one after page load? – Gary Storey Sep 12 '14 at 19:27
  • The samples used to exhibit the same loading problem until they were moved to hidden divs. Notice that the samples page hides all the wizards until a button is clicked. – sfuptown Sep 13 '14 at 19:44
  • Gary, I tried your suggestion. The issue is the first one doesn't show even after calling the jquery .show() method. However, if I advance to the next step and then click previous it does show. I can't figure out why it doesn't show on initial page load. – sfuptown Sep 13 '14 at 19:47

1 Answers1

0

To hide any particular step, I use this code:

$("#mySteps a[href='#mySteps-h-1']").hide();

Simply replace the numeric "1" with the index of any (or all) steps you wish to hide. To show the step, just make a similar call:

$("#mySteps a[href='#mySteps-h-1']").show();
Opal
  • 81,889
  • 28
  • 189
  • 210
JustADork
  • 59
  • 2
  • 6