Sliding Dropdown Menu
1. Copy the code below before <style type=”text/css”>
<script src="http://static.tumblr.com/me5sfsd/1YFl414t0/jquery142.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('li.drawer div:nth-child(2)').hide();
$('li.drawer h4').click(function () {
if ($(this).hasClass('open')) {
$('li.drawer div:visible:nth-child(2)').slideUp().prev().removeClass('open');}
else {
$('li.drawer div:visible:nth-child(2)').slideUp().prev().removeClass('open');
$(this).next().slideDown();
$(this).addClass('open');}
});
});
</script>
2. Copy and paste the code below before </style>
ul#drawers {width: 100px; list-style: none; margin: 0 auto; padding: 0px; border-top: 0px; color: #000;}
ul#drawers a {text-decoration: none; color: #000;}
ul#drawers li h4 {margin: 0; padding: 0px; text-transform: Camelcase; font-size: 10px; text-align: center; background-color: #363835; background: rgba(255, 255, 255, 0.0); -webkit-transition: background-color 0.2s ease-out; -moz-transition: background-color 0.2s ease-out;
transition: background-color 0.2s ease-out;}
h4.small {display: table-cell; width: 100px; margin: 0px; height: 100%;}
li.drawer h4.open {background-color: ; border-top: 0px;}
li.drawer div {padding: 0px; margin: 0px; line-height: 10px; background-color: #363835; background: rgba(255, 255, 255, 0.0);}
li.drawer div li {list-style-type: disc;}
li.drawer div ul {-webkit-padding-start: 12px;}
3. Then add this code in your description. Replace “Title / Image URL” with title or image you want to click on for the menu to slide. Replace “LINK HERE” with the link you want, “TEXT HERE” with the title of the link.
<ul > <li class="drawer" > <h4>Title / Image URL</h4> <div align="center"> <p> <a href="LINK HERE">TEXT HERE</a> <p> <a href="LINK HERE">TEXT HERE</a> <p> <a href="LINK HERE">TEXT HERE</a> </p> </div> </li> </ul>
**add this if you want use an image:
<img src="IMAGE URL"></a>
example:
<h4><img src="http://bloggingmage.fileave.com/cerealguy.PNG"></a></h4>
Done! Good Luck :)
Source: academyoftumblr
744 Notes/ Hide
-
allmonchele likes this
-
ethiopiankardashian likes this
-
guts-desu likes this
-
moshinginwonderland likes this
-
babydoll-desu likes this
-
kaye-langankita likes this
-
ipagem likes this
-
higherandhaya likes this
-
cielinexile likes this
-
reminiscent-revelations likes this
-
nosta1gic likes this
-
innsurgent likes this
-
unitedkingdomhereicome likes this
-
martebeisland likes this
-
jadeamaya likes this
-
heavenly-garden likes this
-
aboutapoisonapple likes this
-
icytree likes this
-
trovbled likes this
-
e-nnieh likes this
-
ak47flyflyfly likes this
-
nodogsinthecar likes this
-
aabby likes this
-
janeru likes this
-
dramarch-tic likes this
-
glamluxe-gala likes this
-
innertrust likes this
-
sombrasilenciosa likes this
-
naturalitos likes this
-
pilyangkagit likes this
-
youreflectionisablur likes this
-
ddaehyun likes this
-
zeloid likes this
-
rabb-t likes this
-
sending-good-vibes likes this
-
souldesu likes this
-
alohamermaids likes this
-
semprrra likes this
-
corysgleekgirl likes this
-
toby-etc likes this
-
imperfectlyperfectklarie likes this
-
larryscage likes this
-
so-damn-gorgeous likes this
-
dev1l-ish likes this
-
saloooooma likes this
-
alessoneverl3arned likes this
-
s-c-h-i-z-o-p-h-r-e-n-i-a-a likes this
-
sadyangmatalino likes this
-
woojiiseok likes this
- Show more notes
