Preserved Topic: A Div rollover Script — OZONE Asylum, home of the Mad Scientists

Preserved Topic: A Div rollover Script (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=17963" title="Pages that link to Preserved Topic: A Div rollover Script (Page 1 of 1)" rel="nofollow" >Preserved Topic: A Div rollover Script <span class="small">(Page 1 of 1)</span>\$

WarMage Maniac (V) Mad Scientist From: Rochester, New York, USA Insane since: May 2000	posted 05-13-2001 01:46 I modified max's rollover code the code handles bother the regular button, the button-over as well as button-on. I am wondering if I coded this correctly or if there would be a better way to go about achomplishing this. The code is below as well as how it is called. If you like it feel free to use it. code: <script type="text/javascript" language="JavaScript"> <!-- ; // Written by mr.maX, [url=http://www.max.co.yu/]http://www.max.co.yu/[/url] // Modified by WarMage warmage_666@hotmail.com function getObj(name) { if (document.getElementById) { return document.getElementById(name).style; } else if (document.all) { return document.all[name].style; } else if (document.layers) { return document.layers[name]; } } var layers = new Array( 'page1', 'pag2', 'page3', 'page4', 'page5', 'page6', 'page7' // <- no comma at the last entry ); function show() { for (i=0; i < layers.length; i++) { if (layers[i] == arguments[0]) { getObj(layers[i]).visibility = 'visible'; } else { getObj(layers[i]).visibility = 'hidden'; } } } function hideAll() { for (i=0; i < layers.length; i++) getObj(layers[i]).visibility = 'hidden'; } var previous = null; function masterControl (theObject, theLayer, theEvent) { if (theEvent == 'onMouseOver' && theObject.className != 'button-on') theObject.className = 'button-over'; else if (theEvent == 'onMouseOut' && theObject.className != 'button-on') theObject.className = 'button'; else if (theEvent == 'onClick') { show(theLayer,theObject); theObject.className = 'button-on'; if (previous != null && previous != theObject) { previous.className = 'button'; previous = theObject; } } } //--> </script> And below is how it is called. <body onload="masterControl(button1,'intro','onClick');previous=button1"> <div class="button" id="button1" onMouseOut="masterControl (button1,'page1,'onMouseOut');" onMouseOver="masterControl (button1,'page1','onMouseOver');" onClick="masterControl(button1,'page1','onClick');"><b>Page 1</b></div> <div class="button" id="button2" onMouseOut="masterControl (button2,'page2,'onMouseOut');" onMouseOver="masterControl (button2,'page2','onMouseOver');" onClick="masterControl(button2,'page2','onClick');"><b>Page 2</b></div> etc... for however many buttons you have. You will need to define the different classes 'button', 'button-over' and 'button-on' for this to work well. I hope that you will find it useful, or will be able to lend me tips on how to imporve upon the code. I just realised the script now does not work under Netscape 6. I believe the problem is in changing the className. Anyone know how I could fix this? You can view my versiona at http://www.jackassjokes.com/submission <edit>Bug Fix</edit> <edit>Problem Found</edit> [This message has been edited by WarMage (edited 05-13-2001).]
linear Paranoid (IV) Inmate From: other places Insane since: Mar 2001	posted 05-13-2001 05:53 Hey man, that page doesn't even have a DIV or a script tag in it.
WarMage Maniac (V) Mad Scientist From: Rochester, New York, USA Insane since: May 2000	posted 05-13-2001 05:59 Ah, you got the non IE 5.5 or NS 6 page. It does an SSI redirect. Because it will be broke on all other browsers (unfortunatly broke on NS 6 anyways). The actual page is http://www.jackassjokes.com/submission/cool.html for lack of a better name. [This message has been edited by WarMage (edited 05-13-2001).]
linear Paranoid (IV) Inmate From: other places Insane since: Mar 2001	posted 05-15-2001 23:35 You sly dog, you.
WarMage Maniac (V) Mad Scientist From: Rochester, New York, USA Insane since: May 2000	posted 05-16-2001 04:57 Not that sly, so would you or anyone else know how to fix the NS 6 problem?

I modified max's rollover code the code handles bother the regular button, the button-over as well as button-on. I am wondering if I coded this correctly or if there would be a better way to go about achomplishing this. The code is below as well as how it is called. If you like it feel free to use it.

code:

<script type="text/javascript" language="JavaScript">

<!-- ;



// Written by mr.maX, [url=http://www.max.co.yu/]http://www.max.co.yu/[/url] 

// Modified by WarMage warmage_666@hotmail.com



function getObj(name) {

    if (document.getElementById) {

        return document.getElementById(name).style;

    } else

    if (document.all) {

        return document.all[name].style;

    } else

    if (document.layers) {

        return document.layers[name];

    }

}



var layers = new Array(

'page1',

'pag2',

'page3',

'page4',

'page5',

'page6',

'page7' // <- no comma at the last entry

);



function show() {

    for (i=0; i < layers.length; i++) {

		if (layers[i] == arguments[0]) { 

			getObj(layers[i]).visibility = 'visible';

		} else {

			getObj(layers[i]).visibility = 'hidden';

		}

	}

}

    

function hideAll() {

    for (i=0; i < layers.length; i++) getObj(layers[i]).visibility = 'hidden';

}



var previous = null;



function masterControl (theObject, theLayer, theEvent)

{

	if (theEvent == 'onMouseOver' && theObject.className != 'button-on')

		theObject.className = 'button-over';

	else if (theEvent == 'onMouseOut' && theObject.className != 'button-on')

		theObject.className = 'button';

	else if (theEvent == 'onClick')

	{

		show(theLayer,theObject);

		theObject.className = 'button-on';

		if (previous != null && previous != theObject)

		{

			previous.className = 'button';

			previous = theObject;

		}

	}

}



//-->

</script>

And below is how it is called.

<body onload="masterControl(button1,'intro','onClick');previous=button1">

<div class="button" id="button1" onMouseOut="masterControl
(button1,'page1,'onMouseOut');" onMouseOver="masterControl
(button1,'page1','onMouseOver');" onClick="masterControl(button1,'page1','onClick');"><b>Page 1</b></div>

<div class="button" id="button2" onMouseOut="masterControl
(button2,'page2,'onMouseOut');" onMouseOver="masterControl
(button2,'page2','onMouseOver');" onClick="masterControl(button2,'page2','onClick');"><b>Page 2</b></div>

etc... for however many buttons you have.

You will need to define the different classes 'button', 'button-over' and 'button-on' for this to work well.

I hope that you will find it useful, or will be able to lend me tips on how to imporve upon the code.

I just realised the script now does not work under Netscape 6. I believe the problem is in changing the className. Anyone know how I could fix this? You can view my versiona at http://www.jackassjokes.com/submission

<edit>Bug Fix</edit>
<edit>Problem Found</edit>

[This message has been edited by WarMage (edited 05-13-2001).]

Preserved Topic: A Div rollover Script (Page 1 of 1)