Loading two javascript libraries on one page

tewari68 · Mar 4, 2008

Hi,
I have two different javascript libraries for two different functions(a drop down menu and a slider).Though both the libraries have different variable names and different functions, however both these libraries use this.onmouseover/this.onmouseout etc, and I think that is causing some conflict.
As the page loads on IE the menu displays correctly but not the slider and on FireFox or Mozilla the menu does not display but the slider displays correctly.
Is there a way to make both the libraries work on the same page.
I am not a javascript person, so appreciate any help in this regards.
Thanks,
tewari

BillyRayPreachersSon · Mar 4, 2008

It's probably the case that both libraries want to have control of "window.onload". This is a common problem, and can be resolved in one of two ways:

1. Replace any onload handlers with nice versions that don't simply overwite window.onload (e.g. addEventListener), or

2. Write one common window.onload function which calls the constructor for both pieces of code.

You will probably find option 2 the easiest ;-)

Hope this helps,
Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

tewari68 · Mar 4, 2008

Hi Dan,
Thanks for the quick reply.
I see that window.onload is not used in any of the libraries.
I found these libraries over the net and modified them for my purposes.
I am herewith attaching one of the libraries, appreciate if you can review and suggest changes to this library.
The other library is the hvmenu, I found at [link]http://www.dynamicdrive.com/dynamicindex1/hvmenu/.[/url]

Code:

/****************************************************************
 * Slider
 *   
 * Slider050723
 * by Christiaan Hofman, July 2005
 *   
 * You may use or modify this code provided that this copyright notice
 * appears on all copies.
 *   
 *  Constructor:
 *    var slider = new Slider( [name] );
 *       (default: name = "slider0", "slider1", ...)
 *   
 *  Creating Methods
 *    slider.writeSlider();
 *    slider.placeSlider( [img]ame[/img] );
 *        (default: imgName = name+"RailImg")
 * 
 *  Control Methods:
 *    slider.getValue();
 *    slider.setValue( [value] );
 *
 *  Event Handlers:
 *    slider.onmouseover( e );
 *    slider.onmouseout( e );
 *    slider.onmousedown( e );
 *    slider.onmouseup( e );
 *    slider.onslide( e );
 *    slider.onchange( e );
 *    slider.onclick( e );
 * 
 *  Default Initial Settings:   
 * 
 *    slider.leftValue = 0;
 *    slider.rightValue = 1;
 *    slider.defaultValue = 0;
 *    slider.offsetX = 1;
 *    slider.offsetY = 1;
 *    slider.maxSlide = 258;
 *    slider.buttonWidth = 40;
 *    slider.buttonHeight = 28;
 *    slider.buttonImg = "sliderbutton.gif";
 *    slider.buttonHiliteImg = "sliderhibutton.gif";
 *    slider.imgPath = "";
 *    slider.orientation = "h";
 * 
 ****************************************************************
 *  EXAMPLE:
 *
 *  <html>
 *  <head>
 *  <script language="javascript" src="slider.js"></script>
 *  <script language="javascript">
 *    mySlider = new Slider( "MySlider" );
 *  </script>
 *  </head>
 *  <body onload="mySlider.placeSlider()">
 *  <img src="sliderbg.gif" name="MySliderRailImg">
 *  <script language="javascript">
 *    mySlider.writeSlider();
 *  </script>
 *  </body>
 * </html>
 ****************************************************************
 */

// Constructor

