[Ask]Image Effect

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
nitediver
Forum Contributor
Posts: 109
Joined: Tue Feb 24, 2009 9:05 am

[Ask]Image Effect

Post by nitediver »

Anyone know, what does it call and how to do this effect?
Is this using javascript?
Image
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: [Ask]Image Effect

Post by kaszu »

There are several ways of achieving it:
1) Using javascript: it's called lightbox, but usually lightbox creates a mask over the page.
2) Using CSS: disadvantage comparing to lightbox is no animation and no image preloading

Code: Select all

<a href="#" class="image">
    <img src="..." alt="" class="small" />
    <img src="..." alt="" class="large" />
</a>

Code: Select all

a.image .large {
    position: absolute;
    margin: 50px 0 0 150px;
    display: none;
}
a.image:hover .large {
    display: block;
}
nitediver
Forum Contributor
Posts: 109
Joined: Tue Feb 24, 2009 9:05 am

Re: [Ask]Image Effect

Post by nitediver »

I already use lightbox, but I just dont like it...

Thanks for the css...
Post Reply