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 5 of 5
  1. #1
    New Coder
    Join Date
    Jul 2006
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image border issue & hiding table columns outside of IE

    Hey all,

    I've got 2 little issues which I'm not sure how to go about.. both being because I'm not familiar with making things compatible outside of IE. The examples I've got below work in IE, but how can I adapt them to work in other browsers, such as FireFox and the like?

    This first one is actually CSS.. it works perfectly in IE, and means I don't have to put border="0" on every image.. but doesn't transfer outside of IE..
    Code:
    image {
    	border: 0 none;
    }

    This second problem is to do with showing/hiding a navigation table, again.. works in IE but messes up in FireFox.. how can I change this to work universally?

    Edit: This does actually work, but there's an issue with the column width remaining the same.. just hiding or showing its contents, is there a way around this?
    Code:
    var browserType;
    
    if (document.layers) {browserType = "nn4"}
    if (document.all) {browserType = "ie"}
    if (window.navigator.userAgent.toLowerCase().match("gecko")) {browserType= "gecko"}
    
    
    ///////////////////////////////
    
    function toggle_nav(do_show) {
    
    	var tbl;
    	
    	if (browserType == "gecko" )
       		tbl = document.getElementById('mainTable');
    	else (browserType == "ie")
    		tbl = document.all['mainTable'];
    			
    //    var tbl  = document.getElementById('mainTable');
        var rows = tbl.getElementsByTagName('tr');
    
       	if( do_show == true ) {
    		  var cels = rows[0].getElementsByTagName('td');
    	      cels[0].style.display='none';	  
    	      cels[1].style.display='block';
    	}
    	else {
    		  var cels = rows[0].getElementsByTagName('td');
    	      cels[0].style.display='block';
    	      cels[1].style.display='none';	      		       		  		  
    	}	
    	
    }
    Many thanks for any help!
    Last edited by BenBox; 07-31-2006 at 01:26 PM.

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,513
    Thanks
    3
    Thanked 504 Times in 491 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    
    <head>
      <title></title>
    <style type="text/css">
    <!--
    img {
    	border: 0px;
    }
    -->
    </style>
    
    <script language="JavaScript" type="text/javascript">
    <!--
    
    
    ///////////////////////////////
    
    function toggle_nav(do_show) {
    
    	var tbl;
    
        var tbl  = document.getElementById('mainTable')||document.all['mainTable'];
        var rows = tbl.rows;
        var cels = rows[0].cells;
    
       	if( do_show == true ) {
    	      cels[0].style.display='none';
    	      cels[1].style.display='';
    	}
    	else {
    	      cels[0].style.display='';
    	      cels[1].style.display='none';
    	}
    
    }
    //-->
    </script>
    </head>
    
    <body>
    <a href="#" ><img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif"></a>
    <table id="mainTable" border="1">
      <tr>
        <td  >123</td>
        <td>1234</td>
      </tr>
    </table>
    <input type="button" name="" value="Test" onclick="toggle_nav()">
    <input type="button" name="" value="Test" onclick="toggle_nav(true)">
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #3
    New Coder
    Join Date
    Jul 2006
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ah ha! Awesome

    Thank you!

  • #4
    New Coder
    Join Date
    Jul 2006
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Actually, another quick question..

    At the moment I have in the body tag onLoad="toggle_nav(true)" but what I ideally want it to do is remember the toggle status for each page viewed (possibly just for the duration of the session).

    How can I go about putting cookies into this for that?

  • #5
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,513
    Thanks
    3
    Thanked 504 Times in 491 Posts
    have you any experience of cookies?

    if not, google for tutorial first

    then each page will have a cookie name

    set the cookie value with true or false in 'toggle_nav(do_show)'

    then <BODY>/window window call toggle_nav(do_show) with the cookie value as the parameter
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/


  •  

    Posting Permissions

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