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.
* 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
0 Responses So Far: