December 23rd 2009
0
Read 841 times
Bookmark & Share
[del.icio.us] [Digg] [Facebook] [Fark] [Google] [Reddit] [StumbleUpon] [Technorati] [Twitter] [Windows Live] [Yahoo!] [Email] More »

Amazing Photoshop Tab Designs for Web & Applications

December 23rd, 2009Read 841 times
Amazing Photoshop Tab Designs for Web and Applications

Amazing Photoshop Tab Designs for Web and Applications

Pixlys has comes with a lot of Photoshop designs for Tab Menus. Available styles are Pinned Active Tab, Semi Flat Gradient Dropdown Menu, Rounded Gradient Dropline Tabs, Soft Gradient Dropdown Menu, Glossy Vista Style Dropdown Menus, Glossy Dropdown Menu with 3d Paper Effect etc… All of the tab designs are free for personal use. Can be used with your website, blog or applications. You should register for the free download.

website url

Tags: , , , ,
Posted in CSS Tab Menu, photoshop |

November 6th 2009
0
Read 1123 times
Bookmark & Share
[del.icio.us] [Digg] [Facebook] [Fark] [Google] [Reddit] [StumbleUpon] [Technorati] [Twitter] [Windows Live] [Yahoo!] [Email] More »

How to Build Mega Drop Down Menus with CSS & JQuery

November 6th, 2009Read 1123 times
Mega Drop Down Menus

Mega Drop Down Menus

Do you remember I have published a post of CSS Tab-Based Navigation Scripts? Some JQuery menus are. Here Im posting about a new drop down menu more efficient for large scale websites. The solution has come up from SohTanaka – Mega Drop Down Menus. According to usability expert Jakob Nielson, mega drop down menus tested to be more efficient for large scale websites.

Demo

Tags: , , , , , , , ,
Posted in CSS, CSS Tab Menu, Javascript, Tools |

January 7th 2009
0
Read 1145 times
Bookmark & Share
[del.icio.us] [Digg] [Facebook] [Fark] [Google] [Reddit] [StumbleUpon] [Technorati] [Twitter] [Windows Live] [Yahoo!] [Email] More »

How to build a Previous and Next buttons with List and Css scripts.

January 7th, 2009Read 1145 times

Here I’m explaining how to build a previous and next buttons with list and css scripts. Please follow the steps mentioned below.

1) We need a container div. So write a div tag first and give an ID for it. I gave for my div “prevNextContainer”.
2) Write the previous and next lists inside the container div. Give an ID “prev” for previous list and “next” for next list.
<div id="prevNextContainer">
   <li id="prev"><a href="#">Previous<a/></li>
   <li id="prev"><a href="#">Next<a/></li>
</div>
3) Add some styles to the container div.
<style>
#prevNextContainer{
   padding:0px;
   font-family:Tahoma;
   font-size:11px;
   border-bottom:3px solid #dadada;
   height:35px;
}
</style>4) Set margin and padding to zero for ul and li tags.

#prevNextContainer ul, #prevNextContainer li{
   padding:0px;
   margin:0px;
}

5) Now we need to push previous list to left, next list to right and remove the list style. Set float to left for previous list and float to right for next list. Set the list-style-type to none for both.

#prevNextContainer #prev{
   float:left;
   list-style-type:none;
}
#prevNextContainer #next{
   float:right;
   list-style-type:none;
}

6) Now we are going to makeup the buttons. Give some style to the both anchors tags.

#prev a{
   text-decoration:none;
   border:1px solid #cacaca;
   padding:5px 7px;
   width:100px;
   display:block;
   text-align:center;
}
#prev a:hover{
   background:#dadada;
   border:1px solid #aaaaaa;
   color:black;
}
#next a{
   text-decoration:none;
   border:1px solid #cacaca;
   padding:5px 7px;
   width:100px;
   display:block;
   text-align:center;
}
#next a:hover{
   background:#dadada;
   border:1px solid #aaaaaa;
   color:black;
}

7) See the sample below.

Thats it…. Enjoy.

Tags: , , , ,
Posted in CSS, CSS Tab Menu, Graphics, Technology, Tutorial |

November 27th 2008
3
Read 572 times
Bookmark & Share
[del.icio.us] [Digg] [Facebook] [Fark] [Google] [Reddit] [StumbleUpon] [Technorati] [Twitter] [Windows Live] [Yahoo!] [Email] More »

CSS Tab-Based Navigation Scripts

November 27th, 2008Read 572 times

Css Tab Menu

Css Tab Menus

Tab navigation has been one of the most important element in web layouts. Visitors can properly navigate through the website with a tabbed navigation. A tab navigation should help visitors to easily understand where they should be clicking. Here I have compiled a mass list of nice and sleek CSS Tab based navigation samples you can integrate on your site.

 

Related Posts with Thumbnails

Tags: , , , , ,
Posted in CSS, CSS Tab Menu, Graphics |