Results 1 to 6 of 6

Thread: onclick script

  1. #1
    Join Date
    Aug 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default onclick script

    I need the following script
    pressing the button (or link)
    images a.gif, b.gif c.gif and d.gif
    replaced by x.gif

    a.gif -> x.gif
    b.gif -> x.gif
    c.gif -> x.gif
    d.gif -> x.gif

  2. #2
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

  3. #3
    Join Date
    Aug 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    ----- my script at the moment -----

    <head>
    <script language="JavaScript">
    <!--
    function nph_change_img_src(name, nsdoc, rpath)
    {
    var img = eval((navigator.appName.indexOf('Netscape', 0) != -1) ? nsdoc+'.'+name : 'document.all.'+name);
    if (name == '') return;
    if (img) { img.altsrc = img.src; img.src = rpath; }
    }
    // -->
    </script>
    <title></title>

    </head>

    <p><img src="background.gif" border="0" name="nph_slide1" width="700" height="158"></p>


    <p>&nbsp;</p>
    <p><a href="javascript:location.reload(true)">Refresh</a>
    - <a href="#">Clear</a>
    </p>
    <div id="layer1" style="width:243px; height:182px; position:absolute; left:0px; top:0px; z-index:1;">
    <p><img src="a.gif" onclick="this.src='x.gif' " width="243" height="182"></p>
    </div>

    <div id="layer2" style="width:243px; height:182px; position:absolute; left:243px; top:0px; z-index:1;">
    <p><img src="b.gif" onclick="this.src='x.gif' " width="243" height="182"></p>
    </div>

    <div id="layer3" style="width:243px; height:182px; position:absolute; left:486px; top:0px; z-index:1;">
    <p><img src="c.gif" onclick="this.src='x.gif' " width="243" height="182"></p>
    </div>

    ---------------

    link Clear (<a href="#">Clear</a>) must
    replace a.gif, b.gif, c.gif
    one click x.gif

  4. #4
    Join Date
    Aug 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I got the script to work !

  5. #5
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default

    can you share what you did please

  6. #6
    Join Date
    Aug 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    .....simple picture game for vilage party......

    <script language="JavaScript">
    <!--
    function nph_change_img_src(name, nsdoc, rpath)
    {
    var img = eval((navigator.appName.indexOf('Netscape', 0) != -1) ? nsdoc+'.'+name : 'document.all.'+name);
    if (name == '') return;
    if (img) { img.altsrc = img.src; img.src = rpath; }
    }
    // -->
    </script>
    <script type="text/javascript">
    function changeimage(img, new_src)
    {
    var cur_src = img.src.substring(img.src.lastIndexOf("/")+1);

    if (cur_src == new_src) {
    img.src = img.old_src;
    } else {
    img.old_src = cur_src;
    img.src = new_src;
    }
    }
    </script>
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="trasp.gif" border="2" name="nph_slide17" width="933" height="700"></p>
    <div id="layer1" style="width:243px; height:182px; position:absolute; left:20px; top:-20px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="01.gif" width="243" height="182" name="nph_slide1"></p>
    </div>
    <div id="layer2" style="width:243px; height:182px; position:absolute; left:263px; top:-20px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="02.gif" width="243" height="182" name="nph_slide2"></p>
    </div>
    <div id="layer3" style="width:243px; height:182px; position:absolute; left:506px; top:-20px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="03.gif" width="243" height="182" name="nph_slide3"></p>
    </div>
    <div id="layer4" style="width:243px; height:182px; position:absolute; left:749px; top:-20px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="04.gif" width="243" height="182" name="nph_slide4"></p>
    </div>
    <div id="layer5" style="width:243px; height:182px; position:absolute; left:20px; top:162px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="05.gif" width="243" height="182" name="nph_slide5"></p>
    </div>
    <div id="layer6" style="width:243px; height:182px; position:absolute; left:263px; top:162px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="06.gif" width="243" height="182" name="nph_slide6"></p>
    </div>
    <div id="layer7" style="width:243px; height:182px; position:absolute; left:506px; top:162px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="07.gif" width="243" height="182" name="nph_slide7"></p>
    </div>
    <div id="layer8" style="width:243px; height:182px; position:absolute; left:749px; top:162px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="08.gif" width="243" height="182" name="nph_slide8"></p>
    </div>
    <div id="layer9" style="width:243px; height:182px; position:absolute; left:20px; top:344px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="09.gif" width="243" height="182" name="nph_slide9"></p>
    </div>
    <div id="layer10" style="width:243px; height:182px; position:absolute; left:263px; top:344px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="10.gif" width="243" height="182" name="nph_slide10"></p>
    </div>
    <div id="layer11" style="width:243px; height:182px; position:absolute; left:506px; top:344px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="11.gif" width="243" height="182" name="nph_slide11"></p>
    </div>
    <div id="layer12" style="width:243px; height:182px; position:absolute; left:749px; top:344px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="12.gif" width="243" height="182" name="nph_slide12"></p>
    </div>
    <div id="layer13" style="width:243px; height:182px; position:absolute; left:20px; top:526px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="13.gif" width="243" height="182" name="nph_slide13"></p>
    </div>
    <div id="layer14" style="width:243px; height:182px; position:absolute; left:263px; top:526px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="14.gif" width="243" height="182" name="nph_slide14"></p>
    </div>
    <div id="layer15" style="width:243px; height:182px; position:absolute; left:506px; top:526px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="15.gif" width="243" height="182" name="nph_slide15"></p>
    </div>
    <div id="layer16" style="width:243px; height:182px; position:absolute; left:749px; top:526px; z-index:1;">
    <p><img onclick="changeimage(this, 'trasp.gif')" src="16.gif" width="243" height="182" name="nph_slide16"></p>
    </div>
    <p align="center" style="margin-top:1; margin-bottom:1;"><span style="font-size:12pt;"><a href="javascript:nph_change_img_src('nph_slide1', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide2', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide3', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide4', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide5', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide6', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide7', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide8', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide9', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide10', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide11', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide12', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide13', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide14', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide15', 'document', 'trasp.gif');
    javascript:nph_change_img_src('nph_slide16', 'document', 'trasp.gif');" title="TÜHJENDA"><img src="logo_tm.gif" border="0" alt="TÜHJENDA" align="absbottom" height="17" width="15"></a>&nbsp;<a href="javascript:location.reload(true)">Refresh</a>
    -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '01.jpg');">01</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '02.jpg');">02</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '03.jpg');">03</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '04.jpg');">04</a> - <a href="javascript:nph_change_img_src('nph_slide17', 'document', '05.jpg');">05</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '06.jpg');">06</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '07.jpg');">07</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '08.jpg');">08</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '09.jpg');">09</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '10.jpg');">10</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '11.jpg');">11</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '12.jpg');">12</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '13.jpg');">13</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '14.jpg');">14</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '15.jpg');">15</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '16.jpg');">16</a> -&nbsp;</span><a href="javascript:nph_change_img_src('nph_slide17', 'document', '17.jpg');"><span style="font-size:12pt;">17</span></a><span style="font-size:12pt;"> -&nbsp;</span><a href="javascript:nph_change_img_src('nph_slide17', 'document', '18.jpg');"><span style="font-size:12pt;">18</span></a><span style="font-size:12pt;"> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '19.jpg');">19</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '20.jpg');">20</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '21.jpg');">21</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '22.jpg');">22</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '23.jpg');">23</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '24.jpg');">24</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '25.jpg');">25</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '26.jpg');">26</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '27.jpg');">27</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '28.jpg');">28</a> -&nbsp;<a href="javascript:nph_change_img_src('nph_slide17', 'document', '29.jpg');">29</a></span></p>

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
  •