CODEWITHSUNDEEP
javascriptjquery
Robert002
Robert002

Reputation: 73

Execute .js immediately after particular <div> has been loaded

$(window).load(function ()) works very reliably, but you have to wait till all the page has been loaded to see the change on the div ( although it's at the top of the page).

Simply putting code after div doesn't work after refresh and the same with .ready function.

Example: JS Fiddle demo

Upvotes: 0

Views: 3583

Answers (2)

shennan
shennan

Reputation: 11656

I'm not sure that you can use jQuery's load method on an element like <div> because it doesn't fire a load event. But images do:

Perhaps wrap it in jQuery's ready method:

$(window).ready(function(){

  $('div img').load(function(){

    // code to run after div's image has loaded

  });
})

EDIT:

In response to your fiddle, if you're wanting to run JavaScript before the <p> then you can just put the <script> before it in the document. JavaScript gets run as it is encountered by the browser, so this should work:

<div id="texture">
  <!-- All your spans -->
</div>
<script>
  alert('this will run before your p element is loaded');
</script>
<p>I would prefer to run script before this text is loaded</p>

Upvotes: 2

Popsyjunior
Popsyjunior

Reputation: 305

I suggest you use css to hide the text and show it using jQuery after jQuery has initialized.

Upvotes: 1

Related Questions