Leo Jiang
Leo Jiang

Reputation: 26153

Fallback for people without Javascript is flashed before jQuery is loaded

I basically have something like this:

<div id="slide-1" style="display:none;">
  Not too important stuff
</div>
<div id="slide-2">
  Important stuff
</div>
<script>
$('#slide-2').hide(0,function(){
  $('#slide-1').fadeIn();
});
</script>

However, "slide-2" is showing up for about half a second before the jQuery is executed, and the files are all on my computer. If someone else views it, the delay would be long. How can I prevent the user from seeing "slide-2"?

Upvotes: 2

Views: 162

Answers (3)

Quasipickle
Quasipickle

Reputation: 4498

Don't use jQuery for hiding that little div. The delay may be due to the browser waiting for jQuery to download. Use simple javascript right after it like so:

<div id="slide-1" style="display:none;">
  Not too important stuff
</div>
<div id="slide-2">
  Important stuff
</div>
<script>
  document.getElementById('slide-2').style.display = 'none'
</script>

Upvotes: 1

mrtsherman
mrtsherman

Reputation: 39882

You can use the noscript tag to show content to individuals without javascript. So something like this should work.

<noscript>
  <div id="slide-2">
    Important stuff
  </div>
</noscript>

Upvotes: 3

enduro
enduro

Reputation: 1039

Slide-2 could be hidden with display:none;

Without knowing exactly how the slides work, it's difficult to say how appropriate the solution is.

Upvotes: 0

Related Questions