SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Guru
    Join Date
    Aug 2004
    Location
    Canada
    Posts
    730
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    toggling problem

    I'm trying to toggle a form. What's wrong with this?
    Code:
    	<script type="text/javascript" language="javascript1.3">
    			function toggle(id){
    				ol = "ol_" + id;
    				img = "img_" + id;
    				olElement = document.getElementById(ol);
    				imgElement = document.getElementById(img);
    				if (olElement){
    						if (olElement.className == 'closed'){
    								olElement.className = "open";
    								imgElement.src = "images/opened.gif";
    								}else{
    								olElement.className = "closed";
    								imgElement.src = "images/closed.gif";
    								}
    						}
    				}
    		</script>
    		<a  onclick="toggle('item1');">	
    			<h5><img src="images/closed.gif" alt="Click to Expand" id="img_item1" border="0" /> Email it to Someone</h5></a>
    			<ol type="none" id="ol_item1" class="closed">
    				<li id="item1_1">
    					<form name="mailing" method="post" action="article.asp?id=1447#send" enctype="application/x-www-form-urlencoded">
    					  <input name="send" type="hidden" value="1" />
    					  <div id="div10a">SEND THIS WEBSITE TO A FRIEND:</div>
    					  <div id="div10b">From:&nbsp;</div>
    					  <div id="div10c">
    						<input type="text" name="name" size="20" value="[your e-mail address]" class="form-input" onblur="if(this.value==''){this.value='[your e-mail address]';}" onfocus="if(this.value=='[your e-mail address]'){this.value='';}" />
    	
    						</div>
    						<div id="div10d">
    	
    							<input name="submit" type="submit" title="Send it" value=" Send " size="100" />
    							<input name="reset" type="reset" value="Reset" />
    						</div>
    						<div id="div10e">To:&nbsp;</div>
    						<div id="div10f">
    							<input type="text" name="name" size="20" value="[recipient e-mail address]" class="form-input" onblur="if(this.value==''){this.value='[recipient e-mail address]';}" onfocus="if(this.value=='[recipient e-mail address]'){this.value='';}" />
    						  </div>
    					</form>
    				</li>
    			</ol>
    Compare bible texts (and other tools):
    TheWheelofGod

  2. #2
    rajug.replace('Raju Gautam'); bronze trophy Raju Gautam's Avatar
    Join Date
    Oct 2006
    Location
    Kathmandu, Nepal
    Posts
    4,013
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try out like this i have changed a little bit on your code because there is no the CSS classes visible in your code.
    Code javascript:
    function toggle(id){
    	var ol 			= "ol_" + id;
    	var img			= "img_" + id;
    	var olElement 	= document.getElementById(ol);
    	var imgElement 	= document.getElementById(img);
     
    	if(olElement && imgElement){ // If both of the elements found
    		if(olElement.style.display == 'none'){
    			olElement.style.display = '';
    			imgElement.src 			= 'images/opened.gif';
    		}
    		else{
    			olElement.style.display = 'none';
    			imgElement.src 			= 'images/closed.gif';
    		}
    	}
    }
    Code HTML:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Untitled Document</title>
    </head>
    <body>
    <a href="javascript:void(null);" onClick="toggle('item1');"><h5><img src="images/closed.gif" alt="Click to Expand" id="img_item1" border="0" /> Email it to Someone</h5></a>
    <ol type="none" style="display:none;" id="ol_item1">
    	<li id="item1_1">
    		<form name="mailing" method="post" action="article.asp?id=1447#send" enctype="application/x-www-form-urlencoded">
    		  <input name="send" type="hidden" value="1" />
    		  <div id="div10a">SEND THIS WEBSITE TO A FRIEND:</div>
    		  <div id="div10b">From:&nbsp;</div>
    		  <div id="div10c">
    			<input type="text" name="name" size="20" value="[your e-mail address]" class="form-input" onblur="if(this.value==''){this.value='[your e-mail address]';}" onfocus="if(this.value=='[your e-mail address]'){this.value='';}" />
     
    			</div>
    			<div id="div10d">
     
    				<input name="submit" type="submit" title="Send it" value=" Send " size="100" />
    				<input name="reset" type="reset" value="Reset" />
    			</div>
    			<div id="div10e">To:&nbsp;</div>
    			<div id="div10f">
    				<input type="text" name="name" size="20" value="[recipient e-mail address]" class="form-input" onblur="if(this.value==''){this.value='[recipient e-mail address]';}" onfocus="if(this.value=='[recipient e-mail address]'){this.value='';}" />
    			  </div>
    		</form>
    	</li>
    </ol>
    </body>
    </html>
    Mistakes are proof that you are trying.....
    ------------------------------------------------------------------------
    PSD to HTML - SlicingArt.com | Personal Blog | ZCE - PHP 5


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
  •