jquery - Call a JavaScript function when an element is fully loaded -

i have on modalwindow (from wicket extensions) following code (in html file):

<wicket:head> <script src="static/js/scroll.js" type="text/javascript"></script> <script type="text/javascript">     $(document).ready(function () {            ffscroll('.scroller2');     }); </script> </wicket:head>  <wicket:panel> <div wicket:id="scroller2" id="scroller2" style="overflow-x: hidden; overflow-y: auto; height: 240px" class="scroller2 yyyy zzzz">   ....  </div> </wicket:panel> 

and scroll.js

function ffscroll(id) {         $(id).scroll(function () {              alert(id);         });     }; 

if use simple page code works fine: every time scroll receive alert.

but in modalwindow saw javascript code executed before modal window displayed, suppose need call ffscroll('.scroller2'); after modal window displayed, don't know how this.

a strange thing in firebug script displayed this:

function () {   ffscroll(".scroller2");   alert("aaadssd"); } 

" instead of '.

it's practice put js in resource file, add in ever component using:

for globally define files:

add(javascriptpackageresource.getheadercontribution("js/general.js")); 

for package relative:

add(new javascriptresourcereference(mypage.class, "mypage.js")); 

since modalwindow loaded using ajax required javascript source files downloaded , run on ajax callback.

or if @ modalwindow.show(final ajaxrequesttarget target) adds javascript ajaxrequesttarget using target.appendjavascript(), override show method add javascript:

... @override public void show(final ajaxrequesttarget target) {     super.show(target);     target.appendjavascript("ffscroll('.scroller2');"); } 

then when ajax callback called on client browser javascript run.

hope helps