![]() |
This widget charge battery of beauty of your blog, i like this script on one site and try to offer for blog users, if you like this share with friends |
Live Demo Below hover mouse on Icons |
how to Get Stylish Footer menu For Blogspot |
Go To Dashboard »» Layout »» Add Gadget»» Select JaveScript »» In Content Box paste data From below box After Modify |
<style id="page-skin-1" type="text/css"> .majid-container{ float:left; width:150px; height:150px; overflow:hidden; position:relative; border:solid; -webkit-border-radius: 1px 1px 10px 10px; border-radius: 1px 1px 10px 10px; } .majid-container img{ border:2px; -webkit-border-radius: 1px 1px 10px 10px; border-radius: 1px 1px 10px 10px; } .majid-container:hover { float:left; width:150px; height:150px; overflow:hidden; position:relative; border:solid; -webkit-border-radius: 1px 1px 10px 10px; border-radius: 1px 1px 10px 10px; -webkit-box-shadow: inset 0px 0px 10px 5px ; box-shadow: inset 0px 0px 10px 5px ; } .text{ background:rgba(0,0,0,0.5); top:-100px; color:red; font:12px Georgia,serif; height:auto;width:inherit; position:absolute; /* baadshah26gold.com */ -webkit-transition: all .5s ease-out; -moz-transition: all .5s ease-out; -o-transition: all .5s ease-out; transition: all .5s ease-out; } .text a{ color:#fff; display:block; padding:15px; text-decoration:none; /* baadshah26gold.com */ -webkit-transition: all .4s ease-out; -moz-transition: all .4s ease-out; -o-transition: all .5s ease-out; transition: all .4s ease-out; } .text a:hover{ color:red; text-decoration:none; } .majid-container:hover .text{ top:0; } </style> </head> <body> <div class="majid-container" style="width: 150; height: 150"> <p align="center"> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDLF-QsUhINMSwc2GpLuuhFrp4oSyz2h76vVP3Y-g0069Le6XNfS6ZAaFq9fWlsnI01E9i72vsjim8yde2YZ50m1xZrCxQQepPQr9wSe51cXB9Se4sUk8pNu3Zhn0P8sz31ImhZlnObF8/s1600/baadshah26gold3.png" width="130" height="130"> <article class="text"> <h2 align="center"><a href="http://baadshah26gold.com/category/blogger-widgets/"><font color="#FFFF00" size="3" face="Comic Sans MS"><b>Blogger Widgets</b></font></a></h2> </article></div> <div class="majid-container" style="width: 150; height: 150"> <p align="center"> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj99b6XjP6fg3YCzjzdoFujmjo3Z5m9ZMH-yQurF-YeoE1ZW3iRRPU1-izNXptIWZkwxo9t3nyAWOX7orriBX69nGN_tMADrq5tK_mXHX8RHDwjnaRs-nFfYtedqEN44pQN0JYB4ur458M/s1600/baadshah26gold1.png" width="130" height="130"> <article class="text"> <h2 align="center"><a href="http://baadshah26gold.com/category/blogger-widgets/"><font color="#FFFF00" size="3" face="Comic Sans MS"><b>Blogger Widgets</b></font></a></h2> </article></div> <div class="majid-container" style="width: 150; height: 150"> <p align="center"> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDLF-QsUhINMSwc2GpLuuhFrp4oSyz2h76vVP3Y-g0069Le6XNfS6ZAaFq9fWlsnI01E9i72vsjim8yde2YZ50m1xZrCxQQepPQr9wSe51cXB9Se4sUk8pNu3Zhn0P8sz31ImhZlnObF8/s1600/baadshah26gold3.png" width="130" height="130"> <article class="text"> <h2 align="center"><a href="http://baadshah26gold.com/category/blogger-widgets/"><font color="#FFFF00" size="3" face="Comic Sans MS"><b>Blogger Widgets</b></font></a></h2> </article></div> <div class="majid-container" style="width: 150; height: 150"> <p align="center"> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEld5gU4Y18cZhnSXkiJjikcLTL2NvKmoBSMy7b2GgP9RHFCaSXh_QHOcEdd8fhXmD6uke7wr2tdKvuhcfJ8paDzjeNTqD_2VmfxCkP9XXNoNHTwWgJvEjIbyJWrH2SnOsgjnoqOU8inA/s1600/baadshah26gold2.png" width="130" height="130"> <article class="text"> <h2 align="center"><a href="http://baadshah26gold.com/category/blogger-widgets/"><font color="#FFFF00" size="3" face="Comic Sans MS"><b>Blogger Widgets</b></font></a></h2> </article></div> |
Note: Please in above scroolbox i have poit out some text containing links, titles, colour and size, red=links and titles, Pick= colours, and green= zize After modify add to Gadget |
Subscribe to:
Post Comments (Atom)
0 comments Blogger 0 Facebook
Post a Comment