Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- ✧ * ☾ destinatiia.tumblr.com * ✧
- you know the drill . don't Move the credit or put it in another page . just don't . don't take fragments from this code and paste it on your own, even if you credit me. it's a no. and yeah just that enjoy !
- -----
- 1. COPY THE FOLLOWING CODE AND PASTE IT BEFORE </head>
- -----
- <script type="text/javascript">
- jQuery(document).ready(function() {
- jQuery(".dd").hide();
- //toggle the componenet with class msg_body
- jQuery(".yeahso").click(function()
- {
- jQuery(this).next(".dd").slideToggle(500);
- });});
- function showDiv() {
- $('#townmap').show();
- $('#townlistings').hide();
- }
- function showListings() {
- $('#townlistings').show();
- $('#townmap').hide();
- }
- </script>
- -----
- 2. NOW YOU WANNA WRITE THE NEXT CSS SOMEWHERE AFTER <style type="text/css">
- -----
- .dropdown {
- width:241px;
- z-index:99;
- background-color: #ddd;
- height:auto;
- position:static;
- padding:10px;
- font-family:'montserrat', sans serif;
- font-size:11px;
- text-align:center;
- margin-left:30px;
- margin-top:230px;
- }
- .yeahso {
- font-family:'montserrat', sans serif;
- font-size:16px;
- }
- .dd{
- margin-top:5px;
- line-height:150%;
- letter-spacing:5px;
- }
- .dd a:hover{
- background-color:#aaa;
- opacity:0.5;
- }
- -----
- 3. THE WHOLE STRUCTURE IS DONE ! NOW IT'S TIME TO ADD THE FOLLOWING CODE TO YOUR PAGE, EDIT IT AND YOU'RE DONE !
- -----
- <div style="margin-left: 10px;"><!-- this is the main picture -->
- <p><img src="https://66.media.tumblr.com/edf4c4b95a9256a7c635a8dd5cf1cd7f/tumblr_inline_o8h2y7MYwN1rc4obr_540.png" style="width: 100px; border-radius: 100px;" /></p>
- <div style="margin-left: 120px; margin-top: -100px;"><!-- here's where the user goes -->
- <div style="font-size: 18px; font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue'; height: auto; width: auto;">user <em><strong>!</strong></em></div>
- <!-- name + lil description/quote/wtv ! -->
- <div style="z-index: 99; margin-top: 10px; overflow: auto; font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue'; width: 380px; height: 55px; padding-right: 10px;"><strong>name.</strong> put whatever you want here Tbh it overflows so ! blah blah blah blah blah blah<strong><br /></strong></div>
- </div>
- </div>
- <!-- the other insta pics ! -->
- <div style="margin-left: 10px; margin-top: 30px;"><img src="https://66.media.tumblr.com/27d471ffbf06bc1d68d08a2136df6e36/tumblr_inline_o8j39fUjOj1rc4obr_540.png" style="width: 90px;" /> <img src="https://66.media.tumblr.com/45da6e588149d2f54230852ed2428659/tumblr_inline_o8h89yjTeF1rc4obr_540.png" style="width: 90px;" /> <img src="https://66.media.tumblr.com/96aff1ab2253d9f1784c0eaa6174d247/tumblr_inline_o8j33mQOGy1rc4obr_540.png" style="width: 90px;" /> <img src="https://65.media.tumblr.com/5243985a15ad2caebfc848b9e40b2033/tumblr_inline_o8h2yvW8801rc4obr_540.png" style="width: 90px;" /> <img src="https://67.media.tumblr.com/2b9f58bd40f8177a763a1fdeb569f359/tumblr_inline_o8itf31m671rc4obr_540.png" style="width: 90px;" /></div>
- <!-- another very brief quote ! -->
- <div style="width: auto; padding-bottom: 5px; padding-top: 2px; padding-left: 7px; padding-right: 7px; height: 15px; background: #ddd; margin-top: 20px; text-align: center; overflow: hidden; font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue';">some cute quote !</div>
- <!-- p self explanatory ! -->
- <div style="z-index: -9; margin-left: 10px; width: 340px; padding: 10px; height: 100px; text-align: center; letter-spacing: 1px; overflow: auto; background: #ddd; margin-top: 15px;">muse info here !</div>
- <div style="font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue'; width: 100px; margin-top: -120px; float: right; margin-right: 15px; height: 120px; text-align: right; overflow: hidden; line-height: 130%; font-weight: bold; font-size: 16px;"><!-- these are the links ! --> <a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a></div>
- <!-- another quote + the collapsable info -->
- <div class="dropdown" style="margin-top: 15px; margin-left: auto; background: #ddd; padding-bottom: 5px; padding-top: 2px; padding-left: 7px; padding-right: 7px; border: none; width: auto;"><a class="yeahso" href="#" style="font-size: 7px; text-transform: uppercase; font-family: calibri;">some cute quote here ! <strong><em>(</em></strong> click <strong><em>)</em></strong></a>
- <div class="dd" style="overflow: auto; height: 90px; font-family: calibri; line-height: 130%; font-size: 9px; text-align: center; letter-spacing: 0.7px;">more muse info here !</div>
- </div>
- <div style="float: right; margin-top: 10px; padding-right: 5px; padding-left: 5px; padding-top: 2px; padding-bottom: 2px; background: #ddd;"><a href="http://destinatiia.tumblr.com" title="code by becca">✰</a></div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement