Image Box Rollover Caption Help

Discussion in 'CSS' started by powerlifer, Oct 27, 2009.

  1. #1
    Hello, i was wondering how this site achieves this effect and whether its done by css alone?

    when you scroll over any of the square sites a little black box comes up with links and text in it.

    http://www.cssluxury.com/

    any help on how this effect is achieved is appreciated.

    Cheers
    Chris
     
    powerlifer, Oct 27, 2009 IP
  2. MhW

    MhW Active Member

    Messages:
    370
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    85
    #2
    jQuery, several examples here.

    Tutorial here. ;)
     
    MhW, Oct 27, 2009 IP
  3. powerlifer

    powerlifer Active Member

    Messages:
    2,002
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    78
    #3
    thank you ill need to read more into jquery.

    so their is no way css could do this alone then, and whats the backwards compatibility like with jquery is it going to be a problem for older and text based browsers?

    it is a nice effect though.
     
    powerlifer, Oct 28, 2009 IP
  4. MhW

    MhW Active Member

    Messages:
    370
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    85
    #4
    You could do this using pure CSS, but you wouldn't be able use a sliding effect. It would be case of *hover over*...links show...*mouse exits*...message disappears. At the end of the day it's not as attractive as its jQuery alternative.

    As for the backwards compatibility, they have a Browser Compatability Guide on their website. Check it out :)
     
    MhW, Oct 28, 2009 IP
  5. powerlifer

    powerlifer Active Member

    Messages:
    2,002
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    78
    #5
    much appreciated once again mate:).

    cheers
     
    powerlifer, Oct 28, 2009 IP