Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <script src="http://code.jquery.com/jquery-1.10.0.min.js">
- </script>
- <script>
- $(document).ready(function(){
- $(".one").click(function(){
- $(".1").toggle();
- $(".2,.3,.4,.5,.6").hide();
- });
- $(".two").click(function(){
- $(".2").toggle();
- $(".1,.3,.4,.5,.6").hide();
- });
- $(".three").click(function(){
- $(".3").toggle();
- $(".1,.2,.4,.5,.6").hide();
- });
- $(".four").click(function(){
- $(".4").toggle();
- $(".1,.2,.3,.5,.6").hide();
- });
- $(".five").click(function(){
- $(".5").toggle();
- $(".1,.2,.3,.4,.6").hide();
- });
- $(".six").click(function(){
- $(".6").toggle();
- $(".1,.2,.3,.4,.5").hide();
- });
- });
- </script>
- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
- <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
- <script>
- (function($){
- $(document).ready(function(){
- $("a[title]").style_my_tooltips({
- tip_follows_cursor:true,
- tip_delay_time:30,
- tip_fade_speed:300,
- attribute:"title"
- });
- });
- })(jQuery);
- </script>
- <head>
- <title>TITLE OF BLOG</title>
- <link rel="shortcut icon" href="{Favicon}" />
- <link rel="alternate" type="application/rss+xml" href="{RSS}" />
- <link href='http://fonts.googleapis.com/css?family=Playfair+Display:400,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
- <style type="text/css">
- .1, .2, .3, .4, .5, .6 {display:none;}
- body {
- font-family:arial;
- font-size:9px;
- color:#777;
- background:#fff;}
- #s-m-t-tooltip{
- position:absolute;
- margin-top: 15px;
- letter-spacing:1px;
- z-index:9999;
- background:white;
- color:#aaa;
- font-family:Consolas;
- font-weight:lighter;
- font-size:8px;
- letter-spacing:2px;
- text-transform:uppercase;
- padding:2px 3px 2px 3px;
- -webkit-transition:all 0.3s;
- -moz-transition:all 0.3s;
- -ms-transition:all 0.3s;
- -o-transition:all 0.3s;
- transition:all 0.3s;}
- ul {list-style:square; margin-left:-25px;}
- a:link, a, a:active, a:visited {
- text-decoration: none;
- color: #b8b8b8;
- -moz-transition: 0.3s ease-in;
- -webkit-transition: 0.3s ease-in;
- -o-transition: 0.3s ease-in;
- transition: 0.3s ease-in;}
- a:hover {
- color: #707070;}
- #center {
- position:relative;
- width:500px;
- margin:160px auto;}
- #content {
- position:fixed;
- width:502px;
- height:250px;
- overflow:scroll;
- padding:40px;
- border:1px solid #ddd;
- box-shadow:rgba(0,0,0,0.08) 7px 7px;
- background:#fff;}
- #header {
- position:relative;
- margin:0px;
- width:562px;
- padding:10px;
- color:#a8a8a8;
- background:#f5f5f5;
- text-align:center;
- font-family:Consolas;
- font-weight:lighter;
- font-size:8px;
- letter-spacing:2px;
- text-transform:uppercase;
- border-top:1px solid #ddd;
- border-left:1px solid #ddd;
- border-right:1px solid #ddd;}
- #header a {padding:5px 10px;color:#a8a8a8;}
- #header a:hover {color: #fa5992;} /* change color */
- h1 {
- margin:0%;
- padding:10px;
- font-size:45px;
- height:220px;
- line-height:200px;
- text-align:center;
- font-weight:lighter;
- color: #fa5992;
- text-transform:uppercase;
- letter-spacing:-3px;
- font-family:Consolas;}
- h2 {
- margin:0px;
- padding:5px 0px;
- font-size:10px;
- font-style:italic;
- font-family:Helvetica;
- }
- /* about section */
- #aboutimage {width 120px;}
- #aboutimage img {
- width:120px;
- padding:2px;
- margin-left:15px;}
- #info {
- width:320px;
- height:120px;
- margin-top:-122px;
- margin-left:155px;
- color:#888;}
- #section {
- width:320px;
- border-bottom:1px solid #ddd;
- padding:3px;}
- #description {
- text-align:center;
- font-family: consolas;
- margin-top:15px;
- margin-left:15px;
- font-size:9px;
- position:fixed;
- text-transform:none;
- color:#888;
- }
- /*questions section */
- #qsection {
- margin-top:-30px;
- -webkit-column-count: 2;
- -moz-column-count: 2;
- column-count: 2; }
- #question {
- margin-top:2px;
- float: left;
- width: 200px; }
- #q {font-weight: bold;}
- #answer{
- margin-top:0px;
- margin-left: 1px;
- border-top: 2px solid #e8e8e8;
- padding: 2px 8px; }
- /* Tags */
- h3{
- height:10px;
- line-height:10px;
- margin:0px;
- font-size:9px;
- font-weight:400;
- color:#222;
- text-transform:uppercase;
- border-bottom:1px solid #ddd;}
- .tags a {display:block;}
- .tags a:hover {color: #fa5992;padding-left:6px;} /* change color */
- .tags {
- padding:5px;
- line-height:150%;
- height:91px;
- overflow-y:scroll;}
- .tagsb {float:left;margin:5px 0px;}
- /*
- if you increase this number it will lessen the number of colums.
- 100% - one column
- 50% two coloums
- 33% three colums
- 25% four colums
- */
- .tagsb {width:25%;}
- #blogroll {overflow:auto;height:200px;opacity:1;}
- #blogroll:hover #box {
- opacity:0.8;
- /* if you adjust the "1" it will make it less/more blurry */
- -webkit-filter: blur(1px);
- -moz-filter: blur(1px);
- -ms-filter: blur(1px);
- -o-filter: blur(1px);
- filter: blur(1px);}
- #blogroll:hover #box:hover {
- opacity:1;
- /* DO NOT CHANGE THIS. */
- -webkit-filter: blur(0px);
- -moz-filter: blur(0px);
- -ms-filter: blur(0px);
- -o-filter: blur(0px);
- filter: blur(0px);}
- #box img{width:100%;}
- #box {
- float:left;
- margin:5px;
- height:29px;
- width:29px;
- transition: 0.5s ease;
- -o-transition: 0.5s ease;
- -moz-transition: 0.5s ease;
- -webkit-transition: 0.5s ease;}
- table{
- margin:auto;
- width:554px;
- background:#fff;
- margin-top: -30px;
- margin-left:-23px;
- font-family: consolas;
- font-size: 10px;
- color: #999;
- letter-spacing: 1px;
- text-align:left;
- border: 1px solid #ddd;
- border-collapse:collapse;}
- td {padding: 3px 6px 3px 6px;border: 1px solid #ddd;}
- th{
- padding:6px;
- background:#f8f8f8;
- border: 1px solid #ddd;
- color:#999;
- font-family: consolas;
- font-size:9px;
- font-weight:400;
- letter-spacing:0.3px;
- text-align:center;
- text-transform:uppercase;}
- li{list-style: square;}
- #fictitle {
- width:270px;
- text-align:center;
- font-size:8px;
- font-family: consolas;
- background: #f9f9f9;
- font-weight:bold;}
- #fictitle a {color: #999;}
- #fictitle a:hover {color:#fa5992;} /* change color */
- #length {
- width:40px;
- text-align:center;
- font-size:8px;}
- #pairing {
- width:40px;
- text-align:center;
- text-transform:uppercase;
- font-size:8px;}
- #rating {
- width:40px;
- text-align:center;
- font-size:8px;}
- #summary {
- width:420px;
- text-align:justify;
- font-family: consolas;
- font-size:8px;}
- /* change the background color of bg color (#fa5992) */
- ::-webkit-scrollbar-thumb:vertical {background-color:#fa5992;height:auto;}
- ::-webkit-scrollbar-thumb:vertical:hover{background-color:#fa5992;}
- ::-webkit-scrollbar-thumb:horizontal{background-color:#eee;height:auto;}
- ::-webkit-scrollbar-thumb:horizontal:hover{background-color:#fff;}
- ::-webkit-scrollbar{width:1px;}
- ::selection {background-color:#fa5992;color:#ffffff;} /* bg color */
- ::-moz-selection {background-color:#fa5992;color:#ffffff;} /* bg color */
- </style>
- </head>
- <body>
- <div id="center">
- <div id="header">
- <a class="one" href="#">start</a> ·
- <a class="two" href="#">about</a> ·
- <a class="three" href="#">links</a> ·
- <a class="four" href="#">faq</a> ·
- <a class="five" href="#">blogroll</a>
- <a class="six" href="#">fic rec</a>
- </div>
- <!-- MAIN PAGE STARTS HERE -->
- <div class="1">
- <div id="content">
- <h1>all in one page</h1>
- </div></div>
- <!-- MAIN PAGE ENDS HERE -->
- <!-- ABOUT ME PAGE STARTS HERE -->
- <div class="2" style="display:none;">
- <div id="content">
- <div id="aboutimage"><img src="http://i.imgur.com/30B9Rrt.png"></div>
- <div id="info">
- <div id="section"><i>NAME:</i></div>
- <div id="section"><i>LOCATION:</i></div>
- <div id="section"><i>AGE:</i></div>
- <div id="section"><i>FANDOMS:</i></div>
- <div id="section"><i>MUSIC:</i></div>
- <div id="section"><i>HOBBIES:</i></div>
- <div id="section"><i>ADDITIONAL CATEGORY:</i></div>
- </div>
- <div id="description">
- <div style="overflow:auto; width:500px; height:120px; text-align: left;">
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et enim laoreet, luctus mauris a, gravida orci. Suspendisse quis nulla et turpis faucibus ultrices quis at purus. Cras eros justo, eleifend sit amet turpis eu, auctor dignissim arcu. Quisque sit amet fringilla lacus. Donec vel euismod augue. Mauris eget orci bibendum, viverra nisl sed, vehicula odio. Ut adipiscing ut orci eu euismod. Pellentesque consectetur facilisis risus, vitae pretium nunc egestas quis. Duis lobortis a quam in posuere. Phasellus gravida, arcu in consequat dictum, velit orci egestas nunc, sed consequat nulla lacus nec quam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Phasellus rhoncus sem in commodo tristique. Suspendisse in lorem hendrerit, tempus neque at, adipiscing est. Vivamus feugiat, mauris in laoreet semper, magna neque egestas quam, id sagittis libero dui sit amet ligula. Morbi a scelerisque enim, at commodo lectus.<br>
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et enim laoreet, luctus mauris a, gravida orci. Suspendisse quis nulla et turpis faucibus ultrices quis at purus. Cras eros justo, eleifend sit amet turpis eu, auctor dignissim arcu. Quisque sit amet fringilla lacus. Donec vel euismod augue. Mauris eget orci bibendum, viverra nisl sed, vehicula odio. Ut adipiscing ut orci eu euismod. Pellentesque consectetur facilisis risus, vitae pretium nunc egestas quis. Duis lobortis a quam in posuere. Phasellus gravida, arcu in consequat dictum, velit orci egestas nunc, sed consequat nulla lacus nec quam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Phasellus rhoncus sem in commodo tristique. Suspendisse in lorem hendrerit, tempus neque at, adipiscing est. Vivamus feugiat, mauris in laoreet semper, magna neque egestas quam, id sagittis libero dui sit amet ligula. Morbi a scelerisque enim, at commodo lectus.
- </div>
- </div>
- </div></div>
- <!-- ABOUT ME PAGE ENDS HERE -->
- <div class="3" style="display:none;">
- <div id="content">
- <div class="tagsb">
- <h3>Category Name</h3>
- <div class="tags">
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- </div>
- </div>
- <div class="tagsb">
- <h3>Category Name</h3>
- <div class="tags">
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- </div>
- </div>
- <div class="tagsb">
- <h3>Category Name</h3>
- <div class="tags">
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- </div>
- </div>
- <div class="tagsb">
- <h3>Category Name</h3>
- <div class="tags">
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- </div>
- </div>
- <div class="tagsb">
- <h3>Category Name</h3>
- <div class="tags">
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- </div>
- </div>
- <div class="tagsb">
- <h3>Category Name</h3>
- <div class="tags">
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- </div>
- </div>
- <div class="tagsb">
- <h3>Category Name</h3>
- <div class="tags">
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- </div>
- </div>
- <div class="tagsb">
- <h3>Category Name</h3>
- <div class="tags">
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- <a href="/tagged/tag-link">Tag Name</a>
- </div>
- </div>
- </div>
- </div>
- <div class="4" style="display:none;">
- <div id="content">
- <div id = "qsection">
- <!-- QUESTION # 1 -->
- <div id = "question">
- <div id = "q">radda radda radda radda?</div>
- <div id = "answer">sure thang, chick wang. </div>
- </div>
- <!-- QUESTION # 2 -->
- <br>
- <div id = "question">
- <div id = "q">derp derp derp derp derrrrp?</div>
- <div id = "answer">alright, then. this is an answer to your question, you see how this works? you must keep this long enough to keep your answer's and questions together. or it will look really ugly, and you don't want that, now do ya? </div>
- </div>
- <!-- QUESTION # 3 -->
- <br>
- <div id = "question">
- <div id = "q">radda radda radda radda?</div>
- <div id = "answer">sure thang, chick wang. </div>
- </div>
- <!-- QUESTION # 4 -->
- <br>
- <div id = "question">
- <div id = "q">WHAT THE FUCK DO YOU WANT FOR BREAKFAST?</div>
- <div id = "answer">alright, then. this is an answer to your question, you see how this works? you must keep this long enough to keep your answer's and questions together. or it will look really ugly, and you don't want that, now do ya? </div>
- </div>
- <!-- if you want to add more question and answer sections, copy and paste this below you question four.
- <br>
- <div id = "question">
- <div id = "q">question tho</div>
- <div id = "answer">answer tho</div>
- </div>
- -->
- </div>
- <br>
- <iframe frameborder = "0" height = "190" id = "ask_form" scrolling = "no" src = "http://www.tumblr.com/ask_form/kstester1.tumblr.com" width = "100%"></iframe>
- </div></div>
- <div class="5" style="display:none;">
- <div id="content">
- <div id="blogroll">{block:Following}{block:Followed}<div id="box"><a title="{FollowedName}" href="{FollowedURL}"><img src="{FollowedPortraitURL-40}" align="left"></a></div>{/block:Followed}{/block:Following}</div>
- </div></div>
- <div class="6" style="display:none;">
- <div id="content">
- <!-- if you need to add more use this template.
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- -->
- <table>
- <tr>
- <th>Pairing</th>
- <th>Title</th>
- <th>Length</th>
- <th>Rating</th>
- <th>Summary</th>
- </tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- <tr>
- <td id="pairing">PAIRING</td>
- <td id="fictitle"><a href="LINK"> TITLE</a></td>
- <td id="length">LENGTH</td>
- <td id="rating">RATING</td>
- <td id="summary">SUMMARY
- </td>
- <tr>
- </table>
- </div></div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment