Hacking and more...
HaCkinG CulT
|
Lista Forumurilor Pe Tematici
|
Hacking and more... | Reguli | Inregistrare | Login
POZE HACKING AND MORE...
Nu sunteti logat.
|
Nou pe simpatie:
Larina23 pe Simpatie.ro
 | Femeie
23 ani
Timis
cauta Barbat
28 - 80 ani |
|
gaby_dylyu
Old School Member
 Inregistrat: acum 18 ani
Postari: 422
|
|
HTML Menu
With this tutorial, you can create a simple, nice looking menu complete with rollever effects.
Sponsors - Spoono Host
It seems like recently, simple sites are coming more into style. Heavy graphic and flash are out, slick design and coding skill is in.
To start off, you need to just make a basic table with a cell for each menu item. Something like this will do:
<table width="100" border="0" cellpadding="0" cellspacing="1" bgcolor="#000000">
<tr>
<td bgcolor="#FFFFFF">Home</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">Images</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">Help</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">Contact</td>
</tr>
</table>
There. Now we have a simple table that will contain our links. The next step is to build in the mouse over effects. We are gonna put code into each TD tag, telling the browser how to act with the mouse interaction.
<td bgcolor="#FFFFFF" onMouseOver="this.style.background ='#E8E8E8'"
onMouseOut="this.style.background='#FFFFFF'">Home</td>
That makes the first cell of the table act differently. Eventually, you'll give this treatment to every cell, but for now, just work on one. What that chunk of code does is make the cell change background color with touched by the mouse cursor. When the mouse leaves, the color goes back to what it was. Now we need to make it a link. This is done by adding another little snippet
<td bgcolor="#FFFFFF" onMouseOver="this.style.background ='#E8E8E8'; this.style.cursor = 'hand'"
onMouseOut="this.style.background='#F7F7F7'" onClick="parent.location='index.php'">Home</td>
Now we added two things here. First, the location where the browser will go when the cell is clicked. Second, we added a command to change the mouse pointer to a hand, the common symbol for a link. The table should now look like this:
<table width="100" border="0" cellpadding="0" cellspacing="1" bgcolor="#000000">
<tr>
<td bgcolor="#FFFFFF" onMouseOut="this.style.background='#F7F7F7'"
onClick="parent.location='index.php'" onMouseOver="this.style.background ='#E8E8E8';
this.style.cursor = 'hand'" >Home</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">Images</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">Help</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">Contact</td>
</tr>
</table>
Now that the top cell works fine, go down and repeat the process for all remaining cells. The complete code for this table should look like this:
<table width="100" border="0" cellpadding="0" cellspacing="1" bgcolor="#000000">
<tr>
<td bgcolor="#FFFFFF" onMouseOut="this.style.background='#F7F7F7'"
onClick="parent.location='index.php'" onMouseOver="this.style.background ='#E8E8E8';
this.style.cursor = 'hand'">Home</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" onMouseOut="this.style.background='#F7F7F7'"
onClick="parent.location='images.php'" onMouseOver="this.style.background ='#E8E8E8';
this.style.cursor = 'hand'">Images</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" onMouseOut="this.style.background='#F7F7F7'"
onClick="parent.location='help.php'" onMouseOver="this.style.background ='#E8E8E8';
this.style.cursor = 'hand'">Help</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" onMouseOut="this.style.background='#F7F7F7'"
onClick="parent.location='contact.php'" onMouseOver="this.style.background ='#E8E8E8';
this.style.cursor = 'hand'">Contact</td>
</tr>
</table>
This is it
Modificat de gaby_dylyu (acum 18 ani)
_______________________________________
Always Expect The Unexpected!!!
|
|
| pus acum 18 ani |
|
|
joshua
Senior
Inregistrat: acum 18 ani
Postari: 120
|
|
crezi ca mai sta cineva sa scrie ditamai codu?de ex cu Dreamwaver trebuie sa ai doar idei, nu si cunostinte aprofundate in html.
|
|
| pus acum 18 ani |
|
gaby_dylyu
Old School Member
Inregistrat: acum 18 ani
Postari: 422
|
|
nici eu nu am sooper cunostinte ... dar imi pl;ace sa vad cum lucreaza...+ un copy paste nu strica 
_______________________________________
Always Expect The Unexpected!!!
|
|
| pus acum 18 ani |
|