6 {{ upvoteCount | shortNum }}
6 {{ upvoteCount | shortNum }}

Way too cool! How do you do this?

by gmack
5 replies
  • WEB DESIGN
    • |
Greetings...Hope someone can help.

A client looking for a bio type site came across this site with this cool picture effect. Wondering how to do it? Any ideas? I get that all images are pretty much cut and layered separately, but how do you get 'em to move on the mouse hover?

Darryl Worley - Official Site

Don't have any affiliation with the site at all...I just like the front pic.

Thanks.

Greg
#cool
  • Profile picture of the author derekbarbour
    That kind of effect is called "Parallax Scrolling"

    Here is a link that breaks it down pretty good.

    EDIT: Can't post links but codecanyon has a ton of stuff like this.
    {{ DiscussionBoard.errors[5728848].message }}
    • Profile picture of the author Istvan Horvath
      Originally Posted by derekbarbour View Post

      EDIT: Can't post links but google that and you'll be on your way to getting that made.
      Leave out the http://www. part - and you can
      like: example.com
      Signature

      {{ DiscussionBoard.errors[5728906].message }}
  • Profile picture of the author ronc0011
    There are some cSS techniques that do that using positioning and hiding portions of the image from the viewable area or container. Where I seen it used is to speed up page loading and to stop pge flicker when using a mouseover effect.
    {{ DiscussionBoard.errors[5728862].message }}
  • Profile picture of the author derekbarbour
    Should be all you need!

    progtuts.info/186/create-a-parallax-website-header/

    Thanks Istvan for the tip! Not sure why i didn't think of it.
    {{ DiscussionBoard.errors[5728981].message }}

Trending Topics