Results 1 to 6 of 6

Thread: onMouseover Link Effects

  1. #1
    Join Date
    Apr 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default onMouseover Link Effects

    Script: onMouseover Link Effects
    http://www.dynamicdrive.com/dynamicindex5/linkover.htm


    When using this code, the effect is applied to ALL links on a page. How can the effect be nullified for one or more individual links on the page.

  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

    OK, this is pretty easy, the style generated for this effect will look something like this example I just generated:

    Code:
    <!-DHTML scripts by Dynamic Drive (http://www.dynamicdrive.com)-->
    <style>
    a:hover{color:black; font-weight:bold; font-size:95%; background-color:yellow; }
    </style>
    There are many things one can do to limit this effect but, for simplicity's sake I will cover just one. Change the code to this (change highlight red):

    Code:
    <!-DHTML scripts by Dynamic Drive (http://www.dynamicdrive.com)-->
    <style>
    a.efct:hover{color:black; font-weight:bold; font-size:95%; background-color:yellow; }
    </style>
    We have just created a class called efct. It could have been called just about anything. Now we can apply this class to only those links we want to have this effect, like so:

    HTML Code:
    <a class="efct" href="some.htm">Click for Some Page</a>
    Now only the anchor (link) tags we apply this class name to will use the effect, all others will use whatever is default for the page.
    - John
    ________________________

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

  3. #3
    Join Date
    Apr 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    jscheuer1

    Thank you very much for your help! Your solution performed precisely as you indicated. I did not experience any complications.

    With gratitude,

    Jacob

  4. #4
    Join Date
    Apr 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    jscheuer1,

    I had approximately a dozen pages to rework with the solution you provided, resulting in completely satisfactory results-- except for one page. That, I discovered, after I signed off.

    Now, here follows the conundrum.

    Because the hyperlink on the page in question involves a script, I do not know how to alter the code, or the basic concept which you provided, in order to affect the desired result.

    I believe the fix is probably quite simple, but every variation I have tried has failed.

    I have stripped the essential components from the page I need to rework and isolated them here for you.

    I hope once again you are able to assist me.

    It is the "xyz text" which I do NOT want to embolden with the mouseover.

    __________________________

    <html>
    <head>
    <style><!--a:hover{color:800000; font-weight:bold; }--></style>
    </head>
    <body>
    <script language="JavaScript" FONT face="copperplate gothic light,times new roman,arial" color="#ff0000" src="http://www.worldnetdaily.com/affiliates/code-grab/wnd_headlines.asp"> </script>
    <a href="specified url here"><font style="font-family: arial; font-size: 14pt; color: #000000;">xyz text</font>
    </body>
    </html>

  5. #5
    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

    Code:
    <html>
    <head>
    <style><!--a:hover{color:800000; font-weight:bold; }--></style>
    </head>
    <body>
    <script language="JavaScript" FONT face="copperplate gothic light,times new roman,arial" color="#ff0000" src="http://www.worldnetdaily.com/affiliates/code-grab/wnd_headlines.asp"> </script>
    <a href="specified url here" style="font-weight:normal;"><font style="font-family: arial; font-size: 14pt; color: #000000;">xyz text</font>
    </body>
    </html>
    - John
    ________________________

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

  6. #6
    Join Date
    Apr 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Problem solved. Thank you for all of your help.

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
  •