Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Jul 2002
    Location
    Lingle, Wy
    Posts
    46
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Mouseover/Window.status

    I have been trying to incorporate a mouseover effect menu with window.status.
    The Main menu is displayed when you click on the menu icon(button).
    See site:http://www.proamrodeo.com

    The following is what I have been trying to do.

    (1) I have preloaded the images and given them the window.status text message.

    (2) I have placed them into an array

    (3) NEED FUNCTION TO GET THEM TO DISPLAY (Please Help)

    (4) This part of the script makes the main 7 part menu appear and disappear.

    The following is the code I have been trying to write for this menu.

    Should be pretty simple but I can't see it, can you?



    <HTML>
    <HEAD>
    <TITLE></TITLE>
    <META name="description" content="">
    <META name="keywords" content="">

    <script language="javascript" type="text/javascript">
    <!--
    /*
    * Pre-load the specified image. This loads the image as the page
    * loads, so that when it is used later (such as for a mouseover effect),
    * the image has already been loaded. It includes the window status text
    */

    // (1) Window Status content goes here (image, window status)
    var winStat = new Array();
    // multi-dimensional arrays containing:
    // mouseover images and text for window status

    //Menu Button
    winStat[0] = new Array('http://www.proamrodeo.com/gif/menu/Menu-over.gif','Click For Expanded Menu.'");
    winstat[1] = new Array('http://www.proamrodeo.com/gif/menu/Menu-down.gif','Click For Expanded Menu.'");
    winStat[2] = new Array('http://www.proamrodeo.com/gif/menu/Menu.gif',''");

    //About_Us Button
    winStat[3] = new Array('http://www.proamrodeo.com/gif/menu/About_Us-over.gif','Meet Our Board Of Directors and Membership Affilates'");
    winStat[4] = new Array('http://www.proamrodeo.com/gif/menu/About_Us-down.gif','Meet Our Board Of Directors and Membership Affiliates'");
    winStat[5] = new Array('http://www.proamrodeo.com/gif/menu/About_Us.gif',''");

    //Partners Button
    winStat[6] = new Array('http://www.proamrodeo.com/gif/menu/Partners-over.gif','Meet Our Partners and Affiliates.'");
    winStat[7] = new Array('http://www.proamrodeo.com/gif/menu/Partners-down.gif','Meet Our Partners and Affiliates.'");
    winStat[8] = new Array('http://www.proamrodeo.com/gif/menu/Partners.gif',''");

    //Contact Button
    winStat[9] = new Array('http://www.proamrodeo.com/gif/menu/Contact-over.gif','To Get In Touch with Us: Contacts, Email and Addresses.'");
    winStat[10] = new Array('http://www.proamrodeo.com/gif/menu/Contact-down.gif','To Get In Touch with Us: Contacts, Email and Addresses.'");
    winStat[11] = new Array('http://www.proamrodeo.com/gif/menu/Contact.gif',''");

    //Results Button
    winStat[12] = new Array('http://www.proamrodeo.com/gif/menu/Results-over.gif','Coming! Our RealTime Online Results Of Your Association.'");
    winStat[13] = new Array('http://www.proamrodeo.com/gif/menu/Results-down.gif','Coming! Our RealTime Online Results Of Your Association.'");
    winStat[14] = new Array('http://www.proamrodeo.com/gif/menu/Results.gif',''");

    //Entry Button
    winStat[15] = new Array('http://www.proamrodeo.com/gif/menu/Entry-over.gif','Coming! Schedules With 2D/3D Map and Online Entry.'");
    winStat[16] = new Array('http://www.proamrodeo.com/gif/menu/Entry-down.gif','Coming! Schedules With 2D/3D Map and Online Entry.'");
    winStat[17] = new Array('http://www.proamrodeo.com/gif/menu/Entry.gif',''");

    //Links Button
    winStat[18] = new Array('http://www.proamrodeo.com/gif/menu/Links-over.gif','Assorted Links To Other Sites.'");
    winStat[19] = new Array('http://www.proamrodeo.com/gif/menu/Links-down.gif','Assorted Links To Other Sites.'");
    winStat[20] = new Array('http://www.proamrodeo.com/gif/menu/Links.gif',''");

    //Downloads Button
    winStat[21] = new Array('http://www.proamrodeo.com/gif/menu/Links-over.gif','Assorted Links To Other Sites.'");
    winStat[22] = new Array('http://www.proamrodeo.com/gif/menu/Links-down.gif','Assorted Links To Other Sites.'");
    winStat[23] = new Array('http://www.proamrodeo.com/gif/menu/Links.gif',''");


    // (2) Assemble Array For Menu
    // preload images that are to appear as mouseover effect and in message tray
    // from arrays above
    if (document.images) {
    var theImgs = new Array();
    for (var i=0; i<winStat.length; i++) {
    theImgs[i] = new Image();
    theImgs[i].src = winStat[i][0];
    }
    }

    // (3) Function For Mouseover window Status display and Mouse over effects

    function dowinStat(img,stat){

    //Don't Know What To Put In Here

    document.images['About_us'].src =img;
    window.status=stat;

    //Need To Replace The Above 2 Lines With Something To display The Mouseover Images and The Window Status

    return true;
    }

    // (4) OnClick Menu Make Full Menu Appear
    function show(layerid)
    {
    if (document.getElementById) // IE and NS6
    {
    elm=document.getElementById(layerid)
    if(elm.style.visibility=="visible")
    {
    elm.style.visibility="hidden"
    }
    else
    {
    elm.style.visibility="visible"
    }
    }
    if(document.layers)
    {
    obj=eval("document."+layerid)
    if(obj.visibility=="show")
    {
    obj.visibility="hide"
    }
    else
    {
    obj.visibility="show"
    }
    }
    }
    // End OnClick Menu Make Full Menu Appear
    // End Menu and Window Status Script

    //-->
    </script>
    </HEAD>
    <BODY>

    <DIV STYLE="position:absolute; top:260px; left:340px; width:90px; border-width:0; visibility: visible; z-index:1">
    <a href="javascript:void(0);" onfocus="this.blur();" onclick="show('mytexta')"
    onMouseOver="dowinStat(event,0)"
    onMouseOut="dowinStat(event,2)"
    onMouseDown="dowinStat(event,1)"
    onMouseUp="dowinStat(event,0)">
    <img name="Menu" src="http://www.proamrodeo.com/gif/menu/Menu.gif" width="88" height="38" vspace="0" border="0" alt="Menu"></a><br>
    </DIV>

    <DIV id="mytexta" STYLE="position:absolute; top:230px; left:540px; width:90px; border-width:0; visibility:hidden; z-index:1">
    <a href="javascript:void(0);" onfocus="this.blur()"
    onMouseOver="dowinStat(event,3)"
    onMouseOut="dowinStat(event,5)"
    onMouseDown="dowinStat(event,4)"
    onMouseUp="dowinStat(event,3)">
    <img name="About_Us" src="http://www.proamrodeo.com/gif/menu/About_Us.gif" width="90" height="40" vspace="0" border="0" alt="About Us"></a><br>

    <a href="javascript:void(0);" onfocus="this.blur()"
    oonMouseOver="dowinStat(event,6)"
    onMouseOut="dowinStat(event,8)"
    onMouseDown="dowinStat(event,7)"
    onMouseUp="dowinStat(event,8)">
    <img name="Partners" src="http://www.proamrodeo.com/gif/menu/Partners.gif" width="90" height="40" vspace="0" border="0" alt="Check Out Our Partners"></a><br>

    <a href="http://www.proamrodeo.com/contact.htm" onfocus="this.blur()" target="_new" onMouseOver="dowinStat(event,9)"
    onMouseOut="dowinStat(event,11)"
    onMouseDown="dowinStat(event,10)"
    onMouseUp="dowinStat(event,11)">
    <img name="Contact" src="http://www.proamrodeo.com/gif/menu/Contact.gif" width="90" height="40" vspace="0" border="0" alt="Contact Us"></a><br>

    <a href="javascript:void(0);" onfocus="this.blur()"
    onMouseOver="dowinStat(event,12)"
    onMouseOut="dowinStat(event,14)"
    onMouseDown="dowinStat(event,13)"
    onMouseUp="dowinStat(event,14)">
    <img name="Results" src="http://www.proamrodeo.com/gif/menu/Results.gif" width="90" height="40" vspace="0" border="0" alt="Results"></a><br>

    <a href="#" onfocus="this.blur()"
    onMouseOver="dowinStat(event,15)"
    onMouseOut="dowinStat(event,17)"
    onMouseDown="dowinStat(event,16)"
    onMouseUp="dowinStat(event,17)">
    <img name="Entry" src="http://www.proamrodeo.com/gif/menu/Entry.gif" width="90" height="40" vspace="0" border="0" alt="Entry"></a><br>

    <a href="javascript:void(0);" onfocus="this.blur()"
    onMouseOver="dowinStat(event,18)"
    onMouseOut="dowinStat(event,20)"
    onMouseDown="dowinStat(event,19)"
    onMouseUp="dowinStat(event,20)">
    <img name="Links" src="http://www.proamrodeo.com/gif/menu/Links.gif" width="90" height="40" vspace="0" border="0" alt="Links To Related Sites"></a><br>

    <a href="javascript:void(0);" onfocus="this.blur()"
    onMouseOver="dowinStat(event,21)"
    onMouseOut="dowinStat(event,23)"
    onMouseDown="dowinStat(event,22)"
    onMouseUp="dowinStat(event,23)">
    <img name="Downloads" src="http://www.proamrodeo.com/gif/menu/Downloads.gif" width="90" height="40" vspace="0" border="0" alt="Downloads"></a><br>
    </div>
    </BODY>
    Last edited by craig; 08-03-2002 at 09:45 PM.
    Thank You.

  • #2
    Regular Coder
    Join Date
    Jul 2002
    Location
    Western US
    Posts
    169
    Thanks
    0
    Thanked 0 Times in 0 Posts
    There is a lot here so I will tell you what I had to fix to make this work.

    First, your array is delared wrong and is giving an error. You have '"); at the end of every declaration of winStat. This is an easy enough fix, remove that extra " and it will become a valid array.

    The winStat[1] is winstat[1], it needs to be winStat[1]. That should take care of the array.

    Next, your function now needs to be
    Code:
    function dowinStat(img,stat){
    	window.status= winStat[stat][1];
    	document.images[img].src = winStat[stat][0];
    	return true;
    }
    With this function you need to be sure to pass the name of the image to be replaced. You currently have it trying to pass, event. I'm not sure what that is all about, or if you were going to add the show/hide cuntionality with that, but pass it the image name as a string, and be sure to return that true back. Otherwise the mouseover message will not stay.

    <a href="javascript:void(0);"
    onMouseOver="return dowinStat('Menu',0);"
    onMouseOut="return dowinStat('Menu',2);"
    onMouseDown="return dowinStat('Menu',2);"
    onMouseUp="return dowinStat('Menu',0);">
    <img name="Menu" src="./Menu.gif" width="88" height="38" vspace="0" border="0" alt="Menu"></a>

    ShriekForth


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •