Grow your CSS skills. Land your dream job.

Image Zoom

  • # March 23, 2012 at 3:39 pm

    Hi there,

    I was hoping someone here could help with this problem im having. I’ve managed to set up an image for when the user rolls over it, it zooms out. I would like to add the same functionality to a button, so when the user rolls over that button the image zooms out, but i can’t seem to get the darn thing to work.

    I’ve set up a fiddle to help explain what i mean. http://jsfiddle.net/CameronDuthie/byrHL/

    Any help would be greatly appreciated,

    Many Thanks,

    Cameron

    # March 24, 2012 at 6:26 am

    well,just change the

    $(‘#right img’).hover to $(‘.btn-torq’)

    $this=$(this) to $this=$(‘#right img’)

    Bytheway, great idea, amazing effect.

    # March 24, 2012 at 6:57 am

    You should think about using percentages for your height instead of px just to make it a little more flexible…Incredible little effect!

    # March 24, 2012 at 10:47 am

    @jozsef Thank you so much for your help i really appreciate that. It works a treat, I’m a complete novice when it comes to javascript. Thanks for the compliment. :)

    @kgscott284 Thanks for the advice and your comment. What advantages are there with using % over px? I’m not sure what you mean by flexible?

    # March 24, 2012 at 11:15 am

    Does this help you out: http://jsfiddle.net/savver/byrHL/4/ or maybe this: http://jsfiddle.net/savver/byrHL/5/ or even more flexible: http://jsfiddle.net/savver/byrHL/6/

    # March 26, 2012 at 2:38 pm

    Yes, many thanks @vermaas. I think i now have a clearer idea of what flexibility means in javascript.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".