Advanced Search

Results 1 to 3 of 3

Thread: Switch Content link colors

  1. #1
    Join Date
    Sep 2004
    Location
    Tallahassee, FL USA
    Posts
    180
    Thanks
    39
    Thanked 1 Time in 1 Post

    Default Switch Content link colors

    1) Script Title: Switch Content script

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tchcontent.htm

    3) Describe problem: I'm revisiting an old issue trying to see if it can be fixed. On this test page http://www.floridacompact.org/awardw...inkcolors.html I was able to get the link colors to display in red, but I've had no luck getting the links to change color on hover. I've tested the instructions in the following threads:
    http://www.dynamicdrive.com/forums/s...+content+color
    http://www.dynamicdrive.com/forums/s...+content+hover

    My goal: To have the page open with the link colors in red. When hovering over the links, the color changes to blue. When the links are collapsed they turn red again.

    When I was finally able to get the hover to work using this thread - http://www.dynamicdrive.com/forums/s...+content+hover - the page loaded with the links all in black.

    Help with this would be greatly appreciated.
    Deborah

    When I have been able to get the hover to work, the page loads
    Deborah Whipp
    Web Designer
    Tallahassee, FL
    www.DWWebDesigns.com

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,694
    Thanks
    43
    Thanked 3,131 Times in 3,096 Posts
    Blog Entries
    12

    Default

    Once you apply style color inline to an element as this script does, it becomes difficult to set its hover color. You can add:

    Code:
    .handcursor:hover {color: blue !important;}
    or if this is the color you're going for:

    Code:
    .handcursor:hover {color: #6bd7d0 !important;}
    to the stylesheet. It works in at least some browsers, perhaps all - well not IE 6 and less - no hover styles on elements other than anchor links in IE 6 and less.

    Anyways, where you have:

    Code:
    trade.setColor('#8d0932', '#8d0932', '#6bd7d0', '#6bd7d0')
    Unless you've modified the script, the highlighted values are ignored. The other two tell the triggers to be #8d0932 regardless of whether they're expanded or not. According to the docs, the first one is the expanded color, the second is the contracted color.

    The style I'm telling you to add in the stylesheet is the hover color. It will be in force during a hover of a trigger regardless of the expanded or contracted state, and regardless of what colors you may choose (if you change the scripted ones mentioned above) for the expanded and contracted states.

    Now you've said you want:

    To have the page open with the link colors in red. When hovering over the links, the color changes to blue. When the links are collapsed they turn red again.
    That doesn't mention what color you want when they are expanded and not hovered, might that be blue or #6bd7d0 as well?

    If so, set this part like so:

    Code:
    trade.setColor('#6bd7d0', '#8d0932')
    and for the added style in the stylesheet use:

    Code:
    .handcursor:hover {color: #6bd7d0 !important;}
    If you want it some other way, please be more precise.

    One thing you cannot have, unless we modify the script is a hover color that changes when expanded. And even with that, you cannot have a hover color for when it's contracted before opening that's different than the hover color when contracted after having been closed.
    - John
    ________________________

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

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    dmwhipp (07-08-2012)

  4. #3
    Join Date
    Sep 2004
    Location
    Tallahassee, FL USA
    Posts
    180
    Thanks
    39
    Thanked 1 Time in 1 Post

    Default

    Thanks John - I updated the coding on the page, removed the ignored and it's working perfectly. You're always a huge help
    Deborah
    Deborah Whipp
    Web Designer
    Tallahassee, FL
    www.DWWebDesigns.com

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
  •