Madhacker's Guide on [HTML] and [Javascript]

madhacker14 · Feb 24, 2009

Introduction.

Alright today were going to discuss a little more on HTML.
You all have been great, and im glad some of you are enjoying my guides on HTML, most are not interested in web programming, or programming in general, but hey thats their problem, not ours.

This is my last guide before I go for an application to the user education, and even if im not accepted, I will create more. Im here to help, thats all that matters, correct?

Today were going to discuss forms for HTML, and alert(popup) boxes for javascript.

All you need to know:

very very basic HTML
a basic understanding of javascript, I introduced it in my last J.S guide.

T.O.C
Introduction(You read above)
Forms
Pop-up!
Take a time to practice.
This is where we part
You can practice either scripting language here at http://www.practiceboard.com

Sorry this may be a shorter guide then expected.
Forms
Did you wonder how sythe has the login syster?
[User name]
[Password]
To tell you the truth, its not to hard!
Its a simple type of form.
Code:
<html>
<body>
<form action="">
Username: 
<input type="text" name="user">
<p>
Password: 
<input type="password" name="password">
</form>
</body>
</html>
Very simple, first we start off with our simple html (<html> <body>)
Form action is equal to ""
Then we have User name, which will be the title for the box.
"Input type is eqal to text (You type it in) and the name =user which you pick, and create.
We then put <p> to have a little indent there, and wethen have the name "Password which will go ontop of the boxes, and then we have input type is equal to password (Password we pre-set by HTML, so it knows that little black dots will take cover of it), and then name="password" is what we put in, and create.
Very simple, this isn't going to save or anything, dont expect it to, this ISN'T A FULL LOGIN SYSTEM!
Its just a simple way to show you how to do this!

Pop-Up!!
Alright, right now were going to focus a tad bit more on Pop-ups.
Annoying, yes, but it may come usefull in the future.
Anyways Im going to show you a larger example, and just explain it all.
Code:
<html>
<head>
<script type="text/javascript">
function click4_alert()
{
alert("Not all of us are bad...");
}
</script>
</head>
<body>

<input type="button" onclick="click4_alert()" value="Click here?" />

</body>
</html>
Easy, we start off with our normal HTML, and we use the command to switch over to javascript. Once there we create a function that says "click4_alert()" this will not come in handy untill the end of this script. Dont forget to use the brackets in this part "{}" and we then define were going to display a type of "Alert" and we type in what its going to say. We then end the script, head, and body, then we do "input type="button" which means we dont be typeing in text in this part, but intstead we need to click a button to display the alert box onlclick will = our function "click4_alert()" which leads us to our alert box, and the value"click here?" is what is said inside the box, that you press on to view the alert.

Lets take a moment to practice.

Alright well lets take a real quick momment to review our studies.
Code:
<html>
<head>
<body>
<p> Hello there! </b>
<b> This is a heading </b>
</head>
</html>
</body>
Point out the mistakes.

Now, i want you all to make a simple page.
Yellow color background, red text, one image.
If you do not know how to do this, I've done it all in my last guide.
Post your source here, and lets see who does the best,
I will give you all a few pointers on them, and such.

Answer to my mistakes.
Real obvious,
I messed up <b> is not a heading <h1-h6> is.
I didn't end the paragraph correctly
I ended HTML, before Head.

I want you all to practice simple alert boxes,
and text feilds that we discussed.
I would also advise you to keep going over
all my guides, and doing all the programming over, and over again.

This is where we part
Sorry to say this is where I end this guide. Next guide im probably going to work on Javascript, along with variables, and putting together a simple page (Nothing to special) so please keep in touch!

Anyways, I hope this helps all the viewers understand each of these a little better, and if not please ask questions, I will help!

Sorry if this guide was a tad bit short, I promis the next will be larger.

Thank you everyone!

Rawr · Feb 24, 2009

Check for spelling / grammatical errors. Other than that much better than your first HTML guide.

One question:
Do you how the form sends the user-input data to the webmaster?
For example... The user inputs the information, and clicks submit. where does it go after that? and how can you send it to the webmaster?

Because I'm working on my own personal website and I'm having issues with it.

Magictreeseed · Feb 24, 2009

thnks for showing the website so i can practice bery intrested in HTML and good luck

Log in or Sign up

Madhacker's Guide on [HTML] and [Javascript]

madhacker14 Guru

Rawr Addict.

Magictreeseed Forum Addict

Log in or Sign up

Madhacker's Guide on [HTML] and [Javascript]

Thread Tools

madhacker14 Guru

Rawr Addict.

Magictreeseed Forum Addict