function Slider(name) {
    this.leftValue = 0;
    this.rightValue = 1;
    this.defaultValue = 0;
    this.offsetX = 1;
    this.offsetY = 1;
    this.maxSlide = 258;
    this.buttonWidth = 40;
    this.buttonHeight = 28;
    this.buttonImg = "slider4button.gif";
    this.buttonHiliteImg = "slider4hibutton.gif";
    this.buttonHoverImg = "slider4hobutton.gif";
    this.imgPath = "";
    this.orientation = "h";
    
    this.writeSlider = Slider.writeSlider;
    this.placeSlider = Slider.placeSlider;
    this.makeEventHandler = Slider.makeEventHandler;
    this.isPrototype = Slider.isPrototype;
    this.getValue = Slider.getValue;
    this.setValue = Slider.setValue;
     
    this.MouseOver = Slider.MouseOver;
    this.MouseOut = Slider.MouseOut;
    this.MouseDown = Slider.MouseDown;
    this.MouseUp = Slider.MouseUp;
    this.MouseSlide = Slider.MouseSlide;

    this.onmouseover = null;
    this.onmouseout = null;
    this.onmousedown = null;
    this.onmouseup = null;
    this.onslide = null;
    this.onchange = null;
    this.onclick = null;

    if (!window.sliders)  window.sliders = new Array();
    this.name = name || "slider"+window.sliders.length;
    window.sliders[window.sliders.length] = this;
    window.sliders[this.name] = this;
    if (!window.sliderDrag)  window.sliderDrag = new Object();
}

// method write the button DIV

Slider.writeSlider = function () {
	if (!document.getElementById) return; // no W3C support
	
    var proto = this.prototype || this;

    // create images for the prototype, if not already set
    if (!proto.loImg) {
        proto.loImg = new Image(proto.buttonWidth,proto.buttonHeight);
        proto.loImg.src = proto.imgPath + proto.buttonImg;
       if (proto.buttonHiliteImg) {
            proto.hiImg = new Image(proto.buttonWidth,proto.buttonHeight);
            proto.hiImg.src = proto.imgPath + (proto.buttonHiliteImg || proto.buttonImg);
        }
        if (proto.buttonHoverImg) {
            proto.hoImg = new Image(proto.buttonWidth,proto.buttonHeight);
            proto.hoImg.src = proto.imgPath + proto.buttonHoverImg;
        }
    }
    // set the properties according to the prototype
    if (proto != this) {
        this.loImg = proto.loImg;
        if (proto.hiImg)  this.hiImg = proto.hiImg;
        if (proto.hoImg)  this.hoImg = proto.hoImg;
        this.orientation = proto.orientation;
        this.maxSlide = proto.maxSlide;
    }

    // style for the slider button
    var style = '<STYLE TYPE="text/css"><!--\n' +
        '#'+this.name+'Button {visibility:hidden; position:absolute; width:'+ proto.buttonWidth +'px; height:'+ proto.buttonHeight +'px; z-index:1; }\n' +
        '--></STYLE>';

    // html for the button div
    var content = '<DIV ID="'+this.name+'Button">'+
        '<IMG ID="'+this.name+'ButtonImg" SRC="'+proto.loImg.src+'" WIDTH='+proto.buttonWidth+' HEIGHT='+proto.buttonHeight+'>'+
        '</DIV>';

    // write the button style and content in the document
	document.writeln(style);
	document.writeln(content);

    // set button properties and mouse event handlers
	this.button = document.getElementById(this.name+"Button");
	this.button.img = document.getElementById(this.name+"ButtonImg");
	this.button.style.width = proto.buttonWidth + 'px';
	this.button.style.height = proto.buttonHeight + 'px';
	if (this.button.addEventListener) {
		this.button.addEventListener("mousedown",this.MouseDown,false);
		this.button.addEventListener("mouseout",this.MouseOut,false);
		this.button.addEventListener("mouseover",this.MouseOver,false);
    } else {
        this.button.onmousedown = this.MouseDown;
        this.button.onmouseout = this.MouseOut;
        this.button.onmouseover = this.MouseOver;
    }
    // set event handlers as functions
    this.onmouseover = this.makeEventHandler(this.onmouseover);
    this.onmouseout  = this.makeEventHandler(this.onmouseout);
    this.onmousedown = this.makeEventHandler(this.onmousedown);
    this.onmouseup   = this.makeEventHandler(this.onmouseup);
    this.onslide     = this.makeEventHandler(this.onslide);
    this.onchange    = this.makeEventHandler(this.onchange);
    this.onclick     = this.makeEventHandler(this.onclick);
    // tell button who we are
    this.button.slider = this;
    // from now on button refers to the style object
    this.button = this.button.style;
}

