Results 1 to 5 of 5

Thread: Drop down/ Overlapping Content (using 2 images off and onclick)

  1. #1
    Join Date
    Jun 2008
    Posts
    40
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Question Drop down/ Overlapping Content (using 2 images off and onclick)

    1) Script Title: Drop down/ Overlapping Content script

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...lapcontent.htm

    3) Describe problem:

    i love this script, and i want to use it on my website.

    i want to use it with an image. (let's say image_off.gif)
    when i click on it image will change to image_on.gif and the overlapping content will scroll down.

    when i close the content box manually the image will return to image_off.gif state.

    thanks to all who can help.
    Last edited by newyorker2; 11-14-2008 at 09:42 PM. Reason: script url was wrong

  2. #2
    Join Date
    Feb 2008
    Location
    Cebu City Philippines
    Posts
    1,160
    Thanks
    17
    Thanked 277 Times in 275 Posts

    Default

    Suppose you are clicking on the image (the one that changes to on and off), you could add an onclick event telling to change the image's source to image_off if it's on or image_on if it's off:
    Code:
    <img src="image_off.gif" alt="imageSwitch" onclick="this.src=this.src.indexOf('_off')>-1?'image_on.gif':'image_off.gif'">
    Not tested though, but hopefully, it will work.
    Learn how to code at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph!

  3. The Following User Says Thank You to rangana For This Useful Post:

    newyorker2 (11-17-2008)

  4. #3
    Join Date
    Jun 2008
    Posts
    40
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Default

    rangana
    thank you that worked.

    i also want the image to go back to off state if user wants to hide the div manually.



    any idea how we can switch the image to off state when user clicks on this?


    <div align="right"><a href="javascript:dropdowncontent.hidediv('subcontent2')">Hide this div manually</a></div>

  5. #4
    Join Date
    Feb 2008
    Location
    Cebu City Philippines
    Posts
    1,160
    Thanks
    17
    Thanked 277 Times in 275 Posts

    Default

    Add an ID to your image, and use that ID in replacement of myimage_id in this ammendment:
    Code:
    <div align="right"><a href="javascript:dropdowncontent.hidediv('subcontent2');document.getElementById('myimage_id').src='image_off.gif'">Hide this div manually</a></div>
    Hope that helps.
    Learn how to code at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph!

  6. The Following User Says Thank You to rangana For This Useful Post:

    newyorker2 (11-17-2008)

  7. #5
    Join Date
    Jun 2008
    Posts
    40
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Default

    it worked.
    thank you for your help.

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
  •