Conflict between onload loadbar and prototype scrollbar
I'm trying to understand this conflict between
My loadingbarscript that hides my content until the page is loaded (Removed the tags from the top)
function showContent(){ //hide loading status... document.getElementById("loading").style.display='none'; //show content document.getElementById("content").style.display='block'; } window.onload = function() { showContent(); } </head> <body> <script type="text/javascript"> document.write('<div id="loading"><img src="ajax-loader.gif"></div>'); </script> <div id="content"> <script type="text/javascript"> //hide content document.getElem开发者_JS百科entById("content").style.display='none'; </script>
And 2. My livepipe scrollbar using prototype 1.6.1 Where the call is this:
<script type="text/javascript">
document.observe('dom:loaded',function(){
var scrollbar = new Control.ScrollBar('cases_tekst','scrollbar_track');
});
</script>
For some reason either one works or they other depending on the order. I had several other windows.onload functions that work with the prototype scrollbar but not this one. Hope to understand better what is turning wrong. No errors show up with firebug. The mistake must have something to do with the onload call because when i resize my browser window the scrollbar works.
Hope someone can explain the cause of the conflict.
Instead of using window.onload to call showContents, use prototype's Event.observe function. Like this:
Event.observe(window, "load", showContent);
For more info on this function: http://www.prototypejs.org/api/event/observe
For more info on why not to use the window.load event model, check out this site: http://www.quirksmode.org/js/introevents.html
In general, quirksmode.org is a great site for understanding this kind of thing and how they behave in various browsers. That's one of the reasons to use libraries such as prototype or jquery as it standardizes much of the browser's behavior.
I just solved a similar problem with the livepipe scrollbar. The scrollbar wouldn't appear until I resized my browser window in all browsers except firefox. It turned out it was caused by the nature of the content in the scrolling div. I had many irregularly sized images in there. When I replaced them with text or squared them all up it worked fine.
加载中,请稍侯......
精彩评论