HTML - Simple Calculator In Html
I need to make a calculator for a website. The user would have a couple of inputs, which would run through a formula, and have an output.
I don't know where to start. You'd think there would be tutorials for something as simple as this sounds. Your help is appreciated. Similar TutorialsHi all, I am looking to try to build a simple calculator in a separate page on a website. I want it to work by the user inputting a specific figures into two boxes and then they are given the answer. The maths would be done in the background and it would just be a tool that they could use to avoid making mistakes using an equation. Does anybody know if something like this is possible using HTML or would it involve something complicated than that? Thanks in advance, Tom Hello all, New member here im trying to make an HTML calculator with 2 boxes 1 box is for Kills i get in a video game 2nd box for deaths i have a video game where my leaderboard kills a 90488 kills, and i have 54933 deaths, so my kill to death ratio is 1.647243 which is basically 1.65 and in order to get to 1.66 kill to death ratio i need 476 kills how can i write this script? im new to html Im setting up a website that needs to have a calculator similiar to this link: https://www.101incorporate.com/incorporation-order.htm The user need to be able to click on things and the calculator need to change according to the different packages and items they select. And the calculator will total it out. Can anyone help me? Please. Thanks! Hi, I'm rather new to website building and this site so my apologies if I'm posting in the wrong area. I've built my first website and have obtained html code for a simple quantity X price calculator to put on my website. The problem is with some quantities entered the prices shows out to 7 or so decimal places. This should be a dollar amount so only 2 decimal places are needed. The website link is http://www.essaycorrect.com/index.php/prices/ and for example 789 words entered in top box comes back with price of 23.6699999. The coding is below. Any help would be very, very appreciated. Thanks, Tim. <script language="JavaScript"> <!-- function CalculateTotals(){ f=document.orderform; f.total1.value=parseInt(f.qty1.value)*.03; f.total2.value=parseInt(f.qty2.value)*.05; f.total3.value=parseInt(f.qty3.value)*.03; f.total4.value=parseInt(f.qty4.value)*.05; f.grandtotal.value=parseInt(f.total1.value) +parseInt(f.total2.value) +parseInt(f.total3.value) +parseInt(f.total4.value) +parseInt(f.sh.value);} //--> </script></head> <body> <form name="orderform" method="post" action="formprocessor"> <table border="3"><tr> <th>Word count</th><th>Service</th><th>Time</th> <th>Price per word</th><th>Price(A$)</th></tr> <tr><td> <input name="qty1" size="10" OnBlur="CalculateTotals()" /></td> <td>Standard</td><td>Below 5000 words=3days / Above 5000 words=7days </td> <td align="right">3 cents </td> <td><input name="total1" size="6" OnFocus="document.orderform.qty2.select(); document.orderform.qty2.focus();" /></td></tr> <tr><td> <input name="qty2" size="10" OnBlur="CalculateTotals()" /></td> <td>Express</td><td>Below 5000 words=1day / Above 5000 words=3days </td> <td align="right">5 cents </td> <td><input name="total2" size="6" OnFocus="document.orderform.qty3.select(); document.orderform.qty3.focus();" /></td></tr> </table> <input type="hidden" value="0" name="sh" /> </form> <script language="JavaScript"> <!-- f=document.orderform; f.qty1.value=0; f.qty2.value=0; f.qty3.value=0; f.qty4.value=0; f.total1.value=0; f.total2.value=0; f.total3.value=0; f.total4.value=0; f.sh.value=0; f.grandtotal.value=0; f.grandtotal.value=0; //--> </script> </body></html> My html problem keeps failling, with all my image codes.. shown for 10 errors which are all for the images what's wrong? Here is the 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" /> <!-- New Perspectives on HTML and XHTML 5th Edition Tutorial 2 Case 2 Fiddler Home Page Author: Date: 2-16-2011 Filename: home.htm Supporting files: fiddler.jpg --> <title>, ITSE 1411 Lab Project 2, Tutorial 2 Case 2, Due 02/23/2011</title> </head> <body> <div> <img src="fiddler.jpg" alt="Fiddler on the Roof" /> <hr /> <a href="home2.htm"><img src="home.jpg" alt="home" /></a> <a href="slide1txt.htm"<img src="start.jpg" alt="start" /></a> <a href="slide1txt.htm"<img src="back.jpg" alt="back" /></a> <a href="slide2txt.htm"<img src="forward.jpg" alt="forward" /></a> <a href="slide6txt.htm"<img src="end.jpg" alt="end" /></a> <br /> <a href="slide1txt.htm"<img src="thumb1.jpg" alt="slide1" style="border-width: 5" /></a> <a href="slide2txt.htm"<img src="thumb2.jpg" alt="slide2" style="border-width: 0" /></a> <a href="slide3txt.htm"<img src="thumb3.jpg" alt="slide3" style="border-width: 0" /></a> <a href="slide4txt.htm"<img src="thumb4.jpg" alt="slide4" style="border-width: 0" /></a> <a href="slide5txt.htm"<img src="thumb5.jpg" alt="slide5" style="border-width: 0" /></a> <a href="slide6txt.htm"<img src="thumb6.jpg" alt="slide6" style="border-width: 0" /></a> </div> <hr /> <div> <img src="slide1.jpg" alt="slide1" /> </div> <blockquote> <p><i>Do You Love Me?</i> sung by Deb Ingalls and Thomas Gates</p> </blockquote> </body> </html> Hi folks first time on this particular board. I once encountered a realy simple "CMS" system. somehow there was an area on "index.htm" that called in a .txt file and displayed it. what would the code be to do this? I thought about Iframes but this is depricated nowadays. Also I want to use this method (if it exists) to build an admin area which writes to the afore-mentioned .txt file in order to make simple updates to the text on the site. Can I do this? Thanks for helping sorry im a bit of a n00b! I just launched my first web page (free on GoDaddy) and it doesn't run right. It is only simple html. it keeps trying to reload. I thought at first the header GD inserts was try to fit into a space not big enough, so I put in a few <br/> to make room but that did not work. Here is a sample of my code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title></title> </head> <frameset rows="18%,82%"> <frame src="CryofFreedomheader.htm" marginwidth="0" marginheight="0" scrolling="no"/> <frameset cols="25%,75%"> <frame src="navbar.htm"/> <frame src="cofcontent.htm" name="cofcontent" /> </frameset> <noframes> <h1>>This frameset document contains:</h1> <ul> <li>page1</li> <li>page2</li> <li>page3</li> </ul> </noframes> </frameset> </html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>cofcontent</title> </head> <body> <br/> <br/> <br/> <br/> <br/> <h1></h1> <p style="font-size: 15pt; font-weight: bold"></p> <p> © 2009 </p> </body> </html> Any help will be appreciated. I am having trouble getting my email signature to be single spaced. Hopefully, you guys can help me out. Here is the existing code: <p><strong>Landmark Tax Group</strong></p> <p><strong></strong>2701 Harbor Blvd., Ste. E2-303</p> <div>Costa Mesa, CA 92626</div> <p> </p> Which looks like this when viewed in Roundcube Webmail: Landmark Tax Group 2701 Harbor Blvd., Ste. E2-303 Costa Mesa, CA 92626 I need the above lines to look like this: Landmark Tax Group 2701 Harbor Blvd., Ste. E2-303 Costa Mesa, CA 92626 I appreciate your help! Thank you! Michael Hi everyone, I'm new to the board and wondered if I could pick your brains... I'm in the process of finishing off a website to showcase my photography work. There is one small problem with it that has been bugging me. On two of the pages, the menu buttons are higher up than on every other page. I've tried fixing it in FrontPage, but had no luck so far. If anyone could help me figure out why this is so I can fix it I'd be very grateful! Many Thanks, James Hi, check this code out: HTML Code: <div id="Login Top"> <form action = "http://www.bfndevelopment.com/cgi-bin/home/Members/Password/NetLock.cgi?SiteID=19873&LockID=5465&Frame=1" method = "POST"> <input type = "hidden" name = "login" value = "false"> <!-- if "true" and someone tries logging in with no username, they will be --> <!-- prompted to enter there username and password again, on our template --> <table border = 0 <table border = 0 cellpadding = 0 cellspacing = 0 width = 300 height = 100> </td><tr> <table border = 0 cellpadding = 3 cellspacing = 0 width = 300 height = 20> <input type = "text" class="signin" name = "UserName" value="Username"onclick="if (this.value == 'Username') { this.value = ''; }" size = 5> <input type = "password" class="signin" name = "PassWord" value="Password"onclick="if (this.value == 'Password') { this.value = ''; }" size = 5> <input type = "image" src="http://www.islamcentre.net/library/loginbtn.gif" value = "Login"></div> </table> </form> Now, If u view this code on a browser, the login button appears to be slightly raised. What is the problem. I want it to be on the line, not a little higher. if anyone could slightly adjust this to it being on the line it would be much appreciated. Thanks Hi. In a table data I have four lines of text each line separated by a <br> The text are different font sizes. The issue I am having is that the lines have space between them above and below. How do I get the lines of text closer together using simple html? text line 1 | (this space) | text line 2 Regards Hello, on my page i am having 3 problems at the moment. >>The first, is that in firefox my page is centered, and in IE it is not. >>The second, is that my navigation bar (in a table) seems to be putting a pixel in between my image links, EVEN THOUGH i have specified border="0" and border:0 in my css and my html. >>The third, is that 4 images arent showing up (on test.html), but i can click on the area where they SHOULD be showing up, and use them as invisible links. I want the images to show up. I must also specify that i am working to make it look perfect in FIREFOX, but if you could suggest anything that would improve it visually in IE too, that would be a bonus. Thanks in advance if you can help me! I've included a zip of the files rather than pasting all the code. Thanks again. hi guys, this will make no sense why I want to do it, but its part of a bigger thing. I want a text box on a page, with a button next to it, (like google.com) you put in a *TextStringVariable* in the text box. you click the button. this launches a new browser with the url http://www.hyperthetical.com.au/*TextStringVariable* I only have front page by the way. I am thinking this is a piece of cake to those who know. I hope someone will help me. Cheers R Hi, Im making a website for a family member. It turns out we need to modify some html to get it to look how we want. (we are using a control panel / template style program) to make the website I have a search box and go button layered on top of the header/banner of my website. In internet explorer the banner is partially blanked out by the search box (but not in firefox or safari). Take a look at: http://cart.street-pharmacy.com. Below is the code I think needs modifiying. Thanks in advance Ben <div> <form action="{$url_http}" method="get" style="padding:0px;margin:0px;"> <table border="0" style="float:right; margin:32px 4px 0px 0px;"> <tr><td><input type="hidden" name="p" value="catalog"/> <input type="hidden" name="mode" value="search"/> <input type="hidden" name="search_in" value="all"/> <input maxlength="256" type="text" name="search_str" style="width:122px;font-size:10px;"/></td> <td><input type="submit" value="Go"/></td></tr> </table> </form> </div> Hi guys. I'm not very familiar with HTML at all, but I have just created a new blog on blogspot. I created a new "page" to make a gallery and I wanted to add my gallery as a simple HTML thumbnail thingie. I mean lots of thumbnails with a short description below the picture that allowed me to write like "Photoshoot 5/1-2012" or something like that. I made this code to make a thumbnail that when you click on it, the picture gets the original size, but would it be possible just by HTML coding to make the thumbnail go into a slideshow of pictures from that shoot without making it go to an external page? HTML Code: <a href="http://www.supercoloring.com/wp-content/thumbnail/2009_01/t-coloring-page.gif"> <img height="150" src="http://www.supercoloring.com/wp-content/thumbnail/2009_01/t-coloring-page.gif" width="150" /></a> If anyone got another idea that would work for me I'd love it. I don't know if I'm allowed to post my page but it's kenmoe . blogspot . com, I can delete it if it's not allowed, but it's a sub page next to "Blog" where I'd love a gallery that still looks nice and keeps the user on my page. Have a happy new year everyone! Hello, im a new at html but i got the swing of it quickly. but my body paragraph i cant get right. its in the center when i want it up more here is my coding. whats in red is what im having problems with. also my website is universalentertainmentcentral.hostoi.com oh and please ignore the comments at the bottom they are embarrassing. HTML Code: <html> <head> <title> Entertainment Center </title> <style type="text/css"> body { background-image: url("Background.png"); background-repeat: no-repeat; background-attachment: fixed; background-position: top center } p.margin { margin-top:0cm; margin-right:1.8cm; margin-left:4.8cm; } p.chat { margin-right:4.8cm; margin-left:0cm; } p.def { margin-top:0cm; margin-right:4.8cm; margin-left:4.8cm; } #HCB_comment_box input.text { color:white; } #HCB_comment_box div.comment { color:white;} #HCB_comment_box textarea, #HCB_comment_box input.text { color:white;} </style> </head> <body> <center><img src="images\logo.jpg"></img></center> <center><div style="white-space: nowrap;"><tr><img src="button1.jpg" onmouseover="this.src='button1c.jpg';" onmouseout="this.src='button1.jpg';"/><img src="button2.jpg" onmouseover="this.src='button2c.jpg';" onmouseout="this.src='button2.jpg';"/><img src="button3.jpg" onmouseover="this.src='button3c.jpg';" onmouseout="this.src='button3.jpg';"/><img src="button4.jpg" onmouseover="this.src='button4c.jpg';" onmouseout="this.src='button4.jpg';"/><img src="button5.jpg" onmouseover="this.src='button5c.jpg';" onmouseout="this.src='button5.jpg';"/></tr></center> <p class="def"><table border=0 cellpadding=0 cellspacing=10> <tr> <td> <!-- Counter Code START --><a href="http://www.e-zeeinternet.com/" target="_blank"><img src="http://www.e-zeeinternet.com/count.php?page=572456&style=LED_r&nbdigits=9&reloads=1" alt="Free Hit Counter" border="0" ></a><br><a href="http://www.e-zeeinternet.com/" title="Free Hit Counter" target="_blank" style="font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 10px; color: #000000; text-decoration: none;"></a><!-- Counter Code END --></div></td><td><img src="images\fb.png"></img></td> </tr> </table></p> <table border=0 cellpadding=0 cellspacing=0> <tr> <td><p class="margin"><font face="Times New Roman" size="+3" color="white">Site Under Construction</font></p> <p class="margin"><font face="Times New Roman" color="white">[color="Red"]New to the site? well then I extend my welcome! We are currently under construction and looking forward to opening soon. What we do is make a fun and safe place for people to go on in there down time. Also we host buisness software and write game reviews for anyone who is not in the know. We also host Java, Shockwave, and Flash games. If your not a game player we will host anime shows from various titles "If we can get the rights." Hope to see everyone soon[/color]. ; )</font></p></td> <td><p class="chat"><object width="250" height="360" id="obj_1292110525893"><param name="movie" value="http://EntertainmentCent.chatango.com/group"/><param name="AllowScriptAccess" VALUE="always"/><param name="AllowNetworking" VALUE="all"/><param name="AllowFullScreen" VALUE="true"/><param name="flashvars" value="cid=1292110525893&a=000000&b=100&c=999999&d=848484&e=000000&g=CCCCCC&h=333333&i=29&j=CCCCCC&k=666666&l=333333&m=000000&n=CCCCCC&p=12&s=1&t=0"/><embed id="emb_1292110525893" src="http://EntertainmentCent.chatango.com/group" width="250" height="360" allowScriptAccess="always" allowNetworking="all" type="application/x-shockwave-flash" allowFullScreen="true" flashvars="cid=1292110525893&a=000000&b=100&c=999999&d=848484&e=000000&g=CCCCCC&h=333333&i=29&j=CCCCCC&k=666666&l=333333&m=000000&n=CCCCCC&p=12&s=1&t=0"></embed></object><br>[ <a href="http://EntertainmentCent.chatango.com/clonegroup?ts=1292110525893">Copy this</a> | <a href="http://chatango.com/creategroup?ts=1292110525893">Start New</a> | <a href="http://EntertainmentCent.chatango.com">Full Size</a> ]</p></td> </tr> </table> <p class="def"><table border=0 cellpadding=0 cellspacing=0 width="950"> <tr> <td><!-- begin htmlcommentbox.com --> <div id="HCB_comment_box"><a href="http://www.htmlcommentbox.com">HTML Comment Box</a> is loading comments...</div> <link rel="stylesheet" type="text/css" href="http://www.htmlcommentbox.com/static/skins/simple/skin.css" /> <script type="text/javascript" language="javascript" id="hcb"> /*<!--*/ (function(){s=document.createElement("script");s.setAttribute("type","text/javascript");s.setAttribute("src", "http://www.htmlcommentbox.com/jread?page="+escape((typeof hcb_user !== "undefined" && hcb_user.PAGE)||(""+window.location)).replace("+","%2B")+"&opts=406&num=10");if (typeof s!="undefined") document.getElementsByTagName("head")[0].appendChild(s);})(); /*-->*/ </script> <!-- end htmlcommentbox.com --></td> </tr> </table></p> </body> </html> <html> <head> <title> Entertainment Center </title> <style type="text/css"> body { background-image: url("Background.png"); background-repeat: no-repeat; background-attachment: fixed; background-position: top center } p.margin { margin-top:0cm; margin-right:1.8cm; margin-left:4.8cm; } p.chat { margin-right:4.8cm; margin-left:0cm; } p.def { margin-top:0cm; margin-right:4.8cm; margin-left:4.8cm; } #HCB_comment_box input.text { color:white; } #HCB_comment_box div.comment { color:white;} #HCB_comment_box textarea, #HCB_comment_box input.text { color:white;} </style> </head> <body> <center><img src="images\logo.jpg"></img></center> <center><div style="white-space: nowrap;"><tr><img src="button1.jpg" onmouseover="this.src='button1c.jpg';" onmouseout="this.src='button1.jpg';"/><img src="button2.jpg" onmouseover="this.src='button2c.jpg';" onmouseout="this.src='button2.jpg';"/><img src="button3.jpg" onmouseover="this.src='button3c.jpg';" onmouseout="this.src='button3.jpg';"/><img src="button4.jpg" onmouseover="this.src='button4c.jpg';" onmouseout="this.src='button4.jpg';"/><img src="button5.jpg" onmouseover="this.src='button5c.jpg';" onmouseout="this.src='button5.jpg';"/></tr></center> <p class="def"><table border=0 cellpadding=0 cellspacing=10> <tr> <td> <!-- Counter Code START --><a href="http://www.e-zeeinternet.com/" target="_blank"><img src="http://www.e-zeeinternet.com/count.php?page=572456&style=LED_r&nbdigits=9&reloads=1" alt="Free Hit Counter" border="0" ></a><br><a href="http://www.e-zeeinternet.com/" title="Free Hit Counter" target="_blank" style="font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 10px; color: #000000; text-decoration: none;"></a><!-- Counter Code END --></div></td><td><img src="images\fb.png"></img></td> </tr> </table></p> <table border=0 cellpadding=0 cellspacing=0> <tr> <td><p class="margin"><font face="Times New Roman" size="+3" color="white">Site Under Construction</font></p> <p class="margin"><font face="Times New Roman" color="white"> New to the site? well then I extend my welcome! We are currently under construction and looking forward to opening soon. What we do is make a fun and safe place for people to go on in there down time. Also we host buisness software and write game reviews for anyone who is not in the know. We also host Java, Shockwave, and Flash games. If your not a game player we will host anime shows from various titles "If we can get the rights." Hope to see everyone soon . ; )</font></p></td> <td><p class="chat"><object width="250" height="360" id="obj_1292110525893"><param name="movie" value="http://EntertainmentCent.chatango.com/group"/><param name="AllowScriptAccess" VALUE="always"/><param name="AllowNetworking" VALUE="all"/><param name="AllowFullScreen" VALUE="true"/><param name="flashvars" value="cid=1292110525893&a=000000&b=100&c=999999&d=848484&e=000000&g=CCCCCC&h=333333&i=29&j=CCCCCC&k =666666&l=333333&m=000000&n=CCCCCC&p=12&s=1&t=0"/><embed id="emb_1292110525893" src="http://EntertainmentCent.chatango.com/group" width="250" height="360" allowScriptAccess="always" allowNetworking="all" type="application/x-shockwave-flash" allowFullScreen="true" flashvars="cid=1292110525893&a=000000&b=100&c=999999&d=848484&e=000000&g=CCCCCC&h=333333&i=29&j=CCCC CC&k=666666&l=333333&m=000000&n=CCCCCC&p=12&s=1&t=0"></embed></object><br>[ <a href="http://EntertainmentCent.chatango.com/clonegroup?ts=1292110525893">Copy this</a> | <a href="http://chatango.com/creategroup?ts=1292110525893">Start New</a> | <a href="http://EntertainmentCent.chatango.com">Full Size</a> ]</p></td> </tr> </table> <p class="def"><table border=0 cellpadding=0 cellspacing=0 width="950"> <tr> <td><!-- begin htmlcommentbox.com --> <div id="HCB_comment_box"><a href="http://www.htmlcommentbox.com">HTML Comment Box</a> is loading comments...</div> <link rel="stylesheet" type="text/css" href="http://www.htmlcommentbox.com/static/skins/simple/skin.css" /> <script type="text/javascript" language="javascript" id="hcb"> /*<!--*/ (function(){s=document.createElement("script");s.setAttribute("type","text/javascript");s.setAttribute("src", "http://www.htmlcommentbox.com/jread?page="+escape((typeof hcb_user !== "undefined" && hcb_user.PAGE)||(""+window.location)).replace("+","%2B")+"&opts=406&num=10");if (typeof s!="undefined") document.getElementsByTagName("head")[0].appendChild(s);})(); /*-->*/ </script> <!-- end htmlcommentbox.com --></td> </tr> </table></p> </body> </html> hi, i tried looking through forums but couldnt find an answer. i hope u can please help! i have a photography ad up on a site that i use html for, its simply a block of code hosting a list/tall page of pics, one line/pic goes like this... <img src="http://img715.imageshack.us/img715/3126/img7899small.jpg"><br> the other lines in the text are the same code. problem is they all try to load up simultaneously causing a slow ad to see anything, potentially losing observers attention span. do u know if theres some code i can add to each line so each pic loads up fully before the next one begins to load and this starts at the top? this will help keep attention due to somin at the top loading straight away, thanks! Hello, I want to sell something on ebay, and I want to make a thumbnail picture that when clicked, opens in a FITTED new window. As far as I know, eBay only allows basic html (I could be wrong). I already know the target="_blank" thing, but I want the new popup window to be the exact size of the photo that's popping up. How do I do that? Additionally if possible, can I take out the File Edit etc, and the scrollbars? First let me excuse myself for being so un-educated with HTML. Or any language for that matter.. I currently am starting a photography business and since Facebook is a great way to connect, I am in the process of making a professional looking Page via their FBML Tab (the fact that I am coding through facebook shouldn't interfere with my questions). There are two thing I am trying to achieve that I am sure are simple too, but I don't know how. Here goes: Question 1: These boxes are almost literally what I will be doing on my site. There are three images below this text, the first two you see are seamlessly touching horizontally. I need to know how to achieve this vertically also, with not even 1px between a top and bottom image (Here would be about a 2px space if I were to put <br> in my code [or return key]. But If I don't do something, the boxes would stay horizontal) Question 2: This is a mock-up of what the starting page will look like. In the blue box is my question. I hope this ^ made since. And the reason why I mentioned imageshack.us is because I dont have anywhere else to host images, so the code would have to accommodate several completely different image URLs. If any additional info is needed please lmk. I am pretty eager to get to workin on this. - Brandon This is a table related issue. Is it possible to have one long row for your first row and then have 2 small columns on the 2nd row? I tried
Code: <table border="1" align=center cellspacing="1"> <tr><td background="./images/topbanner.gif" width="512" height="22"></td></tr> <tr><td bgcolor="#0099FF" width="22" height="22"></td><td> </td></tr> </table> And that didn't appear to work..it makes another column on the first row.. |