Results 1 to 4 of 4

Thread: CSS Image Gallery

  1. #1
    Join Date
    Jan 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question CSS Image Gallery

    Help Needed ASAP.

    CSS Image Gallery link: http://www.dynamicdrive.com/style/cs...e-gallery/P10/

    I am using an external .css file attached to my .html file. The rollover option works fine; however, I want to change the option from "hover" to "clickon".

    This gallery states in the description...2nd to last sentence:
    "Furthermore, it's possible to modify the behavior so the enlarged images are only shown onClick, though IE6 currently doesn't support this behavior well."

    The behavior code is not provided...please provide "click-on" option code.

    I have tried all suggestions listed, and still no luck.
    1. Suggestion 1 (dated 09/01/2008)
    http://www.dynamicdrive.com/forums/s...+image+gallery

    2. Suggestion 2 (dated 07/04/2008)
    http://www.dynamicdrive.com/forums/s...+image+gallery

    Your help is greatly appreciated.

    Regards,

  2. #2
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    As far as I know onClick is a javascript and flash element not css.

  3. #3
    Join Date
    Jan 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Javascript? I understand a little of .js

    What javascript code to I need to add to make this css image gallery work on click?

  4. #4
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    You need to remove the css hover state, keep the styles and put them with a different class or id. Then with the javascript onclick event occurs add that class or id to the element. You will also need an exit/close/dismiss icon/text to close out the image. This could be down with jquery. I'd post this over in the javascript forum or ask a moderator to move it there for you.

    Example of where onClick is triggered.
    Code:
    <a href="" onClick=""></a>
    Corrections to my coding/thoughts welcome.

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
  •