JavaScript - Simple Javascript To Show A Div
I have a list with two items:
Code: <select name="gateway" id="gateway"> <option value="2">PayPal</option> <option value="1">Credit/Debit Card</option> </select> When the second list item is selected, a div with several input fields needs to appear: Code: <div id="hidden_field"> Input fields are placed here. </div> Likewise, if someone selects the first list item, the div should not appear. Does anyone know how to do this with javascript? I am very new to javascript, so your help is greatly appreciated! Similar TutorialsCode: <html> <title> random!!</title> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.min.js"></script> </head> <body> <div class="one" style="cursor: pointer;"> type1<br/><br/></div><div class="two" style="cursor: pointer;">type2<br/><br/></div><div class="three" style="cursor: pointer;">type3<br/><br/></div> <div class="oneone">atrdjgkhgfyfygfykfyfkygfvkgvkhgv</div><div class="twotwo">hgfihygohgohsgoihgolhgshgoshdgchchj</div><div class="threethree">siucgdiuhsbcohbscjbsidjcksjdnck</div> <script type="text/javascript"> $(document).ready(function() { $('div.twotwo').hide(); $('div.threethree').hide(); $('div.one').toggle(function() { $('div.twotwo').hide(); $('div.threethree').hide(); $('div.oneone').fadeIn('slow'); }, function() { return false; }); $('div.two').toggle(function() { $('div.oneone').hide(); $('div.threethree').hide(); $('div.twotwo').fadeIn('slow'); }, function() { return false; }); $('div.three').toggle(function() { $('div.twotwo').hide(); $('div.oneone').hide(); $('div.threethree').fadeIn('slow'); }, function() { return false; }); }); </script> </body> </html> The following code works perfectly when clicked once in each of the sub divisions(type1, type2, type3) for hide/show. But from the next time onwards we will have to click twice to initiate the hide/show. Can anyone suggest changes to make the code work as desired??.. P.S: sorry if i have made any stupid mistake.. i am quite new to this!! I realize this is an overly simple question, but I'm rather horrible at javascript. What I'm doing is changing an img src and having it loop through images. I want it to only start looping when I click and than stop if I click again. It loops through when I click once, but when I click again it starts changing its rate of image switching. Starts off switching at 1000 milliseconds than upon clicking again it switches through two images quickly and than slows again. Code: var myImage = document.getElementById("mainImage"); var imageArray=["1.jpg","2.jpg","3.jpg","4.jpg" ]; var imageIndex=0; What I assume is the trouble causing function: Code: function changeImage(){ myImage.setAttribute("src", imageArray[imageIndex]); imageIndex++; if(imageIndex >= imageArray.length) { imageIndex=0; } } How the trouble function is being called: Code: var imgSwtch=0; myImage.onclick= function(){ if(imgSwtch==0){ var intervalHandle = setInterval(changeImage,1000); imgSwtch=1; console.log("start"); } else{ clearInterval(intervalHandle); imgSwtch=0; console.log("stop"); } }; I imagine this would be very simple for someone who knows javascript. I want to have three fields. First field is "posted speed limit", second field is "actual speed" and third field will be the output field. All the script needs to do it subtract the posted speed from the actual speed and add a ZERO to the end; which is the amount of the speeding ticket. The minimum fine is $100, however. So, 5 miles over the speed limit would be $100 (minimum value) 15 miles over the speed limit would be $150 (add a zero) 35 miles over the speed limit would be $350. etc. I know very little Javascript, if anyone could help me out with this, I'd appreciate it. Thanks, Sean Help. How do I show the below JavaScript code to each unique visitor only once per day or any amount of days I want to set? PHP Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Untitled</title> </head> <body> <!-- this goes anywhere in the root of the --> <div id="slideIn" style="position:absolute; width: 720px; height: 320px; left: 0; top: -600px; z-index: 100; border: 1px solid gray; padding: 20px; font-family: 14px Verdana, sans-serif, Tahoma, Arial; font-color: black;" <div style="text-align:right"><input type="button" value="CLOSE" onclick="f_slideOut()" style="background: black; color: white; border: 2px solid #dcdcdc;"></div> This is where the content goes blah blah Blah Blah Blah Blah Please help :( </div> <div id="slideInShade" style="position:absolute;z-index:99;visibility:hidden;"></div> <script> var s_userAgent = navigator.userAgent.toLowerCase(), s_location = String(window.location).toLowerCase(); // copyright protection var b_mac = s_userAgent.indexOf('mac') != -1, b_ie5 = s_userAgent.indexOf('msie 5') != -1, b_ie6 = s_userAgent.indexOf('msie 6') != -1 && s_userAgent.indexOf('opera') == -1, b_ieMac = b_mac && b_ie5, b_safari = b_mac && s_userAgent.indexOf('safari') != -1, b_opera6 = s_userAgent.indexOf('opera 6') != -1; var e_slideIn = document.getElementById('slideIn'); var e_slideInShade = document.getElementById('slideInShade'); function f_slideIn() { if (!window.e_slideIn) return; var n_width = e_slideIn.offsetWidth; var n_height = e_slideIn.offsetHeight; var n_left = (f_clientWidth() - n_width) / 2; var n_top = parseInt(e_slideIn.style.top); var n_moveTo = (f_clientHeight() - n_height) / 2; e_slideIn.style.left = n_left + 'px'; e_slideIn.style.visibility = 'visible'; f_customShade(n_width, n_height, n_left, n_top); e_slideInShade.style.visibility = 'visible'; n_slideMove (n_top, n_moveTo); } function n_slideMove (n_top, n_moveTo) { n_inc = Math.round((n_moveTo - n_top) / 20); if (!n_inc) return; n_top += n_inc; f_customShade(null, null, null, n_top); e_slideIn.style.top = n_top + 'px'; setTimeout('n_slideMove(' + n_top + ',' + n_moveTo + ')', 10); } function f_slideOut() { if (!window.e_slideIn) return; e_slideIn.style.visibility = 'hidden'; e_slideInShade.style.visibility = 'hidden'; } function f_clientWidth() { if (typeof(window.innerWidth) == 'number') return window.innerWidth; if (document.documentElement && document.documentElement.clientWidth) return document.documentElement.clientWidth; if (document.body && document.body.clientWidth) return document.body.clientWidth; return null; } function f_clientHeight() { if (typeof(window.innerHeight) == 'number') return window.innerHeight; if (document.documentElement && document.documentElement.clientHeight) return document.documentElement.clientHeight; if (document.body && document.body.clientHeight) return document.body.clientHeight; return null; } function f_customShade (n_width, n_height, n_left, n_top) { if (!e_slideInShade) return; if (n_width != null) e_slideInShade.style.width = (n_width + 8) + 'px'; if (n_left != null) e_slideInShade.style.left = (n_left - 1) + 'px'; e_slideInShade.style.top = (n_top - 1) + 'px'; if (!e_slideInShade.innerHTML) { if (b_ie5 || b_ie6) e_slideInShade.innerHTML = '<table cellpadding="0" cellspacing="0" border="0" width="100%"><tr><td rowspan="2" colspan="2" width="6"><img src="images/pixel.gif"></td><td width="7" height="7" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_tr.png\', sizingMethod=\'scale\');"><img src="images/pixel.gif"></td></tr><tr><td height="' + (n_height - 7) + '" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_mr.png\', sizingMethod=\'scale\');"><img src="images/pixel.gif"></td></tr><tr><td width="7" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_bl.png\', sizingMethod=\'scale\');"><img src="images/pixel.gif"></td><td style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_bm.png\', sizingMethod=\'scale\');" height="7" align="left"><img src="images/pixel.gif"></td><td style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_br.png\', sizingMethod=\'scale\');"><img src="images/pixel.gif"></td></tr></table>'; else e_slideInShade.innerHTML = '<table cellpadding="0" cellspacing="0" border="0" width="100%"><tr><td rowspan="2" width="6"><img src="images/pixel.gif"></td><td rowspan="2"><img src="images/pixel.gif"></td><td width="7" height="7"><img src="images/shade_tr.png"></td></tr><tr><td background="images/shade_mr.png" height="' + (n_height - 7) + '"><img src="images/pixel.gif"></td></tr><tr><td><img src="images/shade_bl.png"></td><td background="images/shade_bm.png" height="7" align="left"><img src="images/pixel.gif"></td><td><img src="images/shade_br.png"></td></tr></table>'; } } f_slideIn(); </script> </body> </html> Hey guys, I already saw this post but I wasn't sure if it took care of the question I'm asking. I have the following javascript ad code right before the </body> tag: Code: <script type="text/javascript" src="http://ads.affbuzzads.com/smart_ad/display?ad_unit=18&ref=xxxxx"></script> This is a slider ad that shows every time the person comes to the page I have it on. I'd like to show this ad only once per 24 hours per visitor. Can someone please help me out with code to do this? I'm kinda newbish at this. Thanks so much! Hey, I wonder how I'm going to do when it comes to the function of "show/hide" with JavaScript. My question is: I'm working on a web form. The following question is on the form: "Was ITK used?", and you're supposed to be able to pick "Yes" or "No" (by radio buttons), and this I've already fixed with no issues. But what I CAN'T do, for some strange reason, is that when you've clicked "Yes" on that question, it should appear another question: "Does customer have ITK in their network?", and when that comes up you're supposed to choose between "Yes"/"No" with radio buttons there as well. BUT if you click "No" on the first question (Was ITK used?), the other question (Does customer have ITK in their network?) shouldn't appear... Do you understand what I mean? How do I do this? Thanks in advance! hy guys I have this Ad Script script: <HEAD> section Code: <style type="text/css"> <!-- #sponsorAdDiv {position:absolute; height:1; width:1px; top:0; left:0;} --> </style> <script type="text/javascript"> adTime=10; // seconds ad reminder is shown chanceAd=1; // ad will be shown 1 in X times (put 1 for everytime) var ns=(document.layers); var ie=(document.all); var w3=(document.getElementById && !ie); var calunit=ns? "" : "px" adCount=0; function initAd(){ if(!ns && !ie && !w3) return; if(ie) adDiv=eval('document.all.sponsorAdDiv.style'); else if(ns) adDiv=eval('document.layers["sponsorAdDiv"]'); else if(w3) adDiv=eval('document.getElementById("sponsorAdDiv").style'); randAd=Math.ceil(Math.random()*chanceAd); if (ie||w3) adDiv.visibility="visible"; else adDiv.visibility ="show"; if(randAd==1) showAd(); } function showAd(){ if(adCount<adTime*10){adCount+=1; if (ie){documentWidth =truebody().offsetWidth/2+truebody().scrollLeft-20; documentHeight =truebody().offsetHeight/2+truebody().scrollTop-20;} else if (ns){documentWidth=window.innerWidth/2+window.pageXOffset-20; documentHeight=window.innerHeight/2+window.pageYOffset-20;} else if (w3){documentWidth=self.innerWidth/2+window.pageXOffset-20; documentHeight=self.innerHeight/2+window.pageYOffset-20;} adDiv.left=documentWidth-200+calunit;adDiv.top =documentHeight-200+calunit; setTimeout("showAd()",100);}else closeAd(); } function closeAd(){ if (ie||w3) adDiv.display="none"; else adDiv.visibility ="hide"; } function truebody(){ return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body } onload=initAd; //End--> </script> right above the </BODY> Code: <div id="sponsorAdDiv" style="visibility:hidden"> <table width="450px" height="350px" bgcolor="#008000"><tr><td> <table width="445px" height="345px" bgcolor="#F0FFF0"><tr><td align="center" valign="middle"> <!--*****EDIT THIS MESSAGE*****--> <!--*****EDIT THE ABOVE MESSAGE*****--> </td></tr></table></td></tr></table> </div> And i trying to find a way to show a div with text and images just once per day using cookies....i like something like this http://javascript.internet.com/cooki...opup-once.html but not with popup. I used the slideshow technique described here and was successful: http://www.javascriptkit.com/howto/show2.shtml But when I try to repeat the process to add additional images to the show, it doesn't work. It sticks to the three original images. Any tips as to how to add to this? thanks!! hey i need help of all u guys.Actually the problem is that when i am loading this html page i just want the sign in page to appear and on click of cancel button i want a page to appear and on click of login button i get log in page..but the problem is that whenever i load my html page i get the sign in page and the page that is present on the cancel page..i tried showing and hiding and tried but i dnt know what more to do...please help me out.. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> </title> <link rel="stylesheet" type="text/css" href="styling.css"/> <script type="text/javascript" src="jquery-1.7.1.js"></script> <script type="text/javascript"> window.onload = function() { document.getElementById('first_div').style.display = 'none';} function toggle(link, div1id, div2id) { var div1 = document.getElementById(div1id); var div2 = document.getElementById(div2id); if (div1.style.display == 'none') { $('#third_div').hide(); div1.style.display = 'block'; div2.style.display = 'none'; link.innerHTML = 'Login'; } else { $('#third_div').hide(); div1.style.display = 'none'; div2.style.display = 'block'; link.innerHTML = 'signin'; } } function toggleImg(divId) { $('#first_div').hide(); $('#second_div').hide(); $('#third_div').show(); } </script> </head> <body> <div id="first_div" class="container"> <label for="username"> <span>Username:*</span> <input type="text" class="text" id="user" placeholder="Username" maxlength="24" onFocus="this.style.borderColor='#B0E0E6';" onBlur="this.style.borderColor='#D3D3D3';"/> </label> <label for="password"> <span>Password:*</span> <input type="password" class="text" id="pass" placeholder="Password" maxlength="24" onFocus="this.style.borderColor='#B0E0E6';" onBlur="this.style.borderColor='#D3D3D3';"/> </label> <label> <input type="checkbox" name="remember" id="remember" class="checkbox" value="1" tabindex="3" /> Remember Me? </label> <label> <input type="submit" name="submit" class="button1" id="doLogin" value="Sign in" /> </label> </div> <div id="second_div" class="container1"> <label for="username"> <span> Username:*</span> <input type="text" id="username" class="text" placeholder="Username" maxlength="24" onFocus="this.style.borderColor='#B0E0E6';" onBlur="this.style.borderColor='#D3D3D3';"/> </label> <label for="password"> <span>Password:*</span> <input type="password" id="password" class="text" placeholder="Password" maxlength="24" onFocus="this.style.borderColor='#B0E0E6';" onBlur="this.style.borderColor='#D3D3D3';"/> </label> <label for="repass"> <span>Re-Password:* </span><input type="password" id="repass" class="text" placeholder="Re-password" maxlength="24" onFocus="this.style.borderColor='#B0E0E6';" onBlur="this.style.borderColor='#D3D3D3';"/> </label> <label for="email_id"> <span>Email-Id:</span><input type="text" id="email_id" class="text" placeholder="Verify email-id" maxlength="24" onFocus="this.style.borderColor='#B0E0E6';" onBlur="this.style.borderColor='#D3D3D3';"/> </label> <label><input type="submit" name="submit" class="button1" value="Submit" /></label> </div> <div id="third_div" class="image"> <img src="https://gs1.wac.edgecastcdn.net/8019B6/data.tumblr.com/tumblr_m2rdcqQLrA1qcb6kno1_500.jpg" /> </div> <div class="header"> <button class="button_cancel" onclick="toggleImg('third_div');">Cancel</button> <button class="button_sign" id="sign" onclick="toggle(this,'first_div', 'second_div'); return false;">Sign_in</button> </div> </body> </html> I wanted it according to this website https://www.tumblr.com Hy every one, i need help .I have a program made in visual c++ witch detect motion and makes a file.jpg every time when detects something. I would like to make a web pages witch makes the autorefresh with the last image generated by this program. How do i do that with javascript? I think i must declare a golbal variable witch kepps the path to the most younger file, or to make a list witch keeps all the images and sort it ascended but i don't know how to make this in java script. Can enyone help me ?Thanks in advance I've just finished coding a navigation bar on my website in CSS so the Parent links reveal drop down child links below. It works fine on all pages except for my home where I have an issue with my featured box. I'm using SmoothGallery 2.0 but my menu options don't show over it when I'm the home page, they get cut off and the last few options end up underneath. Is this an issue with trying to use CSS over Javascript? Is it possible to have my menu items show over my javascript? Shall I use a different menu method? or is it an issue with the javascript itself? -Thanks Hi, I have been developing a show/hide feature on my companies web site for some time. I have so much code as to where I am confused when I need to add another slide function. I have provided the URL below to the page where the code exists. http://www.pjm.com/markets-and-opera...assistant.aspx This is where I get lost with the huge amount of code that I have. If you take a look under the second slider named "Electricity Markets" there is another slider underneath named "Energy Market". I need to add three more sliders right underneath in the same format under "Energy Market" If anyone can assists with this that would be great. I should have organized the code a lot better, so now I get lost within the code now. BTW, the show/hide feature really does not display well in Firefox, please try in IE. Thanks! I set up my javascript so that it shows a hidden div box from an array when i click on a link. To show only one hidden box, the code is <a href="javascript:showOnlyThis('divIDgoeshere')"> how do i show multiple hidden div boxes with one link? Thanks! Hello everyone. I am building a subscription directory website and I need help developing a code that will perform this function: I want to be able to hide certain spans when another span appears on the page. In other words, the page will normally display <span id="spanA"> and <span id="spanB">. However, when <span id="spanC"> appears on a page, I want to set display:none for spanA and spanB. I know how to toggle between display:none and display:block using a call to a javascript function like a link with an "onClick" Perhaps there a way I could code a span in CSS to toggle this javascript function when it appears on the page? Thank you for any help! I'm using custom javascript tooltips to show information about designs in a t-shirt shop, such as design name and artist. I downloaded the code and CSS for the tooltips and am attempting to assign the tooltip to each design using a javascript array and a for-in loop. Only problem is that the tooltips aren't showing at all, no matter what I do. I think the problem is related to the onmouseover event that I'm using, but the only thing that seems to work even partway is changing the visibility to "show" in the CSS. From that I can see that the text is being assigned to the tooltips properly and that they are being positioned within the window, but the onmouseover event is having no effect either way when I revert the visibility back to "hidden." Help! Here is the code for the "toolTip.js" file: Code: // Extended Tooltip Javascript // copyright 9th August 2002, 3rd July 2005, 24th August 2008 // by Stephen Chapman, Felgall Pty Ltd // permission is granted to use this javascript provided that the below code is not altered function pw() {return window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth}; function mouseX(evt) {return evt.clientX ? evt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) : evt.pageX;} function mouseY(evt) {return evt.clientY ? evt.clientY + (document.documentElement.scrollTop || document.body.scrollTop) : evt.pageY} function popUp(evt,oi) {if (document.getElementById) {var wp = pw(); dm = document.getElementById(oi); ds = dm.style; st = ds.visibility; if (dm.offsetWidth) ew = dm.offsetWidth; else if (dm.clip.width) ew = dm.clip.width; if (st == "visible" || st == "show") { ds.visibility = "hidden"; } else { tv = mouseY(evt) + 20; lv = mouseX(evt) - (ew/4); if (lv < 2) lv = 2; else if (lv + ew > wp) lv -= ew/2; lv += 'px';tv += 'px'; ds.left = lv; ds.top = tv; ds.visibility = "visible"; } } } Here is the relevant code where I attempt to assign the event to the tooltip visibility change. Note the syntax in SetLinks() function, where the onclick behavior is set. This syntax is working perfectly here. I modelled the 'controlPopUp() syntax similarly, but no go. Code: window.onload = function() { creationCompleteHandler(); } function creationCompleteHandler() { calcNumDesigns(); setLinks(); controlToolTip(); } function calcNumDesigns() { var numDesignBoxes = designImages.length; var numGalleryRows = Math.ceil( numDesignBoxes / 3 ); for ( n = 0 ; n <= numGalleryRows - 1 ; n++ ) { var newGalleryBox = document.createElement('div'); var newGalleryBoxID = ("galleryRow" + n); newGalleryBox.setAttribute('id',newGalleryBoxID); newGalleryBox.setAttribute('class',"galleryBox"); document.getElementById('content').appendChild(newGalleryBox); squareOff(newGalleryBox); var rowBoxes; if ( ( numDesignBoxes - ( n * 3 ) ) < 3 ) { rowBoxes = ( numDesignBoxes - ( n * 3 ) - 1 ) } else rowBoxes = 2; for ( m = 0 ; m <= rowBoxes ; m++ ) { var boxNum = ( n * 3 ) + m; var newDesignBox = document.createElement('div'); var newDesignBoxID = "design" + boxNum; newGalleryBox.appendChild(newDesignBox); newDesignBox.setAttribute('id',newDesignBoxID); newDesignBox.setAttribute('class',"designBox"); var newDesignImg = document.createElement('img'); var newDesignImgID = "designImg" + boxNum; newDesignImg.setAttribute('id',newDesignImgID); newDesignImg.setAttribute('class',"designImage"); newDesignImg.src = designImages[boxNum][0]; newDesignBox.appendChild(newDesignImg); var newDesignTip = document.createElement('div'); var newDesignTipID = "tt-design" + boxNum; newDesignTip.setAttribute('class',"tip"); newDesignTip.textContent = designImages[boxNum][2] + " Artist: " + designImages[boxNum][3]; newDesignTip.innerText = designImages[boxNum][2] + " Artist: " + designImages[boxNum][3]; newDesignBox.appendChild(newDesignTip); } } } function squareOff(frame) { document.getElementById(frame.id).style.height = ((document.getElementById(frame.id).offsetWidth) * .33) + 'px'; } function setLinks() { for (var x in designImages) { document.getElementById("design"+x).onclick = new Function( "sendToURL(" + x + ")" ); } } function sendToURL(x) { var url = designImages[x][1] MM_goToURL('self',url); return document.MM_returnValue; } function MM_goToURL() { //v3.0 var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'"); } function controlToolTip() { for (var x in designImages) { var currTip = "tt-design" + x; document.getElementById( "design" + x ).onmouseover = "controlPopUp( event , " + x + ")"; } } function controlPopUp( evt , x ) { var e = evt; var currTip = "tt-design" + x; popUp( e , currTip ); } Here is the CSS: Code: .tip { font:10px/12px Arial,Helvetica,sans-serif; border:solid 1px #666666; width:270px; padding:1px; position:absolute; z-index:100; visibility:hidden; color:#333333; top:20px; left:90px; background-color:#ffffcc; layer-background-color:#ffffcc; } Thanks in advance for your help! Hi I am trying to implement a hide/show div, such that when you mouse over a div, another div pop's up below it. Here's what I have so far, but for some reason, only the first div set is working. That is when I mouse over div 1, div 2 shows up. So why isnt it working for divs 3,4 and 5,6? Here's my code: Code: HTML <div > <div id="showhide"> Line 1 </div> <div id="visiblediv" style="display: none;"> Line 2 </div> </div> <div > <div id="showhide"> Line 3 </div> <div id="visiblediv" style="display: none;"> Line 4 </div> </div> <div > <div id="showhide"> Line 5 </div> <div id="visiblediv" style="display: none;"> Line 6 </div> </div> Javascript: <script> function mover(){ document.getElementById("visiblediv").style.display="block" } function mout() { document.getElementById("visiblediv").style.display="none" } document.getElementById('showhide').onmouseover=mover; document.getElementById('showhide').onmouseout=mout; </script> CSS: #visiblediv { visibility:visible; border:1px dotted black; } Any ideas, as to why it's not working? I create a webpage where i use pagination where it is predefined that i want to show 10 item per page.But i want to do that when a user logged in he have a option that how many items he wants to show per page?javascriptkit.com site use this type?please any one help me how can i do this?
Hi. I'm new to javascripting and i'm trying to familiarise myself with it for my uni course. The code i'm trying to run is below, but for some reason it doesn't work. It is supposed to bring up a prompt box asking for the date of birth, but it doesn't. Can anyone figure out why? Any help would be much appreciated. Code: <html> <head> <title>Numerological Reading</title> <script type="text/javascript"> // Numerological Horoscope var golden = 0; var birthdate = null; var planet = null; // prompt for input and check to see that the input is 8-digit number while (birthdate.length != 8 || isNaN(parseInt(birthdate))) { birthdate = prompt("Please enter your date of birth as an 8-digit number DDMMYYYY",""); } // calculate the golden number in range 1..9 golden = eval(birthdate) % 9; if (golden==0) golden=9; // now work out ruling planet switch (golden) { case 1 : planet = "The Sun"; break; case 2 : planet = "The Moon"; break; case 3 : planet = "Jupiter"; break; case 4 : planet = "Sun/Uranus"; break; case 5 : planet = "Mercury"; break; case 6 : planet = "Venus!; break; case 7 : planet = "Moon/Neptune"; break; case 8 : planet = "Saturn"; break; case 9 : planet = "Mars"; break; // TO BE DONE: put in the other cases... default: planet = "Unknown"; break; } // finally, write the page document.write("Your golden number is "); document.write(golden); document.write("<br>Your ruling planet is "+planet); </script> </head> <body> </body> </html> Samii x Hi, I have three tables and I want show one table at one time. At the bottom of one table I need to have "next" and "previous" links to go other two tables.Can you please help me. Thank You. http://www.suttonsilver.co.uk/client...on-calculator/ Please visit the above website, Click on a Injury Type (try Minor Head Injury) on the right hand side (the human figure) Then click on the Calculate button and you will see a "calculated" figure appear, if you then click on another injury type then calculate it again, another Div will show. If two "You could be entitled up..." DIVs pop up, the previous, initially calculated 'result' should be removed and replaced by the new 'result'. Can anyone help me do this? Also.. as a side note, does anyone have a solution for when clicking calculate, two divs show up... (i.e. a 'result' and a 'contact us form'). Cheers Chris SS |