// method to put the slider button in place

Slider.placeSlider = function (imgName) {
	if (!document.getElementById) return; // no W3C support
	
    var proto = this.prototype || this;

    // set name or default name
    imgName = imgName || this.name+'RailImg';
    // find the rail image
    this.rail = (typeof(imgName) == 'string')? document.getElementById(imgName) : imgName;
    // offset w.r.t rail
    var x = proto.offsetX;
    var y = proto.offsetY;
    // add global position of rail and parents in global document to the offset
    if (this.rail.offsetParent) {
        var parent = this.rail;
         while (parent) {
            x += parent.offsetLeft;
            y += parent.offsetTop;
            parent = parent.offsetParent;
        }
        // Fix for IE 5 for Mac
        if (navigator.userAgent.indexOf("MSIE")+1 && navigator.userAgent.indexOf("Mac")+1) {
            x += parseInt(document.body.currentStyle.marginLeft);
            y += parseInt(document.body.currentStyle.marginTop);
        }
    } else {
        x += (typeof(this.rail.pageX) == 'number')? this.rail.pageX : this.rail.x;
        y += (typeof(this.rail.pageY) == 'number')? this.rail.pageY : this.rail.y;
    }
    // set position of button
    this.button.left = x + 'px';
    this.button.top = y + 'px';
    // offset is remembered for later sliding
    this.offset = (proto.orientation == "v")? y : x;
    // put button in default position and make visible
    this.setValue(this.defaultValue);
    this.button.visibility = 'inherit';
}

// makes slider a prototype for all previously defined sliders

Slider.isPrototype = function () {
    for (var i=0; i<window.sliders.length; i++)  
        window.sliders[i].prototype = window.sliders[i].prototype || this;
}

// mouseover handler of the button, only calls handler of slider

Slider.MouseOver = function (e) {
    window.sliderDrag.isOver = true;
    if (this.slider.hoImg && !window.sliderDrag.isDown)  this.img.src = this.slider.hoImg.src;   
    if (this.slider.onmouseover)  this.slider.onmouseover(e);
}

// mouseout handler of the button, only calls handler of slider

Slider.MouseOut = function (e) {
    window.sliderDrag.isOver = false;
    if (this.slider.hoImg && !window.sliderDrag.isDown)  this.img.src = this.slider.loImg.src;   
    if (this.slider.onmouseout)  this.slider.onmouseout(e);
}

// mousedown handler of the button

Slider.MouseDown = function (e) {
    var slider = this.slider;
    // remember me
    window.sliderDrag.dragLayer = this;
    window.sliderDrag.dragged = false;
    window.sliderDrag.isDown = true;
    // event position
    var evtX = evtY = 0;
    if (!e) e = window.event;
    if (typeof(e.pageX) == 'number') {
        evtX = e.pageX;
        evtY = e.pageY;
    } else if (typeof(e.clientX) == 'number') {
        evtX = e.clientX + (document.body.scrollLeft || 0);
        evtY = e.clientY + (document.body.scrollTop || 0);
    }
    // ignore right mouse button
    if ((e.which && e.which == 3) || (e.button && e.button == 2)) return true;
    // set starting offset of event
	window.sliderDrag.offX  =  evtX - parseInt(this.style.left) + slider.offset;
	window.sliderDrag.offY  =  evtY - parseInt(this.style.top) + slider.offset;
	if (e.cancelable) e.preventDefault();
	if (e.stopPropagation) e.stopPropagation();
	e.cancelBubble = true; 
    // document handles move and up events
    document.onmousemove = slider.MouseSlide;
    document.onmouseup = slider.MouseUp;
    if (document.captureEvents) document.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
    // show hilite img
    if (slider.hiImg) this.img.src = slider.hiImg.src;
    // call event handler of slider
    if (slider.onmousedown)  slider.onmousedown(e);
    return false;
}

