HTML - Javascript Help
For the website I'm working on i want to store the text someone enters in an imput box to be stored as a variable so i can have an alert that welcomes them to my site. any suggestions. this one isn't illegal.
Similar TutorialsHope this is the correct place for this question. What I want to do is have a webpage which asks a question, e.g. "What is your name?" and when the user enters a name, e.g. "Bob" a button pops up with "are you ready?" The user clicks that button and the page then tells the visitor: "Good morning, Bob; nice to see you" (or the button could be there from the beginning; it does not have to pop up) Just want this to learn how to do this and hope I can carry on from there. I am assuming I need a javascript to do this. I am currently working on a currency converter for my D&D website and have run into a bit of a problem. The basic idea is to select the appropriate currency you have from a row of radio buttons, insert the amount you have in a text area and in the next text area it will kick out a list of different currencies and the amount you will have in those currencies. My problem is that my JAVA skills are extremely poor. I figured out how to set up most of it but I cannot figure out how to grab the input and plug it into my formulas. Can anyone help me with this? Here is a link to the page: Currency Converter Any and all hope is greatly appreciated. Thanks. Take care and have a great day.... ciao, john., Here is the basic code without the web page info: Code: <script type = "text/javascript"> function radio_map(prefix) { var coins; // The type of coin selected // Go through all options to find the one that was selected for (cnt = 0; cnt < prefix.cointype.length; cnt++) { // If the coin was selected, checked will be true if (prefix.cointype[cnt].checked) coins = cnt; // Save that coin number } switch (coins) { // Copper case 0: prefix.matharea.value = "\n" + 1 * 1 + " Copper Coins \n" + 1 * .1 + " Silver Coins \n" + 1 * .01 + " Gold Coins \n" + 1 * .005 + " Platinum Coins \n" + 1 * .0001 + " Mithril Coins \n"; break; // Silver case 1: prefix.matharea.value = "\n" + 1 * 10 + " Copper Coins \n" + 1 * 1 + " Silver Coins \n" + 1 * .1 + " Gold Coins \n" + 1 * .05 + " Platinum Coins \n" + 1 * .001 + " Mithril Coins \n"; break; // Gold case 2: prefix.matharea.value = "\n" + 1 * 100 + " Copper Coins \n" + 1 * 10 + " Silver Coins \n" + 1 * 1 + " Gold Coins \n" + 1 * .5 + " Platinum Coins \n" + 1 * .01 + " Mithril Coins \n"; break; // Platinum case 3: prefix.matharea.value = "\n" + 1 * 1000 + " Copper Coins \n" + 1 * 10 + " Silver Coins \n" + 1 * 5 + " Gold Coins \n" + 1 * 1 + " Platinum Coins \n" + 1 * .1 + " Mithril Coins \n"; break; // Mithil case 4: prefix.matharea.value = "\n" + 1 * 10000 + " Copper Coins \n" + 1 * 1000 + " Silver Coins \n" + 1 * 100 + " Gold Coins \n" + 1 * 5 + " Platinum Coins \n" + 1 * 1 + " Mithril Coins \n"; break; } } </script> <form name="frmRadio"> <p> Please choose your coin type.</p> <div onclick ='radio_map(document.frmRadio)'> <input type="radio" name="cointype" value="Evanston"> Copper <input type="radio" name="cointype" value="Arlington Hts."> Silver <input type="radio" name="cointype" value="Oakbrook"> Gold <input type="radio" name="cointype" value="Downers Grove"> Platinum <input type="radio" name="cointype" value="Vernon Hills"> Mithril </div> Please input the number of coins that you have: <textarea name="coinarea" rows=1 cols=35> </textarea> Here are your converted coin numbers: <textarea name="matharea" rows=10 cols=35> </textarea> </form> OK so I'm making an application and I've hit a snag with my Javascript. So I have a form and a list with some value, and under the list I have a button (not a submit) HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> <script type="text/javascript"> <!-- function popUp(URL,WIDTH,HEIGHT){ day = new Date(); id = day.getTime(); var user = document.getElementById('user').value; eval("page" + id + " = window.open(URL, '"+ id + "', 'toolbar=1,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width="+WIDTH+",height="+HEIGHT+",left = 362,top = 234');"); } </script> <style type="text/css"> form{ margin: 0px; } .menu{ width: 200px; } #mem_list{ width: 200px; } </style> </head> <body> <div id="mem_list"> <center> Online User Info </center> <form method="get" action="/antrix/index.php"> <select name="color" size="5" class="menu" id="user"> <option value="Marlo">Marlo level 70 Warrior</option> <option value="Dsadasd">Dsadasd level 1 Warlock</option> <option value="Dsadasdd">Dsadasdd level 1 Priest</option> <option value="Asdassg">Asdassg level 1 Rogue</option> </select> <center> <input type="button" value="user options" onclick="javascript:popUp('mailmod.php','800','200')"/> </center> </form> </div> </body> </html> OK so when someone clicks the user options button i want the popup to go to the url and have the selected name in the GET value of the url like: mailmod.php?user=marlo if Marlo was selected. anyone got any ideas? *EDIT* yeh just realised this was in the wrong section, sorry ^_^ everything else on my page is in the right place... all except my online users code... if i make it look in place with my 1280x1024 screen resulution, 1024x768 resolutions make it look too far up the page... what can i do to make sure it is in place whatever the resuluion? please help www.anastaciadreams.com right now its too low for me.. because im trying to make it fit with the 1024x768 users but i want it to be next to online guests, not on top of the other stuff or whatever thanks a lot if you help Hi All, This doesn't completely relate to HTML, I am more asking questions about Javascript but are related to HTML and CSS. Anyways here are my questions: 1 - Can you create a javascript file (.js) with out using HTML? If so how would you view this file? 2 - Can you link a CSS file to a Javascript file? 3 - Is there a certain program which is dedicated to view/making Javascript files? 4 - Is it legal to call a program that I make JavaScript Beam? and have copyrights to the name JavaScript Beam? If that is illegal then would it be legal (inclduing copyrights) to call the program I make JS Beam? Thanks I want a clock that updates by the minute that isn't analog for my website. Most of what I see are updating by the second, or are ASCII clocks. I just want something small and simple. I don't want to use JS because I think it's sort of messy and I prefer to stick with what I know, anyway (and I don't know a lot of JS-just enough to get by, really). I've seen clocks that weren't javascript, does anyone know of a code that I could use or could point me in the right direction? Does anyone know how to get a .html file with javascript to work in a .tpl file? I view this website i found out the banner of website quite cool do anyone know this coding? kindly share with me. > below is the website http://www.justalab.com/#home hi, i have a problem with my javascript---i have an image changer, and when you click on the name of the image it changes the image and the link to view the full size image. in firefox and chrome, this works fine, but in IE it displays only the URL for the image on click. the website is http://sc-lee.com/art.html , to view/test, and the code is: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link href="branch2.css" rel="stylesheet" type="text/css" /> <script> var thelink = 'http://sc-lee.com/art/2l.jpg'; </script> </head> <body> <div id="navss"><B>OTHER WORK</B> <a href="art.html">paintings & drawings</a> / <a href="collage.html">collage</a> / <a href="graphics.html">graphics</a> </div> <div id="back"><a href="javascript: history.go(-1)">< back</a></div> <div id="contenta"> <img src=art.gif /> <br> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/2.jpg'; var thelink = 'http://sc-lee.com/art/2l.jpg'">ONE</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/1.jpg'; var thelink = 'http://sc-lee.com/art/1l.jpg'">TWO</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/3.jpg'; var thelink = 'http://sc-lee.com/art/3l.jpg'">THREE</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/4.JPG'; var thelink = 'http://sc-lee.com/art/4l.jpg'">FOUR</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/5.jpg'; var thelink = 'http://sc-lee.com/art/5l.jpg'">FIVE</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/6.jpg'; var thelink = 'http://sc-lee.com/art/6l.jpg'">SIX</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/7.jpg'; var thelink = 'http://sc-lee.com/art/7l.jpg'">SEVEN</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/9.jpg'; var thelink = 'http://sc-lee.com/art/9l.jpg'">EIGHT</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/11.jpg'; var thelink = 'http://sc-lee.com/art/11l.JPG'">NINE</a> </div> <div id="contentb"> <img id="img1" name="mainimage" src="http://sc-lee.com/art/2.jpg"> <br /> <a href="#" onclick="javascript: window.open(thelink); "> + fullsize</a> </div> </body> </html> i'm afraid i just don't know enough about the differences between IE and firefox javascript compatability to fix this. please help! thanks, stephanie Why can't this HTML Code: HTML Code: <table class='tableborder' cellpadding='6' cellspacing='1' border='0' width='100%'><tr><td class='maintitle' colspan='3' style='text-align:center'><a href='/index.php?showtopic='+ topicid +'' title='View the thread'>'+ maintitle +'</a></td></tr><tr><td align='center' class='row2' border='0'>Winner's Avatar</td><td align='center' class='row2' border='0'>Winner's Entry</td><td align='center' class='row2' border='0'>Winner's Prize</td></tr><tr><td align='center' class='row4' border='0'><a href='/index.php?showuser='+ userid +''><img src=''+ avatar +'' border='0' alt=''+ username +''s Avatar' /></a></td><td align='center' class='row3' border='0'><img src=''+ signature +'' alt=''+ username +''s Entry' /></td><td align='center' valign='middle' class='row4' border='0'><fieldset class='fieldset'><legend>Prize</legend><div><b>Name:</b> <a href='/index.php?showuser='+ userid +''>'+ username +'</a></div><div><b>Prize:</b> '+ prize +'</div><div><b>Admin Rating:</b> <img src=''+ ratimg +'' alt=''+ opinion +'' /></div><div><a href='/index.php?showtopic='+ topicid +''>Click here to visit the thread.</a></div></fieldset></td></tr></table> Go into JavaScript like this: HTML Code: <script> var topicid = ''; /* Something in here. */ var maintitle = ''; /* Something in here. */ var userid = ''; /* Something in here. */ var avatar = ''; /* Something in here. */ var username = ''; /* Something in here. */ var signature = ''; /* Something in here. */ var prize = ''; /* Something in here. */ var ratimg = ''; /* Something in here. */ var opinion = ''; /* Something in here. */ document.write('<table class='tableborder' cellpadding='6' cellspacing='1' border='0' width='100%'><tr><td class='maintitle' colspan='3' style='text-align:center'><a href='/index.php?showtopic='+ topicid +'' title='View the thread'>'+ maintitle +'</a></td></tr><tr><td align='center' class='row2' border='0'>Winner's Avatar</td><td align='center' class='row2' border='0'>Winner's Entry</td><td align='center' class='row2' border='0'>Winner's Prize</td></tr><tr><td align='center' class='row4' border='0'><a href='/index.php?showuser='+ userid +''><img src=''+ avatar +'' border='0' alt=''+ username +''s Avatar' /></a></td><td align='center' class='row3' border='0'><img src=''+ signature +'' alt=''+ username +''s Entry' /></td><td align='center' valign='middle' class='row4' border='0'><fieldset class='fieldset'><legend>Prize</legend><div><b>Name:</b> <a href='/index.php?showuser='+ userid +''>'+ username +'</a></div><div><b>Prize:</b> '+ prize +'</div><div><b>Admin Rating:</b> <img src=''+ ratimg +'' alt=''+ opinion +'' /></div><div><a href='/index.php?showtopic='+ topicid +''>Click here to visit the thread.</a></div></fieldset></td></tr></table>') </script> I hope im posting this in the right forum but here goes i think i have 2 javascripts clashing inside of one of my pages the first script is my menubar / the second is a flash game im trying to run on the site alone, they both work perfectly, however whenever i try to add the game in, the game never loads, but the menu works fine the only thing i can think of is some kinda of javascript clash and i know very little about javascript so if someone could point out my errors so that i can fix it and learn from it i would be very appreciative. The problem site is http://www.gamersjoy.com/games/actio...lshooter2.html for reference, the working game by itself is on http://www.gamersjoy.com/games/actio...alshooter.html any help would be greatly appreciated I want to pass the value from 'event.clientX' of the html line: "alert(event.clientX)" to a javascript. Right there on the same page. How can I do that? regards, ab good grief, hunting around I run across the fascinating information that 'alert' IS javascript ! Then how come this works: <html> <head> <title>Event</title> </head> <body onclick="alert(event.clientX + ' x ' + event.clientY)"> </body> </html> ? Javascript can be embedded in html and doesn't need that "<script language="javascript">" business? god almighty, what's going on............? just i load one template in the page, and i create one button in that template, but when i reduce the size of the page, the template will move but the button will exist, i mean that will be constant... how to avoid that? Hey guys / gals I have been asking around in several forums but they didnt give me correct codes. I am so desperate to get it done. I am using HTML and javascript. Everything is working expect the price list (from table) linked to the dropdown list is not shown up. I inserted the javascript code for displaying image when selected item on the order list (dropdown list), it is working well but the price list linked to this dropdown list was not shown up. Something wrong with Javascript. Can you check up my below code where is incorrect? Your help much appreciated. I urgently need your help. Thanks Look at the red and blue code below: <head> <script type="text/javascript"> window.onload = function() { document.getElementById("dlist1").onchange = function() { var option = this.options[this.selectedIndex]; document.getElementById("price_card").innerHTML = option.getAttribute("data-card") ? option.getAttribute("data-card") : ""; document.getElementById("price_memo").innerHTML = option.getAttribute("data-memo") ? option.getAttribute("data-memo") : ""; document.getElementById("price_tags1").innerHTML = option.getAttribute("data-tags1") ? option.getAttribute("data-tags1") : ""; document.getElementById("price_tags4").innerHTML = option.getAttribute("data-tags4") ? option.getAttribute("data-tags4") : ""; document.getElementById("price_key").innerHTML = option.getAttribute("data-key") ? option.getAttribute("data-key") : ""; document.getElementById("price_fridge").innerHTML = option.getAttribute("data-fridge") ? option.getAttribute("data-fridge") : ""; } } // displaying image when selected item on the order list </script> <script type="text/javascript"> function swapImage1() { var image = document.getElementById("imageToSwap1"); var dropd = document.getElementById("dlist1"); image.src = dropd.value; }; </script> <script type="text/javascript"> function swapImage2() { var image = document.getElementById("imageToSwap2"); var dropd = document.getElementById("dlist2"); image.src = dropd.value; }; </script> </head> <body> <table width="700"> // it is an order list <tr> <td> <p class="Card">ORDER 1:</p> // It is the first dropdown list named order 1 </td> </tr> <tr> <td> <p class="Dropdown"> <select name="ORDER1" size="12" multiple="multiple" id="dlist1" onchange="swapImage1()" > <optgroup label="Sow Seeds of Love"> <option value="None">None</option> <option data-card="32.00" data-memo="62.00" data-tags1="8.50" data-tags4="1.80" data-key="30.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Faith01_yellow.jpg">Faith</option> <option data-card="35.00" data-memo="65.00" data-tags1="9.50" data-tags4="1.80" data-key="20.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Grace01_green.jpg">Grace</option> <option data-card="1.00" data-memo="2.00" data-tags1="3.00" data-tags4="4.00" data-key="5.00" data-fridge="6.00" value="Images/Order_names/SowSeeds/Hope01_blue.jpg">Hope</option> <option data-card="6.00" data-memo="5.00" data-tags1="4.00" data-tags4="3.00" data-key="2.00" data-fridge="1.00" value="Images/Order_names/SowSeeds/Peace01_pink.jpg">Peace</option> <option data-card="21.00" data-memo="22.00" data-tags1="23.00" data-tags4="24.00" data-key="25.00" data-fridge="26.00" value="Images/Order_names/SowSeeds/FlowerSeedSachet01_two girls.jpg">Flower Seed</option> </optgroup> </select> </p> </td> <td> //it should display image when selected item from the order list - it is working well <img class= "ImageToSwap" id="imageToSwap1" src="Images/DropdownImages.gif" width="147" height="207" /> </td> </tr> </table> //This price list is not shown up when selected item from the order 1 (first dropdown list) Why not shown up???. <table> <tr> <th>Description</th> <th>Price</th> </tr> <tr> <td><label><input type="radio" name="medium" value="card" /> Card A6 (blank)</label></td> <td id="price_card"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="memo" /> Memo Book A6</label></td> <td id="price_memo"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags4" /> Gift Tags (4 designs per packet)</label></td> <td id="price_tags4"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags1" /> Gift Tags - Single - Assorted</label></td> <td id="price_tags1"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="key" /> Key Rings Perspex</label></td> <td id="price_key"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="fridge" /> Fridge Art</label></td> <td id="price_fridge"></td> </tr> </table> <table width="700"> // it is the second dropdown list named Order 2 <tr> <td> <p class="Card">ORDER 2:</p> </td> </tr> <tr> <td> <p class="Dropdown"> <select name="ORDER2" size="12" multiple="multiple" id="dlist2" onchange="swapImage2()" > <optgroup label="Sow Seeds of Love"> <option value="None">None</option> <option data-card="32.00" data-memo="62.00" data-tags1="8.50" data-tags4="1.80" data-key="30.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Faith01_yellow.jpg">Faith</option> <option data-card="35.00" data-memo="65.00" data-tags1="9.50" data-tags4="1.80" data-key="20.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Grace01_green.jpg">Grace</option> <option data-card="1.00" data-memo="2.00" data-tags1="3.00" data-tags4="4.00" data-key="5.00" data-fridge="6.00" value="Images/Order_names/SowSeeds/Hope01_blue.jpg">Hope</option> <option data-card="6.00" data-memo="5.00" data-tags1="4.00" data-tags4="3.00" data-key="2.00" data-fridge="1.00" value="Images/Order_names/SowSeeds/Peace01_pink.jpg">Peace</option> <option data-card="21.00" data-memo="22.00" data-tags1="23.00" data-tags4="24.00" data-key="25.00" data-fridge="26.00" value="Images/Order_names/SowSeeds/FlowerSeedSachet01_two girls.jpg">Flower Seed</option> </optgroup> </select> </p> </td> <td> // displaying image when select item from the second dropdown - it is working well <img class="ImageToSwap" id="imageToSwap2" src="Images/DropdownImages.gif" width="147" height="207" /> </td> </tr> </table> [color="RoyalBlue"]//This price list is also not shown up when selected item from the order 2 (second dropdown). Why not shown up???/COLOR] <table> <tr> <th>Description</th> <th>Price</th> </tr> <tr> <td><label><input type="radio" name="medium" value="card" /> Card A6 (blank)</label></td> <td id="Td1"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="memo" /> Memo Book A6</label></td> <td id="Td2"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags4" /> Gift Tags (4 designs per packet)</label></td> <td id="Td3"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags1" /> Gift Tags - Single - Assorted</label></td> <td id="Td4"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="key" /> Key Rings Perspex</label></td> <td id="Td5"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="fridge" /> Fridge Art</label></td> <td id="Td6"></td> </tr> </table> </body> Thank you Natz Hi All, Firstly i have looked around this site to find out where i should post this question but i cant find anywhere relevant so please move it if needs be. Right moving on, i have a javascript that validates all the fields on the page and if there in erorr they will be highlighted in red but unfortunatly it doesnt seem to be working....i javascript call is behind a button click which is below HTML Code: <a href="#" runat="server" id="BtnRaise" class="RaiseButton" onclick="javascript:formCheck(document.getElementById('txtTitleContent').value);"> Raise</a> My JavaScript File is in a Folder called Scripts/JScriptTaskChange.js (See attached Image) I have placed the path for this javascript in the SiteMaster Page is this correct? or should it be at the top of the Page im currently working on even though its inheriting the SiteMaster and all its content? I checked my Browser settings and JavaScript is Enabled, this is what i have in the Head section of the site master. HTML Code: <script language="javascript" type="text/javascript" src="/Scripts/JScriptTaskChange.js"></script> Can someone please help me. Thank you So I want to make an image that has mouseover tables that pop up. This is what the code looks like now: Code: <html> <table> <tr><td><img src= "pic.bmp" usemap="#mapareas"/></td></tr> </table> <map NAME ='mapareas'> <script language='JavaScript' type='text/javascript'> function show(id) { document.getElementById(id).style.visibility='visible'; return true; } function hide(id) { document.getElementById(id).style.visibility='hidden'; return true; } </script> <area shape = "rect" coords="0,0,100,100" title="one" onmouseover='javascript:show('one') onmouseout='javascript:hide('one')> <area shape = "rect" coords= "150,0,250,100" title="two" onmouseover='javascript:show('two') onmouseout='javascript:hide('two')> <area shape = "rect" coords= "0,150,100,250" title="three" onmouseover='javascript:show('three') onmouseout='javascript:hide('three')> <area shape = "rect" coords= "150,150,250,250" title="four" onmouseover='javascript:show('four') onmouseout='javascript:hide('four')> <area shape = "default" title="The Rest"> </map> <table border=0 cellPadding=0 cellSpacing=1 id='one' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>ONE</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='two' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>TWO</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='three' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>THREE</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='four' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>FOUR</td></tr> </table> </html> everything is ok when the page is first loaded, but when I try the mouseovers, firefox's error console gives me this message: "syntax error javascript:show(" and "syntax error javascript:hide(" Can someone help me figure out what is going wrong? Thanks Hello everyone, newbie to this forum humbly seeking help. I'll got a javascript working to display an alt image on hover and at the same time an image box appearing at another place on the page (describing the link). After preparing the linked page I discovered that the link doesn't work. When I add "a href" within the code which already only has a "href" in the javascript the complex image cutting becomes apparent with a pixel or so space between each of the cuts. I had alt images working nicely, now I find something is very much a miss. Here is the code which delivers the two alt images well but doesn't link to the target page. "<tr><td><div id="NavigationImage3" href="about_us.html" onMouseOver="F_roll('NavigationImage3',1)" onMouseOut="F_roll('NavigationImage3',0)"><img id="NavigationImage3" name="NavigationImage3" src="images/b2-3a.jpg" onLoad="F_loadRollover(this,'images/b2-3b.jpg')" alt="Sample Text" onMouseOver="swap(3, 'imgDefault')" onMouseOut="swap(0,'imgDefault')"></a></td></tr>" Be very grateful if someone can help. Cheers, Mal from Cessnock (Aus) here just i load one image into the page, so how to change that into a button? i want to change help_button.jpg into button function changeSrc() { document.getElementById("temp1"); document.getElementById("choice1"); //var img = new Image(); //img.src="template_bg.jpg"; //document.body.appendChild(img); } </script> <body onload="changeSrc()"> <div id="apDiv1"><img id="temp1" align="middle" src="template_bg.jpg" width="694" height="566" /> <div id="apDiv2"><img id="choice1" align="middle" src="help_button.jpg" width="107" height="98"</div> </div> Hey Team I am New to the boars this is my first html/java script code i wrote.. but it doesnt wan work could some body see wr my mistake is .. thx HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 4.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Reservation Form</title> </head> <body> <form action="res.php" method="post" name="pricecheck"> <input type="text" value="Limousine" disabled="disabled" /> <br> <table width="352" border="3" cellspacing="1" cellpadding="3"> <tr> <td><strong>Party size:</strong></td> <td> <select name="pasn" id="pasn" size="1"> <option value="0"></option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> </select> </td> </tr> <tr> <td><strong> Trip Type:</strong></td> <td> <select name="tt" id="tt" size="1"> <option selected="">Select One</option> <option value="One Way">One Way</option> <option value="Round Trip">Round Trip</option> <option value="Land&Sea/Sea&Land">Land&Sea/Sea&Land</option> </select> </td> </tr> <tr> <td><strong>Transfare type</strong></td> <script type="text/javascript"> <td> if(tt="One Way") { <select name="trant1" id="trant" size="1"> <option>Select One</option> <option value="12">MCO To Disney</option> <option value="13">Disney To MCO</option> <option value="14">MCO To Cruis</option> <option value="15">Cruis To MCO</option> <option value="16">Disney To Cruis</option> </select> }else if (tt="Round Trip") { <select name="trant2" id="trant" size="1"> <option>Select One</option> <option value="17">MCO To Disney To MCO</option> <option value="18">MCO To Cruis To MCO</option> <option value="19">Disney To Cruis To Disney</option> <option value="20">Dsiney To Cruis To MCO</option> }else (tt="Land&Sea/Sea&Land") { <select name="trant3" id="trant" size="1"> <option>Select One</option> <option value="21 ">MCO To Disney to Cruis To MCO</option> <option value="22">MCO To Cruis To Dsiney to MCO</option> } </script> </td> </tr> </table> </form> </body> </html> thx again iehab ********* okay made a little changes still not work.. HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 4.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Reservation Form</title> </head> <body> <form action="res.php" method="post" name="pricecheck"> <input type="text" value="Limousine" disabled="disabled" /> <br> <table width="352" border="3" cellspacing="1" cellpadding="3"> <tr> <td><strong>Party size:</strong></td> <td> <select name="pasn" id="pasn" size="1"> <option value="0"></option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> </select> </td> </tr> <tr> <td><strong> Trip Type:</strong></td> <td> <select name="tt" id="tt" size="1"> <option selected="">Select One</option> <option value="One Way">One Way</option> <option value="Round Trip">Round Trip</option> <option value="Land&Sea/Sea&Land">Land&Sea/Sea&Land</option> </select> </td> </tr> <tr> <td><strong>Transfare type</strong></td> <td> <script type="text/javascript"> var trant = array("MCO To Disney","MCO To Disney","MCO To Cruis","Cruis To MCO","Disney To Cruis","MCO To Disney To MCO","MCO To Cruis To MCO","Disney To Cruis To Disney","Dsiney To Cruis To MCO","MCO To Disney to Cruis To MCO","MCO To Cruis To Dsiney to MCO") if(tt="One Way") { for (i=0; i<=4; i++); document.write(<select name="trant[i]">tran[i]</select>); }else if (tt="Round Trip") { for (i=5; i<=8; i++); document.write(<select name="trant[i]">tran[i]</select>); }else (tt="Land&Sea/Sea&Land") { for (i=9; i<=10; i++); document.write(<select name="trant[i]">tran[i]</select>); } </script> </td> </tr> </table> <br> <input name="Submit" type="submit" value="Get Price>>" /> <input type="reset" name="Reset" id="button" value="Reset"> </form> </body> </html> |