Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Two stage rollover

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #167888
    dexterhartley
    Participant

    Hope someone can help with this one:

    http://dxtr.co.uk/pbtest/
    and
    http://dxtr.co.uk/pbtest/index2.html

    I’m trying to implement a two stage rollover based on this fiddle: http://jsfiddle.net/6hsfx/1/

    I’d like like the states to appear like the second two panels in this image:
    http://dxtr.co.uk/pbtest/images/example.jpg

    If you look at index2.html the rollover appears from the edge of the page.

    I basically need to combine the two effects, so how do I make the rollover appear relative to the div, but hidden until it’s needed?

    thanks!

    #167889
    Paulie_D
    Member

    Rollover/Hovers only have two states On and Off so a 2 stage hover rollover isn’t possible…quite.

    It’s not entirely clear what you are trying to do though.

    We can change the background and add transition effects…that’s no problem.

    Exactly what do you want the ‘text’ div to do and when?

    It’s doable (based on a guess of your requirements) but we need more information.

    #167890
    Paulie_D
    Member

    Based on my assumptions I have this:

    http://codepen.io/Paulie-D/pen/uvjJA/

    I don’t have access to your font so it’s not exact but I figure it will get you started.

    #167907
    dexterhartley
    Participant

    Nice solution, I’ll see how I can incorporate the icon font.

    Thanks for the help.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.