// mouseup handler of the button

Slider.MouseUp = function (e) {
    // button and slider that was draged
    var l = window.sliderDrag.dragLayer;
    var slider = l.slider;
    window.sliderDrag.isDown = false;
    // cancel move and up event handlers of document
    document.onmousemove = null;
    document.onmouseup = null;
    if (document.releaseEvents) document.releaseEvents(Event.MOUSEMOVE|Event.MOUSEUP);
    window.sliderDrag.dragLayer = null;
    // show normal image
    if (slider.hiImg) 
        l.img.src = (window.sliderDrag.isOver && slider.hoImg)? slider.hoImg.src : slider.loImg.src;
    // cal event handlers of slider
    if (slider.onmouseup)  slider.onmouseup(e);
    if (window.sliderDrag.dragged) {
        if (slider.onchange) slider.onchange(e);
    } else {
        if (slider.onclick) slider.onclick(e);
    }
    return false;
}

// mousemove handler of the button for sliding

Slider.MouseSlide = function (e) {
    // button and slider to be draged
    var l = window.sliderDrag.dragLayer;
    var slider = l.slider;
    // we have dragged the slider; for click
    window.sliderDrag.dragged = true;
    // event position
    var evtX = evtY = 0;
    if (!e) e = window.event;
    if (typeof(e.pageX) == 'number') {
        evtX = e.pageX;
        evtY = e.pageY;
    } else if (typeof(e.clientX) == 'number') {
        evtX = e.clientX + (document.body.scrollLeft || 0);
        evtY = e.clientY + (document.body.scrollTop || 0);
    }
    var pos = (slider.orientation == "h")? 
        Math.max(Math.min(evtX - window.sliderDrag.offX,slider.maxSlide),0) + slider.offset :
        Math.max(Math.min(evtY - window.sliderDrag.offY,slider.maxSlide),0) + slider.offset;
    // move slider. 
	if (slider.orientation == "h")  l.style.left = pos + 'px';
	else  l.style.top = pos + 'px';
	if (e.cancelable) e.preventDefault();
	if (e.stopPropagation) e.stopPropagation();
	e.cancelBubble = true;
    // call slider event handlers
    if (slider.onchange)  slider.onchange(e);
    if (slider.onslide)  slider.onslide(e);
    return false;
}

// calculate the value of the slider from position

Slider.getValue = function (n) {
    var pos = (this.orientation == "h")? parseInt(this.button.left) : parseInt(this.button.top);
    var val =  this.leftValue + (this.rightValue-this.leftValue) * (pos-this.offset) / this.maxSlide;
    return (typeof(n) == 'number')?  toDecimals(val,n) :  val;
}

// set the position of the slider from a value

Slider.setValue = function (value,ignore) {
    if (typeof(value) == 'string')  value = parseFloat(value);
    if (isNaN(value))  value = this.defaultValue;
    // set within min/max bounds
    var rangeValue = (this.rightValue >= this.leftValue)? 
        Math.min(Math.max(value,this.leftValue),this.rightValue) - this.leftValue : 
        Math.max(Math.min(value,this.leftValue),this.rightValue) - this.leftValue;
    var pos = this.maxSlide * rangeValue / (this.rightValue-this.leftValue) + this.offset + 'px';
    // move button to calculated position
	if (this.orientation == "h")  this.button.left = pos;
	else  this.button.top = pos;
    // call slider event handler, unless ignore is true
    if (this.onchange && (!ignore))  this.onchange(null);
}

// make an event handler, ensuring that it is a function

