Archive for January, 2012

Change htdocs directory XAMPP on Windows

untuk merubah htdocs directory XAMPP web server pada windows, berikut langkah2 nya:

1. masuk ke Windows C:\xampp\xampp\apache\conf\httpd.conf
2. Edit pada baris  “DocumentRoot”. secara default berada di C:/xampp/xampp/htdocs
3. Ubah misal ke D:\WEB
4. Edit juga baris “Directory” ke path yg sama.
5. Save and restart Xampp service, selesai

Leave a comment

CSS Drop Down Menu with list

CSS code:

#menu ul {list-style:none; padding:0; margin:0; position:absolute; z-index:2}
#menu li {float: left;}
#menu ul ul{visibility:hidden; width:125px;} /*menyembunyikan sub menu saat non mouse over */
#menu ul li:hover ul{visibility:visible} /*menampilkan sub menu saat non mouse over */
#menu li a{background-color:#252525; height:35px; width:125px; display:block; color:#b4b4b4; font-family:Tahoma, Geneva, sans-serif;
text-decoration:none; font-size:13px; line-height:30px;  text-align:center;}
#menu li a:hover{background:#414141; color:#ffffff}

HTML code:

</pre>
<div id="menu">
<ul>
	<li><a href="URL 1">TYPE</a>
<ul>
	<li><a href="#">Sub menu 1</a></li>
	<li><a href="#">Sub menu 2</a></li>
	<li><a href="#">Sub menu 3</a></li>
</ul>
</li>
	<li><a href="#">COUNTRY</a></li>
	<li><a href="#">MAKER</a></li>
	<li><a href="#">VINTAGE</a></li>
	<li><a href="#">PRICE RANGE</a></li>
</ul>
</div>
<pre>

Leave a comment

css navigation menu

this is just a bit example for making menu navigation with ccs:

css:

a.menu_nav{
width: 106px; /*this is important */
height: 40px; /*this is important */
background-image:url(images/nav_bg.jpg); /*this is important */
float:left;
border: 0px;
display: block;
text-decoration: none;
text-align:center;
}
a.menu_nav:link {font-size:13px; line-height:35px; color:#656565}
a.menu_nav:visited {font-size:13px; line-height:35px; color:#656565}
a.menu_nav:hover {background-position: 0-40px;}

a.menu:hover {
background-position: 0-40px; /*this is important */
}

html:

<div>
  <a href="#" class="menu_nav">Home</a>
  <a href="#" class="menu_nav">About US</a>
  <a href="#" class="menu_nav">Product</a>
  <a href="#" class="menu_nav">News Update</a>
  <a href="#" class="menu_nav">Contact Us</a>
</div>

Leave a comment

Design a site like this with WordPress.com
Get started