SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    grasshoppa Snowbird122's Avatar
    Join Date
    Apr 2001
    Location
    Austin
    Posts
    353
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    easy text mouseover question

    I want to make a different word appear on part of a page depending on mouseover events from some text. For example, if they mouseover link1, the text says "one", if they mouseover link2, the text says "two". The only way I can do this is by using the form and saying

    <form name="formname">
    <input type="text" name="inputname" onmouseover = "javascript: formname.inputname.value = 'whatever'">

    This puts the correct text into the textbox, but how can I do it without a text box? divs?
    http://www.echo-consulting.net - Sound Solutions for Online Inspriations.

  2. #2
    SitePoint Member
    Join Date
    May 2001
    Location
    ON, Canada
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,
    because of the very different approachs MS and Netscape use in operating dynamic HTML in their browsers creating a good script to change content of something dynamically (not a form) compatible with both browsers may not be as easy as it seems.

    The following code runs a dummy example of what you need both in MSIE and Netscape. The trick is that the layer object used in Netscape DOM should be closed after each modification and the script for NN should be _after_ the closing <html> tag.

    <html>
    <script language="JavaScript">
    // By Alex Osokin.


    //detect browser

    //some unknown browser initially
    var br=0;

    //MSIE
    if (document.all)
    br=1;
    //NN
    if (document.layers)
    br=2;

    //generic function
    function on_over()
    {
    if(br!=0)
    {
    if(br==1) //MSIE
    {msie_on_over();}
    else //NN
    {nn_on_over();}
    }
    }

    function on_out()
    {
    if(br!=0)
    {
    if(br==1)//MSIE
    msie_on_out();
    else //NN
    nn_on_out();
    }
    }

    //MSIE functions
    function msie_on_over()
    {
    document.all.t.innerHTML="Mouse is over";

    }

    function msie_on_out()
    {
    document.all.t.innerHTML="Mouse is out";
    }

    </script>

    <body bgcolor="white">
    <script language="JavaScript">
    //create a div for MSIE
    if(br==1)
    document.write("<div id=t name=t onMouseOver=on_over(); onMouseOut=on_out();>Mouse is out</div>");
    else //create layer for NN
    document.write("<layer id=t onMouseOver=on_over(); onMouseOut=on_out();>Mouse is out</layer>");
    </script>
    </body>
    </html>
    <script language="JavaScript">
    //NN functions
    function nn_on_over()
    {

    document.t.document.write("Mouse is over");
    document.t.document.close();

    }

    function nn_on_out()
    {
    document.t.document.write("Mouse is out");
    document.t.document.close();
    }
    </script>

    For production this code may require some optimization of course, but basically it works. Let me know if this helped.
    Regards,
    Alex Osokin - CTO

    The Web Hosting Portal http://www.findsp.com
    Hosting Forums: http://www.findsp.com/forum
    Web Hosting Newsletter: http://www.findsp.com/hosting/newsletter

  3. #3
    grasshoppa Snowbird122's Avatar
    Join Date
    Apr 2001
    Location
    Austin
    Posts
    353
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wow a whole page of code for me! Thanks a lot for your help Alex.
    http://www.echo-consulting.net - Sound Solutions for Online Inspriations.


Bookmarks

Posting Permissions

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