Slider.makeEventHandler = function (f) {
    return (typeof(f) == 'string')? new Function('e',f) : ((typeof(f) == 'function')? f : null);
}

// return a value as a string with a fixed number of decimals

function toDecimals(val,n) {
    if (isNaN(n)) return val;
    for (var m=0; m<n; m++)  val *= 10;
    for (var m=0; m>n; m--) val *= 0.1;
    val = Math.round(val);
    if (val < 0) {
        val = -val;
        var sgn = "-";
    } else {
        var sgn = "";
    }
    var valstr = val.toString();
    if (n>0) {
        while (valstr.length<=n) valstr = "0"+valstr;
        var len = valstr.length;
        valstr = valstr.substring(0,len-n) +"."+ valstr.substring(len-n,len);
    } else if (n<0) {
        for (m=0; m>n; m--) valstr = valstr+"0";
    }
    return sgn+valstr;
}

Thanks,
tewari

Targol · Mar 5, 2008

Hi tewari.
The JS code you provided is how an object is defined in javascript.
In an object context, keyword "this" refers to the instance of the object currently running the code. As is, there is no risk of conflict between the different "this.xxx" instructions.

Error should come from elsewhere...

Please, provide the enclosing HTML page's source code in order to help understanding....

Water is not bad as long as it remains outside human body ;-)

BillyRayPreachersSon · Mar 5, 2008

I see that window.onload is not used in any of the libraries.

It is in the menu, although the other file uses the "onload" attribute in the body.

IMHO, you still want to follow my second piece of advice in my first post.

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

tewari68 · Mar 5, 2008

Hi,
This is my php page where I am calling both the header menu and the slider javascripts.

Code:

<html>
<head>
<SCRIPT SRC="<?echo $path."slider.js"?>"></SCRIPT>
<SCRIPT>
  var mySlider4 = new Slider( "Slider4" );
  mySlider4.defaultValue = "<?echo $senstvty;?>";
  with (mySlider4) {
       	            leftValue = -5;
                    rightValue = +5;
                    buttonImg = "<?echo "images/slider4button.gif"?>";
	            buttonHiliteImg = "<?echo "images/slider4hibutton.gif"?>";
	            buttonHoverImg = "<?echo  "images/slider4hobutton.gif"?>";
	            buttonWidth = 9;
	            buttonHeight = 18;
	            offsetX = 0;
	            offsetY = 2;
	            maxSlide = 200;
	            onmouseup = "this.setValue( this.getValue(0) )";
		    onchange = "document.slider4form.sliderval.value = this.getValue(2)";
	           }
function placeSliders() {
    for (var i=0; i<window.sliders.length; i++) {
            window.sliders[i].placeSlider();
	        }
		}
</SCRIPT>
</head>
<body  onLoad="placeSliders()">
<script type='text/javascript'>
//these are the menu variables
//HV Menu- by Ger Versluis ([URL unfurl="true"]http://www.burmees.nl/)[/URL]
//Submitted to Dynamic Drive ([URL unfurl="true"]http://www.dynamicdrive.com)[/URL]
//Visit [URL unfurl="true"]http://www.dynamicdrive.com[/URL] for this script and more

function Go(){return}

