Main » Articles » Web tutorijali » Navigacija
Apycom menu tutorijal
Potrebno je da sa ovog sajta izaberete meni i skinete ga: http://apycom.com/

zatim u file manageru ubacite sve fajlove iz RAR foldera koji ste skinuli:napravite images folder i u njega uploadujete sve fajlove iz rar foldera images,za ostale fajlove ne morate da pravite nikakav folder!

ona ubacite sledece izmedju <head> i </head>

Quote
<link type="text/css" href="LINK VASEG  menu.css" rel="stylesheet" />
<script type="text/javascript" src="LINK VASEG jquery.js"></script>
<script type="text/javascript" src="LINK VASEG menu.js"></script>


zatim nadjete u file manager "index.html" koji ste prethodno uploadovali i kliknete na onaj kljucic da ga editujete
nadjete sledece tamo:
Quote

<link type="text/css" href="LINK VASEG/ menu.css" rel="stylesheet" />
<script type="text/javascript" src="LINK VASEG/ jquery.js"></script>
<script type="text/javascript" src="LINK VASEG/ menu.js"></script>


zatim ubacite sledece izmedju <body> i </body>

Quote
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>Style 01 (Black) - Menu by Apycom.com</title>
<link type="text/css" href="LINK VASEG/menu.css" rel="stylesheet" />
<script type="text/javascript" src="LINK VASEG /jquery.js"></script>
<script type="text/javascript" src="LINK VASEG /menu.js"></script>
</head>
<body>

<style type="text/css">
* { margin:0;
padding:0;
}
body { background:rgb(74,81,85); }
div#menu { margin:5px auto; }
div#copyright {
font:11px 'Trebuchet MS';
color:#222;
text-indent:30px;
padding:40px 0 0 0;
}
div#copyright a { color:#000; }
div#copyright a:hover { color:#222; }
</style>

<div id="menu">
<ul class="menu">
<li><a href="#" class="parent"><span>Home</span></a>
<ul>
<li><a href="#" class="parent"><span>Sub Item 1</span></a>
<ul>
<li><a href="#" class="parent"><span>Sub Item 1.1</span></a>
<ul>
<li><a href="#"><span>Sub Item 1.1.1</span></a></li>
<li><a href="#"><span>Sub Item 1.1.2</span></a></li>
</ul>
</li>
<li><a href="#"><span>Sub Item 1.2</span></a></li>
<li><a href="#"><span>Sub Item 1.3</span></a></li>
<li><a href="#"><span>Sub Item 1.4</span></a></li>
<li><a href="#"><span>Sub Item 1.5</span></a></li>
<li><a href="#"><span>Sub Item 1.6</span></a></li>
<li><a href="#" class="parent"><span>Sub Item 1.7</span></a>
<ul>
<li><a href="#"><span>Sub Item 1.7.1</span></a></li>
<li><a href="#"><span>Sub Item 1.7.2</span></a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#"><span>Sub Item 2</span></a></li>
<li><a href="#"><span>Sub Item 3</span></a></li>
</ul>
</li>
<li><a href="#" class="parent"><span>Product Info</span></a>
<ul>
<li><a href="#" class="parent"><span>Sub Item 1</span></a>
<ul>
<li><a href="#"><span>Sub Item 1.1</span></a></li>
<li><a href="#"><span>Sub Item 1.2</span></a></li>
</ul>
</li>
<li><a href="#" class="parent"><span>Sub Item 2</span></a>
<ul>
<li><a href="#"><span>Sub Item 2.1</span></a></li>
<li><a href="#"><span>Sub Item 2.2</span></a></li>
</ul>
</li>
<li><a href="#"><span>Sub Item 3</span></a></li>
<li><a href="#"><span>Sub Item 4</span></a></li>
<li><a href="#"><span>Sub Item 5</span></a></li>
<li><a href="#"><span>Sub Item 6</span></a></li>
<li><a href="#"><span>Sub Item 7</span></a></li>
</ul>
</li>
<li><a href="#"><span>Help</span></a></li>
<li class="last"><a href="#"><span>Contacts</span></a></li>
</ul>

</div>
</body>
</html>


Naravno prethodni kod mozete menjati kako vi zelite,dodavati sta vam treba i slicno!
Category: Navigacija | Added by: Vladar (25.May.2011)
Views: 772 | Tags: vertikalni meni, apycom meni, horizontalni meni | Rating: 5.0/1
Total comments: 0
Only registered users can add comments.
[ Sign Up | Login ]