Results 1 to 2 of 2

Thread: scripting in columns of a table (HTML4)

  1. #1
    Join Date
    Feb 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default scripting in columns of a table (HTML4)

    Hello to you all. I'm actually new to HTML coding and sripting, so please bear with me, lol.

    I want to find out how to display a message in one column of a table (having two columns) when the mouse is over some text in the other column. In this i would like to use pure HTML and/or Javascript bt not CSS.
    Any help and suggestions would be greatly appreciated.
    Regards,

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Why you would want to avoid css style (completely?) is beyond me. Perhaps I have misunderstood though. Css is the best way to style your page, regardless of anything else that you are doing. Here is a demo with absolutely no css:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">
    function targ_cell(pos, cntnt, cll){
    var bcll=cll;
    if(pos=='p'){
    while(cll=cll.previousSibling)
    if(cll.tagName&&cll.tagName.toLowerCase()=='td')
    break
    }
    else{
    while(cll=cll.nextSibling)
    if(cll.tagName&&cll.tagName.toLowerCase()=='td')
    break
    }
    if(cll&&cll!=bcll&&cll.tagName&&cll.tagName.toLowerCase()=='td')
    cll.innerHTML=cntnt;
    else alert('No '+(pos=='p'? 'previous' : 'next')+' Cell available in this row!');
    }
    </script>
    </head>
    <body>
    <table width="300" border="1" cellpadding="2" cellspacing="2">
    <tr>
    <td width="45%">&nbsp;</td>
    <td width="45%" onmouseover="targ_cell('p', 'Hello!', this);" onmouseout="targ_cell('p', '&nbsp;', this);">hi</td>
    </tr>
    <tr>
    <td width="45%" onmouseover="targ_cell('n', 'Goodbye', this);" onmouseout="targ_cell('n', '&nbsp;', this);">See ya</td>
    <td width="45%">&nbsp;</td>
    </tr>
    </table>
    
    </body>
    </html>
    Last edited by jscheuer1; 02-06-2007 at 05:10 PM. Reason: Upgrade missing cell detection
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

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
  •