Hello Techyv,
I am in need of DHTML coding on horizontal expanding navigation bar, Please do the needful for providing a simple coding along with notes for understanding, so that I can customize it further. If any tutorial on this regard, that will also help, Please do the needful.
Thanks and Regards,
Kyle M Arteaga
Hello to get DHTML coding on horizontal expanding navigating bar follow these steps:
1. First of all open your Notepad or text editor.
2. Then copy and paste the following code into your Notepad or into text editor.
<!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>
<title>Horizontal Navigation Bar w/Rollover Effect</title>
<style type="text/css">
<!–
#navbar ul {
margin: 0;
padding: 5px;
list-style-type: none;
text-align: center;
background-color: #000;
}
#navbar ul li {
display: inline;
}
#navbar ul li a {
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #000;
}
#navbar ul li a:hover {
color: #000;
background-color: #fff;
}
–>
</style>
</head>
<body>
<div id="navbar">
<ul>
<li><a href="#">LinkHere</a></li>
<li><a href="#">LinkHere</a></li>
<li><a href="#">LinkHere</a></li>
<li><a href="#">LinkHere</a></li>
<li><a href="#">LinkHere</a></li>
</ul>
</div>
</body>
</html>
3. Now click File >> Save as..
In Notepad, change “Save as” as type “All Files” and give your file name with the extension .html and save it.
4. And open the new .html file in your Brower and see how it looks.
Also you can visit this site, from where you can get more code as well instructions on how you customize it.
