SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Thread: Tab Menu Images

  1. #1
    SitePoint Wizard simplecode's Avatar
    Join Date
    Jun 2006
    Posts
    1,129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Tab Menu Images

    Hi
    Am trying to create a script menu, a tab menu
    There are suppose two tabs , tab1 and tab2 and just want to switch the images of these tabs using script.
    For ex; if I click tab2 it needs too be selected and tab1 gets unselect.

    Am looking for a script need your help, am not that strong in Jscript.

    Thanks

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Code:
    window.onload = function() {
      var tab1 = document.getElementById('tab1');
      var tab2 = document.getElementById('tab2');
      tab1.onclick = function() {
        tab1.style.background = 'url(tab1on.gif)';
        tab2.style.background = 'url(tab2off.gif)';
      }
      tab2.onclick = function() {
        tab1.style.background = 'url(tab1off.gif)';
        tab2.style.background = 'url(tab2on.gif)';
      }
    }
    You could get tab1 or tab2 in different ways, it doesn't have to via their ids. And it's javascript, jscript is something else.

  3. #3
    SitePoint Wizard simplecode's Avatar
    Join Date
    Jun 2006
    Posts
    1,129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    let me give a try for that ...
    thanks

  4. #4
    SitePoint Wizard simplecode's Avatar
    Join Date
    Jun 2006
    Posts
    1,129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    my tab code is look like this

    <a id="tab_overview" href="#" onclick="javascript:show_open();"><img src="http://drh.img.digitalriver.com/DRHM/Storefront/Site/xerox/cm/images/tab_on.gif" border="0" /></a>

    when i calick i need to change the content as well....and image as well .. how can i do ?

    Thanks
    Last edited by simplecode; Dec 15, 2006 at 15:36.

  5. #5
    SitePoint Wizard simplecode's Avatar
    Join Date
    Jun 2006
    Posts
    1,129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up

    thanks for help but am looking for this
    PHP Code:
    <script>

    function 
    swap_img_1()
    {    
        
    //alert (reverseext(document.getElementById('d1').src));
            
    document.getElementById('d1').src="prodtab5_overview_on.gif";
            
    document.getElementById('d2').src="prodtab5_specs_off_en.gif";
    }
    function 
    swap_img_2()
    {    
        
    //alert (reverseext(document.getElementById('d1').src));
            
    document.getElementById('d1').src="prodtab5_overview_off_en.gif";
            
    document.getElementById('d2').src="prodtab5_specs_on_en.gif";
    }
    </script>


    <img id="d1" src="prodtab5_overview_on.gif" style="left:10" onClick="javascript: return swap_img_1(); "/>
    <img id="d2" src="prodtab5_specs_off_en.gif" style="left:120" onClick="javascript: return swap_img_2(); "/> 

  6. #6
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    That's more or less what I said...


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
  •