February 4, 2009
7 Comments

jQuery Image Preview – New Plugin “imgPreview”

Posted in jQuery, Usability by Gergely Marton

The ‘imgPreview’ plugin allows your users to preview an image before clicking on it and, out of necessity, will preload the image so when a user does click through to it there is no waiting time!

The image preview shows up in a tooltip-like box appearing alongside the user’s cursor when hovering over a link. The plugin is entirely unobtrusive; it does not require any hooks to target specific links (no non-semantic classes); it will automatically detect the anchors that are linking to images and will only apply the preview effect to them.

Related Entries

Signup for our awesome Newsletter!

We will try to send you e-mail that will open your eyes in the morning and wake you up in the evening!

About the author

Gergely Marton, is a self-tought web designer and developer with over seven years of experience. He owns his own little web design agency WebGurus, and runs this blog in his spare time. Usually the work gets more important for him than anything else, but he struggles to get some time to read and to play his violin.

  • Danielloo

    Hi cool plugin… do you know how to insert this in 2 wordpress !?

  • http://www.webgurus.biz Gergely Marton

    Hi Daniello,

    You can easily do that by following the tutorial of the script. You just include in your head.php file the javascripts and you set every image in your posts to have class=”imagePreview” for example.

    I will write a tutorial this week about this.

    Thanks for the comment!

  • Danielloo

    Hey… No problem =) Great I try to follow the instructions. Lookin forward to that tutorial. I’m using woo theme template for my blog and I get confused with the php. No problem installing in html.

  • visit

    Like the site very much, thanx 4 your efforts webmasters

  • http://www.controlautoinsure.com/www-accreditedsuretyandcasualty-in-sk-travelers.html arizona car cheap insurance

    I love this site, there is so much information to be found. Thank you.

  • http://www.club-penguin.org/ ClubPenguinCheats

    Lookin forward to that tutorial. I’m using woo theme template for my blog and I get confused with the php.

  • http://www.topgeldzaken.nl/lenen-zonder-bkr-toetsing/ lenen

    U wilt geld lenen zonder BKR toetsing? De opties hiervoor worden groter, kijk verder en ontdek hoe u wél geld kunt lenen, snel & eenvoudig.