SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Mar 2010
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    What Javascript effect is this?

    Hi There,

    I'm looking to use a similar image rollover effect that can be seen within this link (thumbnails):

    http://bannersmonster.com/themes/oem...portfolio.html

    But I am having trouble finding an online tutorial. Does anyone know what this effect/script is called?

    Many Thanks

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,299
    Mentioned
    460 Post(s)
    Tagged
    8 Thread(s)
    They are using the prettyPhoto jQuery plugin, which is found here:

    http://www.no-margin-for-errors.com/...ightbox-clone/

  3. #3
    SitePoint Member
    Join Date
    Mar 2010
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks ralph.m for the quick reply.

    It was more the rollover effect within the thumbnail. I guess the effect would be once the mouse button is hovered over the thumbnail a png image appears illustrating a small magnifying glass.

    Any suggestions?

    Thanks

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,299
    Mentioned
    460 Post(s)
    Tagged
    8 Thread(s)
    They have written an extra script to go with the default gallery, located here:

    http://bannersmonster.com/themes/oem...e/js/custom.js

    It creates a span with the magnifying glass image in it, and when you hover on the image, the script makes the image go from opacity:1 to opacity:0.2, so the mag glass image is seen.

    JS isn't my area, though, so unless you can play with these scripts yourself, someone else will have to give you further help!

  5. #5
    SitePoint Member
    Join Date
    Mar 2010
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ah great, thanks ralph.m.

    I only know little Java, so will keep searching of tutorials. Otherwise thanks for helping me understand how the script functions!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •