Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    May 2008
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Show/HIde + change image >>need help!

    Hi There I have written a script that should do the following:

    1- Click on add.png that changes in the minus.png , opens a hidden DIV with text and changes a photo all at the same time.
    2- When then the delete.png is clicked everything has to go back to the original situation.

    What does not work:
    1- the add.png does not change into delete.png
    2- the photo does not reset to the original one when the div is closed.

    Here is my code:


    <script language="Javascript 1.2" type="text/javascript">
    function show(id)

    {
    el = document.getElementById(id);
    if (el.style.display == 'none')
    {
    el.style.display = '';
    el = document.getElementById('more' + id);
    el.innerHTML.thisImage = 'images/add.png';
    } else {
    el.style.display = 'none';
    el = document.getElementById('more' + id);
    el.innerHTML.thisImage = 'images/delete.png';
    }
    }

    function change_pic(val) {
    document.getElementById('image_name').src = val;

    }

    </script>

    Here is the HTML

    <div class="foto">
    <img name="image_name" id="image_name" src="../images/AllCd.jpg" border="0" alt="i">
    </div>


    <p><strong> Olthuis</strong>
    <a id="moreinfo" href="# " onclick="javascript:show('info'), change_pic('../images/Olthuis.jpg'); return false;">
    <img src="add.png" ></a></p>
    <div id="info" style="display: none">
    BLABLABLA text
    </div>
    <p><strong>Teddy </strong> -
    <a id="moreinfo2" href="#" onclick="javascript:show('info2'), change_pic('../images/teddy.jpg'); return false;">
    <img src=".add.png" ></a></p>
    <div id="info2" style="display: none">
    BLABLABLA text
    </div>
    <p><strong>Hermr</strong>
    <a id="moreinfo3" href="#" onclick="javascript:show('info3'), change_pic('../images/ermine.jpg'); return false;">
    <img src="add.png" ></a></p>
    <div id="info3" style="display: none">
    BLABLABLA text
    </div></div></div>

    THANK YOU!

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Please read the forum rules and guide lines,
    http://www.codingforums.com/postguide.htm
    http://www.codingforums.com/rules.htm

    (selection of forum, cross posting etc.)

    then after http://www.codingforums.com/showthread.php?t=82672, regarding how to post your code here.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    WA
    WA is offline
    Administrator
    Join Date
    Mar 2002
    Posts
    2,596
    Thanks
    2
    Thanked 19 Times in 18 Posts
    Closing this thread, as it's repeated here: http://www.codingforums.com/showthread.php?t=139058
    - George
    - JavaScript Kit- JavaScript tutorials and 400+ scripts!
    - JavaScript Reference- JavaScript reference you can relate to.


  •  

    Posting Permissions

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