SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Wizard Dangermouse's Avatar
    Join Date
    Oct 2003
    Posts
    1,024
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Is this a good way?

    Code:
    <noscript><acronym title="Who, what and where I am"></noscript>
    <a href="about.php" id="about" onmouseover="desc(this.id);">About</a>
    <noscript></acronym></noscript>
    If somebody has JS off, it will show an acronym, else if they have JS on, it will use JS to show the description in a little div i have (which uses the same method to hide the div).

    Is it worth the extra code, is there a better way?

    Thanks

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,385
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Is this a good way?


    I don't think so because it's invalid code . You can't have your code stretching into 2 noscript tags.

    Where does the acronym come into it anyway. I couldn't see that about was an acronym for anything.

    If you want a pop up for a link then you could use css as follows. It's probably going to be seen in as many browsers as the javascript version would (if not more).

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <style type="text/css" media="screen">
    p#tips a {
    text-decoration:none;
    border-bottom:2px solid green;
    color: #FF0000;
    }
    p#tips a:hover {
    color: #666666;
    background: #FFFFCC;
    text-decoration: none;
    }
    p#tips a span {display: none;}
    p#tips a:hover span {
    display: block;
    position: absolute;
    top: 50px;
    left: 10%;
    width: 200px;
    padding: 5px;
    margin: 10px;
    z-index: 100;
    color: #0000CC;
    background: #FFFFCC;
    font: 10px Verdana, Arial, Helvetica, sans-serif;
    text-align: center;
    border: 1px solid #666666;
    text-decoration: none;
    }
    </style>
    </head>
    <body>
    <p id="tips">This is some text :<a href="#" title="Some more info"> <strong>Mouse over 
    here </strong><span> (This is the help text that will be displayed on rollover 
    in compliant browsers : This is the help text that will be displayed on rollover 
    in compliant browsers. This is the help text that will be displayed on rollover 
    in compliant browsers : This is the help text that will be displayed on rollover 
    in compliant browsers. ) </span></a> this is some more text:</p>
    </body>
    </html>
    If that's not what you meant sorry

    Paul

  3. #3
    SitePoint Wizard Dangermouse's Avatar
    Join Date
    Oct 2003
    Posts
    1,024
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks ill give it a try when i get home


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
  •