</script>
<script language='javascript'>

	var NoOffFirstLineMenus=5;			// Number of first level items
	var LowBgColor='white';			// Background color when mouse is not over
	var LowSubBgColor='white';			// Background color when mouse is not over on subs
	var HighBgColor='black';			// Background color when mouse is over
	var HighSubBgColor='black';			// Background color when mouse is over on subs
	var FontLowColor='black';			// Font color when mouse is not over
	var FontSubLowColor='black';			// Font color subs when mouse is not over
	var FontHighColor='white';			// Font color when mouse is over
	var FontSubHighColor='white';			// Font color subs when mouse is over
	var BorderColor='black';			// Border color
	var BorderSubColor='black';			// Border color for subs
	var BorderWidth=1;				// Border width
	var BorderBtwnElmnts=1;			// Border between elements 1 or 0
	var FontFamily="arial,comic sans ms,technical"	// Font family menu items
	var FontSize=9;				// Font size menu items
	var FontBold=1;				// Bold menu items 1 or 0
	var FontItalic=0;				// Italic menu items 1 or 0
	var MenuTextCentered='left';			// Item text position 'left', 'center' or 'right'
	var MenuCentered='left';			// Menu horizontal position 'left', 'center' or 'right'
	var MenuVerticalCentered='top';		// Menu vertical position 'top', 'middle','bottom' or static
	var ChildOverlap=.2;				// horizontal overlap child/ parent
	var ChildVerticalOverlap=.2;			// vertical overlap child/ parent
	var StartTop=240;				// Menu offset x coordinate
	var StartLeft=1;				// Menu offset y coordinate
	var VerCorrect=0;				// Multiple frames y correction
	var HorCorrect=0;				// Multiple frames x correction
	var LeftPaddng=3;				// Left padding
	var TopPaddng=2;				// Top padding
	var FirstLineHorizontal=1;			// SET TO 1 FOR HORIZONTAL MENU, 0 FOR VERTICAL
	var MenuFramesVertical=1;			// Frames in cols or rows 1 or 0
	var DissapearDelay=1000;			// delay before menu folds in
	var TakeOverBgColor=1;			// Menu frame takes over background color subitem frame
	var FirstLineFrame='navig';			// Frame where first level appears
	var SecLineFrame='space';			// Frame where sub levels appear
	var DocTargetFrame='space';			// Frame where target documents appear
	var TargetLoc='';				// span id for relative positioning
	var HideTop=0;				// Hide first level when loading new document 1 or 0
	var MenuWrap=1;				// enables/ disables menu wrap 1 or 0
	var RightToLeft=0;				// enables/ disables right to left unfold 1 or 0
	var UnfoldsOnClick=0;			// Level 1 unfolds onclick/ onmouseover
	var WebMasterCheck=1;			// menu tree checking on or off 1 or 0
	var ShowArrow=1;				// Uses arrow gifs when 1
	var KeepHilite=1;				// Keep selected path highligthed
	var Arrws=['tri.gif',5,10,'tridown.gif',10,5,'trileft.gif',5,10];	// Arrow source, width and height

function BeforeStart(){return}
function AfterBuild(){return}
function BeforeFirstOpen(){return}
function AfterCloseAll(){return}
var O = document.adminMenu.cid.value;

// Menu tree
//	MenuX=new Array(Text to show, Link, background image (optional), number of sub elements, height, width);
//	For rollover images set "Text to show" to:  "rollover:Image1.jpg:Image2.jpg"
document.write("Value =" + O);
Menu1=new Array("Home","[URL unfurl="true"]http://www.dynamicdrive.com"+O,"",0,20,138);[/URL]

Menu2=new Array("News","blank.htm","",2);
	Menu2_1=new Array("General","blank.htm","",5,20,150);	
		Menu2_1_1=new Array("CNN","[URL unfurl="true"]http://www.cnn.com","",0,20,150);[/URL]
		Menu2_1_2=new Array("ABCNews","[URL unfurl="true"]http://www.abcnews.com","",0);[/URL]
		Menu2_1_3=new Array("MSNBC","[URL unfurl="true"]http://www.msnbc.com","",0);[/URL]
                Menu2_1_4=new Array("CBSNews","[URL unfurl="true"]http://www.cbsnews.com","",0);[/URL]
                Menu2_1_5=new Array("Canadian News","[URL unfurl="true"]http://news.bbc.co.uk","",2);[/URL]
                          Menu2_1_5_1=new Array("Vancouver Sun","[URL unfurl="true"]http://www.vancouversun.com","",0,20,150);[/URL]
                          Menu2_1_5_2=new Array("CTV News","[URL unfurl="true"]http://www.ctvnews.com","",0);[/URL]
	Menu2_2=new Array("Technology","blank.htm","",3);
		Menu2_2_1=new Array("TechWeb","[URL unfurl="true"]http://www.techweb.com","",0,20,200);[/URL]
		Menu2_2_2=new Array("News.com","[URL unfurl="true"]http://www.news.com","",0);[/URL]
		Menu2_2_3=new Array("Wired News","[URL unfurl="true"]http://www.wired.com","",0);[/URL]

