April 28, 2012
Multiple onload conflict
Question by bpok
Hi there… I’ve run into a problem using the jQuery thumbnail scroller. It clashes with Fancybox and another script I’ve been using based on the onload event. I found this function which enables multiple onload events to fire by simon wilson:
function func1() {
alert("This is the first.");
}
function func2() {
alert("This is the second.");
}
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
addLoadEvent(func1);
addLoadEvent(func2);
addLoadEvent(function() {
I WANT TO INSERT THE FOLLOWING JQUERY FUNCTION HERE
})
My problem now is getting the 3rd function to work correctly. It’s a syntax problem.
Here is the jQuery I want to insert:
jQuery.noConflict();
(function($){
window.onload=function(){
$("#tS3").thumbnailScroller({
scrollerType:"hoverPrecise",
scrollerOrientation:"vertical",
scrollSpeed:2,
scrollEasing:"easeOutCirc",
scrollEasingAmount:800,
acceleration:4,
scrollSpeed:800,
noScrollCenterSpace:10,
autoScrolling:0,
autoScrollingSpeed:2000,
autoScrollingEasing:"easeInOutQuad",
autoScrollingDelay:500
});
}
})(jQuery);
Any suggestions much appreciated!
Answer by Starx
Why do you need to do this? Why do you need to queue the onload
handlers like that? And since you are using jQuery already, why are using native handlers already?
function func1() { ... }
function func2() { ... }
function thumbScroller() {
$("#tS3").thumbnailScroller({
scrollerType:"hoverPrecise",
scrollerOrientation:"vertical",
scrollSpeed:2,
scrollEasing:"easeOutCirc",
scrollEasingAmount:800,
acceleration:4,
scrollSpeed:800,
noScrollCenterSpace:10,
autoScrolling:0,
autoScrollingSpeed:2000,
autoScrollingEasing:"easeInOutQuad",
autoScrollingDelay:500
});
}
Now call them all collectively
jQuery(document).ready(function() {
func1();
func2();
thumbScroller();
});