How to add CSS floating menu to blogger. 0

| | ,

How to add CSS floating menu to blogger.











* First go to your blogger Dashboard.

* Now click in DESIGN tab and  Now you are Here--->>>> Page Element

* Click in add Add Gadget which is in your blogger sidebar.

* When open new window chosse HTML/javascript from list.

* Copy below code and paste in blank box.

<style text-type="CSS">

#bloggermenu{

position:fixed;

right:5px;

center:0px;

background-color:#000;

border-radius:10px;

-moz-border-radius:10px;

border:1px solid #FFF;

width:202px;

height:20px;

color:#FF0606;

transition:all .5s ease-in;-moz-transition:all .5s
ease-in;-webkit-transition:all .5s ease-in;-o-transition:all .5s
ease-in;z-index:3;overflow:hidden;padding:9px 15px 10px;}



#bloggermenu h3{

margin:0;

padding:0;

text-align:center;

cursor:pointer;}



#bloggermenu ul{

border-radius:10px;-moz-border-radius:10px;

border:2px solid #FFf;

background-color:#FF0606;

margin:15px 0;

padding:0 15px;}



#bloggermenu li{list-style:none;margin:0 0 5px;padding:0;} #bmenu li a{

color:#000;

text-decoration:none;

font-size:14px;}



#bloggermenu li a:hover{

color:#fff;}



#bloggermenu:hover{

z-index:5;

height:175px;

</style>



<div id="bloggermenu">

<h3>

TITLE</h3>

<ul>

<li><a href="TAB1 URL HERE">TAB1 TITLE HERE</a></li>

<li><a href="TAB2 URL HERE">TAB2 TITLE HERE</a></li>

<li><a href="TAB3 URL HERE">TAB3 TITLE HERE</a></li>

<li><a href="TAB4 URL HERE">TAB4 TITLE HERE</a></li>

<li><a href="TAB5 URL HERE">TAB5 TITLE HERE</a></li>

</ul>

</div>

NOTE:- Remove highlighted text from above code with your own ok

* Now click to save your HTML/javascript and now you are done.

CHEERS

StumpleUpon DiggIt! Del.icio.us Blinklist Yahoo Furl Technorati Simpy Spurl Reddit Google I'm reading: How to add CSS floating menu to blogger. ~ Twitter FaceBook

0 Responses So Far:

Categories

Select Your Categories