Menu3=new Array("Search Engines","blank.htm","",3);
	Menu3_1=new Array("Altavista","[URL unfurl="true"]http://www.altavista.com","",0,20,150);[/URL]
	Menu3_2=new Array("Google","[URL unfurl="true"]http://www.google.com","",0);[/URL]
	Menu3_3=new Array("Yahoo","[URL unfurl="true"]http://www.yahoo.com","",0);[/URL]

Menu4=new Array("Webmaster","blank.htm","",4);
	Menu4_1=new Array("Dynamic Drive","[URL unfurl="true"]http://www.dynamicdrive.com","",0,20,180);[/URL]
	Menu4_2=new Array("JavaScript Kit","[URL unfurl="true"]http://www.javascriptkit.com","",0);[/URL]
	Menu4_3=new Array("Freewarejava","[URL unfurl="true"]http://www.freewarejava.com","",0);[/URL]
	Menu4_4=new Array("Web Review","[URL unfurl="true"]http://www.webreview.com","",0);[/URL]

Menu5=new Array("Other","javascript:top.location.href='blank.htm'","",1);
	Menu5_1=new Array("Author\'s Site","[URL unfurl="true"]http://www.burmees.nl/","",0,20,140);[/URL]
	
	</script>
	<script type='text/javascript' src='menu_com.js'></script>
	
	
	<? echo "Slider Stuff Starts Here";?>
	
	<table width=550 border=0 cellpadding=4 cellspacing=2 align=center>
	 <tr>
		  <td colspan="3"><IMG SRC="<?echo "images/slider4bg.gif"?>" NAME="Slider4RailImg" ID="Slider4RailImg"></td>
		  <td>&nbsp;&nbsp;&nbsp;<INPUT type="text" SIZE="5" NAME="sliderval" VALUE="<?echo $senstvty;?>">
		<INPUT TYPE = hidden Name=domainid value="<?echo $domainid;?>">
		<!--<INPUT TYPE="submit" VALUE="apply">-->
		<input type = hidden NAME="senstvty" value = "<?echo $senstvty;?>"></td>
		 </tr>
		</table>
		<SCRIPT>
mySlider4.writeSlider();
</SCRIPT>
</body>
</html>

Thanks,

Targol · Mar 6, 2008

So, after a look at the code you provided and downloaded the menu framework, I think I found your problem :
at lines 46 and 47 of the menu_com.js, you've got the following code :

Code:

	if(Trigger.onload)Dummy=Trigger.onload;
	Trigger.onload=Go;

I think that these lines remove the previously "onLoad" event catcher ("placeSliders()" function) that you put in your Body tag by a call to the "Go" function.

In order for the the menu AND the sliders to work you can, for example, replace these lines by the following :

Code:

	if(Trigger.onload)Dummy=Trigger.onload;
	Trigger.onload=pageOnLoad;

... and, in your php page, add the following lines inside one script tag (for example after the placeSliders function :

Code:

function pageOnLoad() {
   placeSliders();
   Go();
}

This should work, I think...

Water is not bad as long as it remains outside human body ;-)

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Loading two javascript libraries on one page

tewari68

Programmer

BillyRayPreachersSon

Programmer

tewari68

Programmer

Targol

Technical User

BillyRayPreachersSon

Programmer

tewari68

Programmer

Targol

Technical User

Similar threads

Part and Inventory Search

Sponsor