|
HTML - How Do I Make This Work? [html And Css]
Hi all, I'm having a little trouble here, I'm a newbie at coding but I'm learning. how would I achieve something like this?
http://www.createblog.com/layouts/code.php?id=28757 and or like this? http://www.createblog.com/layouts/code.php?id=28038 should I be using divs...as you can see in my code I went div crazy...I kinda perfer divs anyway! how can I do this? HTML Code:
<style type="text/css">
a:link {color: #66cdaa;
font-family: verdana;
font-size: 6pt;
text-transform: uppercase;
text-decoration: none;}
a:visited {color: #cc6600;
font-family: verdana;
font-size: 6pt;
background:#FFFFFF;
text-transform: uppercase;
text-decoration: none;}
a:hover {color: #870708;
font-family: verdana;
font-size: 6pt;
background:#FFFFFF;
text-transform: lowercase;
cursor:hand;}
/*all links above*/
body {background-color: black;}
color: #ffffff;
font-weight:bold;
font-family: arial;
font-size: 12px;
margin: 0px auto;
padding: 0px;
text-align: justify;
scrollbar-face-color:#1ee849;
scrollbar-shadow-color:#1ee849;
scrollbar-3dlight-color:#1ee849;
scrollbar-arrow-color:#000000;
scrollbar-track-color:#1ee849;
scrollbar-darkshadow-color:#1e
scrollbar-highlight-color:#1ee849;}
h1{color:#66cdaa;
font-size: 20px;
letter-spacing: -1px;
text-align: left;
font-family: arial;
margin: 10px 0px 0px 0px;
line-height: 15px;}
h2{color:#66cdaa;
font-size: 15px;
letter-spacing: -1px;
text-align: left;
font-family: arial;
margin: 10px 0px 0px 0px;}
p {
font-weight: bold;
color:#66cdaa ;
font-family:times ;
font-size: 12px;
}
/*all divs here*/
div {
font-weight: normal;
color:#66cdaa ;
font-family: times;
font-size: 12px;
}
div#header {
clear: both;
height: 50%;
width: 100%;
background-color: ;
padding: 1px;
}
div#master {
float: center;
width: 100%;
background-color:white;
}
div#left {
float: left;
width: 150px;
background-color: black;
}
div#right {
float: right;
width: 150px;
background-color:black;
}
div#middle {
padding: 0px 160px 5px 160px;
margin: 0px;
background-color:black;
}
div#footer {
clear: both;
background-color:grey;
}
</style>
<title>I like my nails</title>
</head>
<!--who ha -->
<body>
<div id="Head"><img src="pic location" width="100%" height="50%" alt="pic name " />
</div>
<br />
<br />
<div id="master">
<div id="left">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus justo, luctus vel, pretium quis, semper id,
metus. Duis quis turpis id sapien hendrerit aliquam. Duis nisl. Sed fermentum magna ac velit. Integer tincidunt arcu ac elit.
Fusce urna pede, dapibus id, mollis eu, tempor eget, nunc. Integer eros quam, scelerisque sagittis, ultricies non,
pellentesque id, elit. Nam accumsan fermentum massa. Suspendisse vehicula ultricies nisi. Curabitur tempus bibendum mi. Donec
eu lectus vitae dolor accumsan auctor. Cras quis dolor sed ipsum tristique pulvinar. Nam id quam vitae lectus tempor
faucibus. Aliquam id nisi ut nisl semper blandit. Morbi pellentesque congue lacus. Sed sed metus. Quisque libero mi,
malesuada ut, tincidunt et, fringilla ut, erat. Sed accumsan gravida dui. Donec enim turpis, mattis eget, adipiscing dictum,
</div>
<div id= "right">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus justo, luctus vel, pretium quis, semper id,
metus. Duis quis turpis id sapien hendrerit aliquam. Duis nisl. Sed fermentum magna ac velit. Integer tincidunt arcu ac elit.
Fusce urna pede, dapibus id, mollis eu, tempor eget, nunc. Integer eros quam, scelerisque sagittis, ultricies non,
pellentesque id, elit. Nam accumsan fermentum massa. Suspendisse vehicula ultricies nisi. Curabitur tempus bibendum mi. Donec
eu lectus vitae dolor accumsan auctor. Cras quis dolor sed ipsum tristique pulvinar. Nam id quam vitae lectus tempor
faucibus. Aliquam id nisi ut nisl semper blandit. Morbi pellentesque congue lacus. Sed sed metus. Quisque libero mi,
malesuada ut, tincidunt et, fringilla ut, erat. Sed accumsan gravida dui. Donec enim turpis, mattis eget, adipiscing dictum,
</div>
<div id="middle">
<h1>Your Header Here</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus justo, luctus vel, pretium quis, semper id,
metus. Duis quis turpis id sapien hendrerit aliquam. Duis nisl. Sed fermentum magna ac velit. Integer tincidunt arcu ac elit.
Fusce urna pede, dapibus id, mollis eu, tempor eget, nunc. Integer eros quam, scelerisque sagittis, ultricies non,
pellentesque id, elit. Nam accumsan fermentum massa. Suspendisse vehicula ultricies nisi. Curabitur tempus bibendum mi. Donec
eu lectus vitae dolor accumsan auctor. Cras quis dolor sed ipsum tristique pulvinar.
Nam id quam vitae lectus tempor faucibus. Aliquam id nisi ut nisl semper blandit. Morbi pellentesque congue lacus. Sed sed
metus. Quisque libero mi, malesuada ut, tincidunt et, fringilla ut, erat. Sed accumsan gravida dui. Donec enim turpis, mattis
eget, adipiscing dictum, vestibulum id, nulla. Etiam consectetuer. Duis varius sem eu nisi. Praesent congue aliquam elit. Sed
nec sapien. Curabitur lacinia, augue et hendrerit pharetra, sem magna lobortis quam, ac volutpat magna nisl vel libero. Duis
magna. Vestibulum suscipit dui id magna. Suspendisse potenti. Etiam ut purus. Praesent tincidunt, elit bibendum eleifend
tincidunt, arcu lacus vestibulum magna, et pellentesque est justo fringilla dui. Cum sociis natoque penatibus et magnis dis
parturient montes, nascetur ridiculus mus. Curabitur elit. Mauris dignissim gravida massa.
Vivamus eu odio. Proin euismod aliquet erat. In sed justo. Nulla a dolor ac tortor placerat elementum. Donec nisi. Donec
lobortis. Cras ut augue. Donec enim. Aenean ut ligula ac arcu suscipit consectetuer. Duis nibh dui, mollis et, elementum ac,
luctus eu, diam. Quisque risus nunc, pharetra in, commodo vel, vestibulum in, tellus. Praesent blandit sagittis nisi. In hac
habitasse platea dictumst.
Morbi interdum. Nullam tincidunt enim eu mauris. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere
cubilia Curae; Ut pretium, justo at pharetra suscipit, lorem nulla sodales dui, at ultrices quam tellus sit amet metus.
Pellentesque consequat vestibulum sem. Cras consectetuer ipsum non augue. Praesent tellus nulla, sodales at, pretium ut,
consectetuer vel, massa. Aenean risus orci, suscipit eget, ornare eget, lacinia sit amet, sem. Ut vulputate, metus quis
posuere gravida, massa nisi commodo tellus, viverra cursus massa leo at purus. Morbi feugiat fermentum lectus. Aliquam
blandit placerat velit. Aliquam vestibulum porta elit.
In erat. Etiam non augue. Aenean luctus. Fusce arcu mauris, vehicula quis, ultrices sed, porta nec, dolor. Donec eros tellus,
posuere nec, vehicula ut, venenatis at, diam. Curabitur hendrerit. Nulla enim enim, sodales nec, imperdiet ac, gravida vel,
dolor. Etiam hendrerit, leo a mollis semper, elit metus tincidunt pede, sit amet porta turpis quam at diam. Proin sagittis
nulla luctus elit. Curabitur non sapien. Proin eget orci. Curabitur tortor mauris, faucibus a, euismod fermentum, congue
eget, nisi. Sed et purus. Curabitur eget quam et massa dignissim tristique. Cras elit.
</div>
</div>
<div id="footer"><strong>Copy right 2008 Syd</strong> | Design by <strong>Syd</strong></div>
<!--end of the stuff-->
</body>
</html>
Similar TutorialsHi all, I have a question,my code is running properly ,when i copy this and paste in Microsoft outlook express its not working. I have a link to a section of page when i click its heading.My Page is quite big one,so i wrote headings and once its clicked it should go to the section of content. my code ------------ HTML Code: <html>
<body>
<div id="wrapper">
<div id="IUbanner">
<a href="http://www.indiana.edu"><img src="../images/iu_crimson.gif"
alt="Indiana University" /></a>
</div>
<div id="header">
<a href="http://uits.iu.edu"><img src="../images/UITSheader.gif"
alt="University Information Technology Services" /></a>
</div>
<h1 id="subheader"><a href="http://webmaster.iu.edu"><img
src="../images/wmheader.gif" alt="IU Webmaster" border="0"/></a></h1>
<div id="centerwrap">
<div id="content">
<!-- Insert content here -->
<a name="TOP"></a>
<H3>Getting Started</H3>
<H5>Table of Contents</H5>
<ul>
<a href="#a">Introduction</a> <br>
<a href="#b">Getting an Account</a> <br>
<a href="#c">Getting the Tools</a> <br>
<a name="a"></a>
<hr>
<h5>Introduction</h5>
<p> If you are new to developing Web pages, this brief overview will
help
you get started. It outlines the steps you will take to publish your
Web
pages on IU's central Web servers (<tt>Veritas/Champion</tt>). If you
are
familiar with the process of creating and publishing Web pages, see the
Webmaster's "<a href=../tool_guide_info/tgcat.shtml>Tools and
Guides</a>" page to
learn more about improving your Web pages and for help with the tools
offered for the
central web server accounts.</p>
<P>
<CENTER><A HREF="#TOP">Return to Top of Page</A></CENTER></p>
<A NAME="b"></A>
<hr>
<h5>Getting an Account</h5>
<P> Before you can put Web pages on IU's central Web servers
(<tt>Veritas/Champion</tt>),
you need to get an account. To see if you are eligible to have an
account on
an IU web server and to learn how to get an account if you are
eligible, see
the Webmaster's <a href="../account_info/ac.shtml">Accounts</a>
page. </p>
<P><CENTER><A HREF="#TOP">Return to Top of Page</A></CENTER> </p>
<A NAME="c"></A>
<hr>
<h5>Getting the Tools</h5>
<p> Once you have an account on the Web server, the next step is to
get the tools
you will need to create, upload, and view your Web pages. If you
do not already
have these tools, you can get most of the them from <a
href="http://iuware.indiana.edu/">IUware Online</a>. For information
on
obtaining the IUware CD please see the
Knowledge Base entry: <a href="http://kb.iu.edu/data/amij.html">At IU,
where can I get the IUware CD?</a></p>
<p>
Here are the tools you will need to get started: </p>
<ul>
<li><strong>A text editor or word processor</strong>: To create
your Web page,
you'll need a text editor or word processor. Windows computers
come with
a text-editor called "Notepad" and Macintoshes come with a text
editor called
"Simple Text."
</div><!-- end footer -->
</div><!-- end wrapper -->
</body>
</html>
please help me guys!!! im trying to find a html code that allows people download a pdf files from the website that im trying to make..anyone out there help me.. http://www.ivoog.com/test The page is COMPLETELY messed up in IE 6. I am not sure what I have done wrong as everything I see is ok. How can it look exactly like IE 7? What changes? Thanks. I'm convinced that its very simple but cant figure it out yet. I'd really appreciate your help. I'm trying to integrate my aweber code into a graphical form. AWEBER CODE ---------------------------------------- HTML Code: <form method="post" class="af-form-wrapper" action="http://www.aweber.com/scripts/addlead.pl" > <div style="display: none;"> <input type="hidden" name="meta_web_form_id" value="378818622" /> <input type="hidden" name="meta_split_id" value="" /> <input type="hidden" name="listname" value="superpowernutri" /> <input type="hidden" name="redirect" value="http://google.com" id="redirect_3851a3a65806cdcf11082fdddc304cdb" /> <input type="hidden" name="meta_adtracking" value="superpower" /> <input type="hidden" name="meta_message" value="1" /> <input type="hidden" name="meta_required" value="name,email" /> <input type="hidden" name="meta_tooltip" value="" /> </div> <div id="af-form-378818622" class="af-form"><div id="af-body-378818622" class="af-body af-standards"> <div class="af-element"> <label class="previewLabel" for="awf_field-31806523">Name: </label> <div class="af-textWrap"> <input id="awf_field-31806523" type="text" name="name" class="text" value="" tabindex="500" /> </div> <div class="af-clear"></div></div> <div class="af-element"> <label class="previewLabel" for="awf_field-31806524">Email: </label> <div class="af-textWrap"><input class="text" id="awf_field-31806524" type="text" name="email" value="" tabindex="501" /> </div><div class="af-clear"></div> </div> <div class="af-element buttonContainer"> <input name="submit" class="submit" type="submit" value="Submit" tabindex="502" /> <div class="af-clear"></div> </div> --------------------------------------- THE GRAPHICAL FORM THAT I'M TRYING TO INTEGRATE THE ABOVE CODE INTO: ---------------------------------------------------------------------- HTML Code: AUTORESPONDER CODE START HERE //-->
<!-- You can edit or replace the form below with your own autoresponder code -->
<form>
<input type="text" name="name" class="name_field" value="Enter Your First Name" onFocus="if(this.value == 'Enter Your First Name'){ this.value = ''; this.style.color= '#1a1a1a'; }" onBlur="if(this.value == ''){ this.value = 'Enter Your First Name'; this.style.color= '#818181'; }" />
<input type="text" name="email" class="email_field" value="Enter Your Email Address" onFocus="if(this.value == 'Enter Your Email Address'){ this.value = ''; this.style.color= '#1a1a1a'; }" onBlur="if(this.value == ''){ this.value = 'Enter Your Email Address'; this.style.color= '#818181'; }" />
<input type="submit" name="submit" value="" class="opt_btn" />
</form>
<!-- YOUR AUTORESPONDER CODE END HERE //-->
---------------------------------------- big kisses to anyone who can help me solve this Is outputting --- Creating linked images < a href= "default.htm"> --- as a line of text next to the image, instead of embedding a link in it. Any ideas what's going on? This is the code: <?xml version = "1.0" encoding = "utf-8"?> <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict //EN" "http:// www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> Using image as hyperlink </title> </head> <body> <p> Creating linked images < a href= "default.htm"> <img src = "DSC00123.JPG" width = "92" height = "100" alt = Testing out stuff> </img> </a> </p> </body> </head> </html> Is there code that can detect when your page is being embedded and kill the frame? Some mouses today have horizontal scroll, some call the tilt. It looks something like: http://www.htmlforums.com/attachment...1&d=1242556560 I noticed that many websites they code those horizontal scroll to go to next/prevous page. For example Discuz! forum system has this function. While you browse hundreds or thousands of posts separated into pages, the horizontal scroll can take you to previous page or next page.(not browser back/forward) How do I code like that? Or any examples? sorry im really new at this stuff. so i have the code, and i need to make & view the page.. so how do i do that?? thanks I need to have this text in html. I need only the text, no table. My problem was, that when i changed the fontsize, a new paragraph was created. But i want it on one line. Thanks for your help. Hi my html and css that i have coded is only valid in opera and does not run as it is meant to in firefox and safari. Can anyone help me fix it. The text input box is what is broken. here is the html: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <meta name="author" content="Husain Abdullah Al - Zabir" /> <title>WebSnips</title> <link rel="stylesheet" type="text/css" href="styles/main.css" media="all" /> <link rel="stylesheet" type="text/css" href="styles/rounded_corner.css" media="all" /> <link rel="stylesheet" type="text/css" href="styles/bottom_menu.css" media="all" /> </head> <body> <center> <div class="box"> <b class="tc"> <b class="L1"></b> <b class="L2"></b> <b class="L3"></b> </b> <div class="content"> <div class="box" style="width:100%;"> <b class="tc"> <b class="L1"></b> <b class="L2" style="background-color:#333333;"></b> <b class="L3" style="background-color:#333333;"></b> </b> <div class="content" style="background-color:#333333;"> <div style="width:630px; padding-top:10px;"> <div style="float:left; background-image:url(images/http.jpg); background-position:center; background-repeat:no-repeat; width:95px; height:40px;"> </div> <div style="float:left;"> <input style="height:28px; border:none; font-family:verdana; font-size:21px; color:#7d7d7d; padding-top:6px; padding-bottom:6px;" type="text" size="35" /> </div> <div style="float:left;"> <input type="image" value="submit" src="images/submit-button.jpg" /> </div> </div> <div style="clear:both; height:30px;"> </div> </div> <b class="bc"> <b class="L3"></b> <b class="L2"></b> <b class="L1"></b> </b> </div> </center> </body> </html> here is the css: Code: #logo
{
width: 317px;
height: 40px;
/*background-image: url(../images/logo.gif);*/
background-image: url(../images/logo.jpg);
background-position: center;
background-repeat: no-repeat;
}
#logo-holder
{
padding: 20px;
}
#footer-logo
{
width: 609px;
height: 40px;
/*background-image: url(../images/footer-logo.gif);*/
background-image: url(../images/footer-logo.jpg);
background-position: center;
background-repeat: no-repeat;
}
#footer-logo-holder
{
padding: 5px;
}
#instruction
{
border-left:solid 4px #98CB00;
padding-left:5px;
font-family:verdana;
font-size:17px;
font-weight: normal;
color:white;
text-align:left;
width:623px;
}
#instruction-holder
{
padding-top: 20px;
padding-bottom: 20px;
}
.separator
{
width:10px;
background-image: url(../images/separator.jpg);
background-position: bottom;
background-repeat: no-repeat;
float: left;
height:180px;
}
.urls
{
font-family: verdana;
font-size: 12px;
color: #7d7d7d;
height:180px;
font-weight: bold;
line-height: 20px;
width:203px;
clear:both;
padding-top: 20px;
}
.snips_name
{
font-family: verdana;
font-size: 21px;
color: #FFFFFF;
text-align: left;
}
#top_snips
{
width:31px;
height:38px;
background-image: url(../images/top_snips.jpg);
background-position: top;
background-repeat: no-repeat;
margin-right: 5px;
float: left;
}
#latest_snips
{
width:38px;
height:38px;
background-image: url(../images/latest_snips.jpg);
background-position: center;
background-repeat: no-repeat;
margin-right: 5px;
float: left;
}
#partners
{
width:53px;
height:38px;
background-image: url(../images/partners.jpg);
background-position: top;
background-repeat: no-repeat;
margin-right: 5px;
float: left;
}
Can anyone help fix this? Thanks is there a better way than this (below) to style Script and Code, to look like script and code when written/typed in html? For instance how does the [ HTML ] [ /HTML ] in this forum work? HTML Code: <style type="text/css">
.csslook {
font-family: "Courier New", Courier, monospace;
font-size: 12px;}
.darkpink {color:#990099;}
.green {color:#006600;}
.pink {color:#FF00FF;}
.darkblue {color:#000099;}
.blue {color:#0000FF;}
</style>
<div class="csslook">
<span class="darkpink"><style type=<span class="green">"text/css"</span>></span><br>
<span class="pink">#mainContent {</span><br>
<span class="darkblue">padding</span><span class="pink">:<span class="blue">0px 1px 0px 1px</span>;</span><br>
<span class="darkblue">border-width</span><span class="pink">:<span class="blue">1px 2px 2px 1px</span>;</span><br>
<span class="darkblue">border-style</span><span class="pink">:<span class="blue">solid</span>;</span><br>
<span class="darkblue">background</span><span class="pink">:<span class="blue">#faf6f6</span>;</span><br>
<span class="darkblue">color</span><span class="pink">:<span class="blue">#000</span>;</span><br>
<span class="darkblue">border-color</span><span class="pink">:<span class="blue">#edd #baa #baa #eed</span>;</span><br>
<span class="darkblue">font-family</span><span class="pink">:<span class="blue">Arial, Helvetica, sans-serif</span>;</span><br>
<span class="darkblue">size</span><span class="pink">:<span class="blue">12px</span>;}</span></span><br>
<span class="darkblue"></div></span>
</div>
Hi Newbie question: I want my html file, when accessed directly from the browser, to open a different web-page (which is a php script that calls my html file when it's done). But if my html file was reffered to from that page, it's ok - open it. How can I achieve this? Thanks Joe /sorry for all the mistakes, I'm not a native English speaker/ I know it may sound sill or wierd for some of you but I'm completly new in html and all those things but I have to do a project in information technology - a website about me. I have to split it into two frames. I did sth like this: <frameset> <frame name="A" src="menu.html"> <frame name="B" src="homepage.html"> </frameset> The thing is - it looks really awful. Look: http://tinypic.pl/i/00001/xmbmjwgb6amg.png Can i delete somehow this horrible line between the frames? I would like to put an image as a backgraund and it won't look good if there's a wide grey line splitting it. Help! I have a list of names in say a data base flat file, Do you know if there is a utility that will take and read per line and generate a html file? Hav'nt found anything as of yet but am wondering if someone could steer me in the right direction. thanks Hi all, Is it possible to make iPod application in HTML/XML. If it is possible then how can I make an iPod application using HTML/XML. With Regards, Heej ppl. Ik maked a inlogpage with html with a kinda keylogger in it for testing, after i completed the Html document and opend from my documents the Keylogger works great! but if i am uploading the html code's on Freewebs.com i get this www.freewebs.com/iffsow he say's The Form is unoprational!. I dont understand it, its the same code. but he doesnt work? Maybe you could help me. cheers So i decided the other day to redo my website. I hopped on to Notepad++ and got the home page done. However, when i went to test it, all i got were the top four links. Can anyone spot any errors, or tell me why it isn't working? Thanks <html> <body> <style type="text/css"> b { background-color:black; text-color:green; } p { text-color:red; } </style> <a href="home.htm">Home</a> <a href="blogish.htm>Blogish</a> <a href="links.htm">Links</a> <a href="currentguns.htm>Currunt Guns</a> <br/> <br/> <br/> <br/> <br/> Hello, welcome to my extreamly lame webpage... <br/> <br/> Here i will tell you what guns i currently have, and equiptment for them (hoppers, tanks, tank covers, upgrades, etc.). <br/> I will also have a mini blog were i will post updates after every major event at Hell Survivors Inc. I will also put up my war stories. <br/> <br/> <br/> <br/> <br/> <p> WARNING!!! DO NOT PLAY PAINTBALL, You WILL be addicted immediatly, and won't be able to stop. It will drain your funds, and you will <br/> come home every day bleeding and in pain. <br/> <br/> <br/> In other words, its a good thing pballers are crazy and think that the pain is fun, and can go for weeks without eating so they <br/> can afford there 1200 dollar markers... </p> <br/> <br/> <a href="home.htm">Back to Top</a> </body> </html> I have put this together but I don't know why it doesn't work. the link is: http://www.throughtheconcreterecords...tojournal.html if anyone could take a look at the page source, see what is there and what ISN'T showing up on the actual site and tell me why that would be so nice and awesome! anyone? -kevin throughtheconcrete@hotmail.com Can anyone help me find what I did worong writing this? I cannot not get any output numbers? Its supposed to be a calculator for + - * / HTML Code: <html>
<head>
<title>
COMSC100 Assignment 7 by Jesse Crawford 0887234
</title>
<script>
// copy/paste the following three lines after the script tag in EVERY program
function getInputAsText(_id){return document.getElementById(_id).value}
function getInputAsNumber(_id){return parseFloat(document.getElementById(_id).value)}
function setOutput(_id, _value){document.getElementById(_id).value = _value}
function calculate(code)
{
// declare a variable
var first
var second
var resultAsText
var resultAsNumber
// get variable's value
first = getInputAsNumber("firstBox")
second = getInputAsNumber("secondBox")
// output the value of total
if (code == 0)
{
resultAsNumber = first + second
resultAsText = first + " + " + second + " = " + resultAsNumber
}
if (code == 1)
{
resultAsNumber = first - second
resultAsText = first + " - " + second + " = " + resultAsNumber
}
if (code == 2)
{
resultAsNumber = first * second
resultAsText = first + " * " + second + " = " + resultAsNumber
}
if (code == 3)
{
resultAsNumber = first / second
resultAsText = first + " / " + second + " = " + resultAsNumber
}
// output value
setOutput("resultAsText", result)
}
</script>
</head>
</body>
Instructions:<br>
Type 2 numbers and hit enter.<br>
The total will appear in box below <br>
<br>
Input Values:<br>
First number: <input id="firstBox"><br>
Second number:<input id="secondBox"><br>
<br>
<input type="submit" value="add" onclick="calculate(0)">
<input type="submit" value="subtract" onclick="calculate(1)">
<input type="submit" value="multiply" onclick="calculate(2)">
<input type="submit" value="divide" onclick="calculate(3)"><br>
<br>
Output value: <br>
result: <input id="resultAsText" size="50"><br>
</body>
</html>
|
|||||||