API tools faq
paste
Advertisement
hermionemessi

All in One 02

hermionemessi
May 27th, 2015
1,292
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 19.20 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <!--All In One 02 Black Magic by hermionegrangcr (hermionejean.co.vu)
  4.  
  5. THEME BLOG: grangersdesigns (granger.cf)
  6.  
  7.  
  8. ♛ ♛ ♛
  9. ♛♛♛ ♛♛♛ ♛♛♛
  10. ♛ ♛ ♛ ♛ ♛ ♛ ♛ ♛
  11. ♛♛♛ ♥ G♚D ♥ ♛♛♛
  12. ♛ ♛ ♛ ♛ ♛ ♛ ♛ ♛
  13. ♛ ♛ ♛ ♛ ♛ ♛ ♛ © hermionegrangcr (hermionejean.co.vu)
  14.  
  15.  
  16. TERMS OF USE:
  17.  
  18. ♚ BASIC RULES (see http://hermionejean.co.vu/rules) APPLY
  19.  
  20. ♚ PLEASE RESPECT THEM IF USING! ANY FORMS OF THEFTS WILL BE HUNTED DOWN.
  21.  
  22. ♚ PLEASE DO NOT ALTER OR COVER THE CREDIT
  23.  
  24. ♚ FAILURE TO ABIDE TO THE RULES WILL LEAD TO AN IMMEDIATE BLOCK & REPORT & A PERMANENT PLACE ON HTTP://HERMIONEJEAN.CO.VU/WOS
  25.  
  26. NOTE: DO NOT RE-DISTRIBUTE THE SAMPLE PHOTOS IN THIS CODE!
  27.  
  28. THAT'S IT! ENJOY USING MY CODE AND DON'T BE AFRAID TO ASK ME IF YOU ENCOUNTER ANY PROBLEMS c:
  29.  
  30. -->
  31.  
  32.  
  33. <head>
  34. <title>{Title}</title>
  35. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  36. <link rel="shortcut icon" href="{Favicon}"/>
  37.  
  38. <link href='http://fonts.googleapis.com/css?family=Lato:100,300,400,700' rel='stylesheet' type='text/css'>
  39. <link href='http://fonts.googleapis.com/css?family=Raleway:400,100,300,200,500,700' rel='stylesheet' type='text/css'>
  40.  
  41. <link type="text/css" rel="stylesheet" href="http://static.tumblr.com/xbvpdcx/4Smnowhz3/figure.css" />
  42.  
  43.  
  44.  
  45. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  46.  
  47. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  48.  
  49. <!--Tooltip-->
  50.  
  51. <script>
  52.  
  53. (function($){
  54.  
  55. $(document).ready(function(){
  56.  
  57. $("a[title]").style_my_tooltips({
  58.  
  59. tip_follows_cursor:true,
  60.  
  61. tip_delay_time:30,
  62.  
  63. tip_fade_speed:300,
  64.  
  65. attribute:"title"
  66.  
  67. });
  68.  
  69. });
  70.  
  71. })(jQuery);
  72.  
  73. </script>
  74.  
  75.  
  76. <!--Hide and Seek-->
  77. <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js” type=”text/javascript”></script>
  78.  
  79. <script>
  80.  
  81. $(document).ready(function(){
  82.  
  83. $("a.un").click(function(){
  84. $("#t1").fadeIn();
  85. $("#t2").fadeOut();
  86. $("#t3").fadeOut();
  87. $("#t4").fadeOut();
  88.  
  89. });
  90.  
  91. $("a.deux").click(function(){
  92. $("#t1").fadeOut();
  93. $("#t2").fadeIn();
  94. $("#t3").fadeOut();
  95. $("#t4").fadeOut();
  96.  
  97. });
  98.  
  99. $("a.trois").click(function(){
  100. $("#t1").fadeOut();
  101. $("#t2").fadeOut();
  102. $("#t3").fadeIn();
  103. $("#t4").fadeOut();
  104.  
  105. });
  106.  
  107. $("a.quatre").click(function(){
  108. $("#t1").fadeOut();
  109. $("#t2").fadeOut();
  110. $("#t3").fadeOut();
  111. $("#t4").fadeIn();
  112.  
  113. });
  114.  
  115. });
  116.  
  117. </script>
  118.  
  119.  
  120. <style type="text/css">
  121. ::selection {background:#fff; color:#000000;}
  122. ::-moz-selection {background:#fff;color:#000000;}
  123. ::-webkit-selection {background:#fff;color:#000000;}
  124.  
  125.  
  126. ::-webkit-scrollbar {width: 5px; height: 3px; background: #FFFFFF; }
  127.  
  128. ::-webkit-scrollbar-thumb { background-color: #000; }
  129.  
  130. *, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
  131. .clearfix:before, .clearfix:after { display: table; content: ''; }
  132. .clearfix:after { clear: both; }
  133.  
  134.  
  135. /*Tooltip*/
  136. #s-m-t-tooltip{
  137. position:absolute;
  138. margin-top: 10px;
  139. z-index:9999999999;
  140. padding:5px;
  141. color:#fff;
  142. background:#000000;
  143. font-size:12px;
  144.  
  145. }
  146.  
  147. body {
  148. font-family:'Lato',Arial, sans-serif;
  149. font-weight:400;
  150. font-size:12px;
  151. letter-spacing:1.5px;
  152. background:#fff;
  153. overflow-x:hidden;
  154.  
  155. }
  156.  
  157. a {
  158. text-decoration: none;
  159. color: #cdcdcd;
  160. }
  161.  
  162. a:hover {
  163. color: #fafafa;
  164. transition: all 0.3s ease-in-out;
  165. -webkit-transition: all 0.3s ease-in-out;
  166. -moz-transition: all 0.3s ease-in-out;
  167. -o-transition: all 0.3s ease-in-out;
  168.  
  169. }
  170.  
  171. b, strong {
  172. font-weight:700;
  173. }
  174.  
  175. strike {
  176. text-decoration: line-through;
  177. }
  178.  
  179. em, i {
  180. text-decoration:italic;
  181. }
  182. u {
  183. text-decoration:underline;
  184. }
  185.  
  186. /*header*/
  187.  
  188. .barca {
  189. position: fixed;
  190. top: 0;
  191. left: 0;
  192. width: 100%;
  193. background: #000; /*You can change the colour of the header*/
  194. z-index: 99;
  195. height: 150px;
  196. overflow: hidden;
  197. -webkit-transition: height 0.3s;
  198. -moz-transition: height 0.3s;
  199. transition: height 0.3s;
  200. }
  201.  
  202. .barca nav a {
  203. -webkit-transition: all 0.3s;
  204. -moz-transition: all 0.3s;
  205. transition: all 0.3s;
  206. }
  207.  
  208. .barca.midget {
  209. height: 35px;
  210. }
  211.  
  212. .midget .blaugrana {
  213. margin-top:-105px;
  214. -webkit-transition: all 0.3s;
  215. -moz-transition: all 0.3s;
  216. transition: all 0.3s;
  217. }
  218.  
  219. nav a {
  220. position: relative;
  221. display: inline-block;
  222. margin: 25px auto 15px auto;
  223. outline: none;
  224. color: #fff;
  225. text-decoration: none;
  226. text-transform: uppercase;
  227. letter-spacing: 1px;
  228. font-weight: 400;
  229. text-shadow: 0 0 1px rgba(255,255,255,0.3);
  230. font-size: 2.5em;
  231. }
  232.  
  233. nav a:hover,
  234. nav a:focus {
  235. outline: none;
  236. }
  237.  
  238. .albiceleste {
  239. text-align:center;
  240. }
  241.  
  242. .albiceleste a {
  243. padding: 10px;
  244. color: #fff;
  245. font-weight: 700;
  246. text-shadow: none;
  247. -webkit-transition: color 0.3s;
  248. -moz-transition: color 0.3s;
  249. transition: color 0.3s;
  250. }
  251.  
  252. .albiceleste a::before,
  253. .albiceleste a::after {
  254. position: absolute;
  255. left: 0;
  256. width: 100%;
  257. height: 2px;
  258. background: #fff;
  259. content: '';
  260. opacity: 0;
  261. -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  262. -moz-transition: opacity 0.3s, -moz-transform 0.3s;
  263. transition: opacity 0.3s, transform 0.3s;
  264. -webkit-transform: translateY(-10px);
  265. -moz-transform: translateY(-10px);
  266. transform: translateY(-10px);
  267. }
  268.  
  269. .albiceleste a::before {
  270. top: 0;
  271. -webkit-transform: translateY(-10px);
  272. -moz-transform: translateY(-10px);
  273. transform: translateY(-10px);
  274. }
  275.  
  276. .albiceleste a::after {
  277. bottom: 0;
  278. -webkit-transform: translateY(10px);
  279. -moz-transform: translateY(10px);
  280. transform: translateY(10px);
  281. }
  282.  
  283. .albiceleste a:hover,
  284. .albiceleste a:focus {
  285. color:#fff;
  286. }
  287.  
  288. .albiceleste a:hover::before,
  289. .albiceleste a:focus::before,
  290. .albiceleste a:hover::after,
  291. .albiceleste a:focus::after {
  292. opacity: 1;
  293. -webkit-transform: translateY(0px);
  294. -moz-transform: translateY(0px);
  295. transform: translateY(0px);
  296. }
  297.  
  298. .blaugrana {
  299. font-family:'Lato', Arial, Sans-Serif;
  300. font-weight:400;
  301. text-align:center;
  302. position: relative;
  303. margin: 5px auto;
  304. width: 560px;
  305. -webkit-transition: all 0.3s;
  306. -moz-transition: all 0.3s;
  307. transition: all 0.3s;
  308. }
  309.  
  310. .blaugrana a {
  311. color:#fff;
  312. font-size:16px;
  313. margin:15px;
  314. display:inline-block;
  315. }
  316.  
  317. .blaugrana a::after {
  318. position: absolute;
  319. top: 100%;
  320. left: 0;
  321. width: 100%;
  322. height: 1px;
  323. background: #fff;
  324. content: '';
  325. opacity: 0;
  326. -webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
  327. -moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
  328. transition: height 0.3s, opacity 0.3s, transform 0.3s;
  329. -webkit-transform: translateY(-10px);
  330. -moz-transform: translateY(-10px);
  331. transform: translateY(-10px);
  332. }
  333.  
  334. .blaugrana a:hover::after,
  335. .blaugrana a:focus::after {
  336. height: 5px;
  337. opacity: 1;
  338. -webkit-transform: translateY(0px);
  339. -moz-transform: translateY(0px);
  340. transform: translateY(0px);
  341. }
  342.  
  343.  
  344. /*conts*/
  345.  
  346. #t1, #t2, #t3, #t4 {
  347.  
  348. width:100%;
  349. position:relative;
  350. margin:0 auto;
  351. display:none;
  352.  
  353. }
  354.  
  355. #t1 {
  356. display:block;
  357. }
  358.  
  359. /*About*/
  360.  
  361. table {
  362. width:800px;
  363. height:500px;
  364. margin:200px auto;
  365. border:1px solid #cdcdcd;
  366. position:relative;
  367. }
  368.  
  369. td {
  370. vertical-align:top;
  371. width:400px;
  372. height:500px;
  373. line-height:140%;
  374. }
  375.  
  376. td h1 {
  377. text-align:center;
  378. text-transform:uppercase;
  379. font-family:'raleway', arial,sans-serif;
  380. font-weight:300;
  381. color:#000; /*you can change the heading here*/
  382.  
  383. }
  384.  
  385. .ab {
  386. width:350px;
  387. padding:10px 25px;
  388. margin:auto;
  389. line-height:140%;
  390. text-align:left;
  391.  
  392. }
  393.  
  394. .desc {
  395. width:350px;
  396. text-align:center;
  397. margin:auto;
  398.  
  399. }
  400.  
  401. .desc div {
  402. display:block;
  403. text-align:left;
  404. width:100%;
  405. margin:15px;
  406. font-size:1.2em;
  407. line-height:140%;
  408. font-weight:300;
  409. text-transform:uppercase;
  410. }
  411.  
  412. .desc div strong {
  413.  
  414. font-weight:bold;
  415. color:#000; /*you can change the colour of the bolded font here*/
  416. }
  417.  
  418.  
  419.  
  420. /*FAQ*/
  421.  
  422. #howler {
  423. width:600px;
  424. height:400px;
  425. margin:200px auto;
  426. }
  427.  
  428. #howler h1 {
  429. text-align:center;
  430. padding:8px;
  431. text-transform:uppercase;
  432. font-family:'raleway', arial,sans-serif;
  433. font-weight:300;
  434.  
  435. }
  436.  
  437. .questions {
  438. width:500px;
  439. padding:10px 20px;
  440. height:200px;
  441. font-size:14px;
  442. margin:auto;
  443. overflow:auto;
  444. border:1px solid #cdcdcd;
  445. line-height:140%;
  446.  
  447.  
  448. }
  449.  
  450. .q {
  451. display:block;
  452. font-size:1.2em;
  453. margin-top:10px;
  454. letter-spacing:1.5px;
  455. font-weight:bold;
  456. padding:10px 0;
  457. font-family:'raleway', arial,sans-serif;
  458. }
  459.  
  460. /*Navi*/
  461. .navi {
  462. width:680px;
  463. position:relative;
  464. margin:200px auto;
  465. text-align:center;
  466. }
  467.  
  468. .navi a {
  469. text-align:center;
  470. white-space: nowrap;
  471. overflow:hidden;
  472. text-overflow: ellipsis;
  473. text-transform:uppercase;
  474. background: #fafafa;
  475. width:200px;
  476. color: #000; /*You can change the colour of the text*/
  477. font-family: 'Lato', Arial, Sans-Serif;
  478. font-size:1.2em;
  479. display:inline-block;
  480. padding:15px;
  481. margin:5px;
  482. transition: all 0.3s ease-in-out;
  483. -webkit-transition: all 0.3s ease-in-out;
  484. -moz-transition: all 0.3s ease-in-out;
  485. -o-transition: all 0.3s ease-in-out;
  486. }
  487.  
  488. .navi a:hover {
  489. background: #000;
  490. color:#fff;
  491. transition: all 0.3s ease-in-out;
  492. -webkit-transition: all 0.3s ease-in-out;
  493. -moz-transition: all 0.3s ease-in-out;
  494. -o-transition: all 0.3s ease-in-out;
  495.  
  496. }
  497.  
  498. /*Broll*/
  499. #t4 * {
  500. box-sizing:content-box;
  501. -webkit-box-sizing:content-box;
  502. -moz-box-sizing:content-box;
  503. }
  504.  
  505. .wizards{
  506. position: relative;
  507. width:750px;
  508. margin: 180px auto;
  509.  
  510. }
  511.  
  512. .wizards:before,
  513. .wizards:after {
  514. content:"";
  515. display:table;
  516. }
  517. .wizards:after {
  518. clear:both;
  519. }
  520.  
  521. /*icons*/
  522. .wizards article{
  523. width: 128px;
  524. height: 128px;
  525. padding:10px;
  526. background: #fff;
  527. cursor: pointer;
  528. float: left;
  529. border: 1px solid #fafafa;
  530. text-align: left;
  531. text-transform: none;
  532. margin: 15px;
  533. z-index: 1;
  534. box-shadow:
  535. 0px 0px 0px 10px #fafafa,
  536. 1px 1px 3px 10px #fafafa;
  537. transition:
  538. all 0.4s ease-in-out;
  539. -webkit-transition:all 0.4s ease-in-out;
  540. -moz-transition:all 0.4s ease-in-out;
  541. -o-transition:all 0.4s ease-in-out;
  542. -ms-transition:all 0.4s ease-in-out;
  543.  
  544. -webkit-backface-visibility: hidden;
  545. }
  546.  
  547.  
  548.  
  549. .wizards article.blur{
  550. box-shadow: 0px 0px 20px 10px #fafafa;
  551. transform: scale(0.9);
  552. -webkit-transform: scale(0.9);
  553. -moz-transform: scale(0.9);
  554. -o-transform: scale(0.9);
  555. -ms-transform: scale(0.9);
  556. opacity: 0.7;
  557. -moz-filter:blur(5px);
  558. -webkit-filter: blur(5px);
  559. filter: blur(5px);
  560. }
  561.  
  562. .wizards article.active{
  563. transform: scale(1.05);
  564. -webkit-transform: scale(1.05);
  565. -moz-transform: scale(1.05);
  566. -o-transform: scale(1.05);
  567. -ms-transform: scale(1.05);
  568. box-shadow:
  569. 0px 0px 0px 10px #fafafa,
  570. 1px 11px 15px 10px #fafafa;
  571. z-index: 100;
  572. opacity: 1;
  573. -webkit-filter: blur(0px);
  574. -moz-filter:blur(0px);
  575. filter: blur(0px);
  576. transition:
  577. all 0.4s ease-in-out;
  578. -webkit-transition:all 0.4s ease-in-out;
  579. -moz-transition:all 0.4s ease-in-out;
  580. -o-transition:all 0.4s ease-in-out;
  581. -ms-transition:all 0.4s ease-in-out;
  582. }
  583. .wizards article.active h3 a,
  584. .wizards article.active header span,
  585. .wizards article.active p{
  586. opacity; 1;
  587. }
  588.  
  589.  
  590. /*PLEASE DO NOT ALTER OR COVER THE CREDIT, THANKS! C: */
  591. #leo {
  592.  
  593. font-family: Arial, Sans-Serif;
  594. text-transform:uppercase;
  595. text-align:center;
  596. z-index:999999999;
  597. box-sizing:content-box;
  598. -webkit-box-sizing:content-box;
  599. -moz-box-sizing:content-box;
  600.  
  601. }
  602.  
  603. #leo a {
  604. z-index:999999999;
  605. position:fixed;
  606. font-size:12px;
  607. line-height:16px;
  608. width:18px;
  609. height:18px;
  610. font-weight:300;
  611. bottom:10px;
  612. right:10px;
  613. color:#000;
  614. background:rgba(255,255,255,0.4);
  615. padding:5px;
  616. transition: all 1s ease-in-out;
  617. -webkit-transition: all 1s ease-in-out;
  618. -o-transition: all 1s ease-in-out;
  619. -moz-transition: all 1s ease-in-out;
  620. box-sizing:content-box;
  621. -webkit-box-sizing:content-box;
  622. -moz-box-sizing:content-box;
  623. }
  624.  
  625. #leo a:hover {
  626. background-color:rgba(0,0,0,1);
  627. color:#fff;
  628. border-radius:50%;
  629. -webkit-animation: hermione 1s; /* Chrome, Safari, Opera */
  630. -moz-animation: hermione 1s;
  631. -o-animation: hermione 1s;
  632. animation: hermione 1s;
  633. animation-timing-function: ease-in-out;
  634. -webkit-animation-timing-function: ease-in-out;
  635. -moz-animation-timing-function: ease-in-out;
  636. -o-animation-timing-function: ease-in-out;
  637.  
  638. -moz-transform: rotate(720deg); /* IE 9 */
  639. -webkit-transform: rotate(720deg); /* Chrome, Safari, Opera */
  640. transform: rotate(720deg);
  641.  
  642. transition: all 1s ease-in-out;
  643. -webkit-transition: all 1s ease-in-out;
  644. -o-transition: all 1s ease-in-out;
  645. -moz-transition: all 1s ease-in-out;
  646.  
  647.  
  648. }
  649.  
  650. @-webkit-keyframes hermione {
  651. 0% {color:#000;}
  652. 25% {color:#ACE4EA;}
  653. 50% {color:#FFFBDD;}
  654. 75% {color:#ACE4EA;}
  655. 100% {color:#fff;}
  656. }
  657. @-moz-keyframes hermione {
  658. 0% {color:#000;}
  659. 25% {color:#ACE4EA;}
  660. 50% {color:#FFFBDD;}
  661. 75% {color:#ACE4EA;}
  662. 100% {color:#fff;}
  663. }
  664. @-o-keyframes hermione {
  665. 0% {color:#000;}
  666. 25% {color:#ACE4EA;}
  667. 50% {color:#FFFBDD;}
  668. 75% {color:#ACE4EA;}
  669. 100% {color:#fff;}
  670. }
  671.  
  672. @keyframes hermione {
  673. 0% {color:#000;}
  674. 25% {color:#ACE4EA;}
  675. 50% {color:#FFFBDD;}
  676. 75% {color:#ACE4EA;}
  677. 100% {color:#fff;}
  678. }
  679. /*END OF CREDIT*/
  680.  
  681. </style></head>
  682. <body>
  683.  
  684. <div class="barca">
  685. <nav class="albiceleste" id="albiceleste">
  686. <a href="/" data-hover="black magic;">black magic;</a>
  687. </nav>
  688.  
  689. <nav class="blaugrana" id="blaugrana">
  690.  
  691. <a class="un" href="#">About</a>
  692. <a class="deux" href="#">FAQ</a>
  693. <a class="trois" href="#" >Navi</a>
  694. {block:Following} <a class="quatre" href="#">Blogroll</a>
  695. {/block:Following}
  696.  
  697. </nav>
  698. </div>
  699.  
  700. <!--About-->
  701. <div id="t1">
  702.  
  703. <table>
  704.  
  705. <td style="border-right:1px solid #cdcdcd;">
  706. <figure class="profile">
  707.  
  708. <!--Image URL-->
  709. <img src="http://static.tumblr.com/ea74bbc6e5fe579b60a078043b5949a4/xbvpdcx/uuinos9i3/tumblr_static_c5rxvbquh7cccwgs8k8go4kss.jpg">
  710. <!--End of Image URL-->
  711.  
  712. <figcaption>
  713. <h2><span> Name</span></h2>
  714.  
  715. <!--description-->
  716. <p>
  717.  
  718. Introduce yourself! e.g. Name, Age, Country, MBTI, etc
  719.  
  720. </p>
  721. <!--End of description-->
  722. </figcaption>
  723. </figure>
  724.  
  725. <div class="desc">
  726.  
  727. <div>
  728. <b>Basics:</b> Hover over the picture!
  729. </div>
  730.  
  731. <div>
  732. <b>Blog Type:</b> e.g. Multifandom
  733. </div>
  734.  
  735. <div>
  736. <b>Likes:</b> Some Pastimes / Hobbies
  737. </div>
  738.  
  739. <div>
  740. <b>Blacklist:</b> e.g. your Triggers
  741. </div>
  742.  
  743. </div>
  744.  
  745. </td>
  746.  
  747. <td style="overflow:auto;">
  748.  
  749. <h1>More Info:</h1>
  750.  
  751. <div class="ab">
  752.  
  753. <p>Write as little or as much as you wish. You can write in <b>bold</b>, <i>italic</i>, <u>underline</u>, <strike>strikethrough</strike>, and whatever you want, because the sky is your limit!
  754. </p>
  755.  
  756. <p>
  757. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.
  758. </p>
  759.  
  760. </div>
  761. </td></table>
  762.  
  763. </div>
  764.  
  765.  
  766.  
  767. <!--FAQ-->
  768. <div id="t2">
  769.  
  770. <div id="howler">
  771.  
  772. <h1>Frequently Asked Questions</h1>
  773.  
  774. <div class="questions">
  775.  
  776. <!--Questions-->
  777.  
  778. <div class="q">Question?</div>
  779.  
  780. Answer
  781.  
  782. <div class="q">Question?</div>
  783.  
  784. Answer
  785.  
  786.  
  787. <div class="q">Question?</div>
  788.  
  789. Answer
  790.  
  791. <div class="q">Question?</div>
  792.  
  793. Answer
  794.  
  795.  
  796. <div class="q">Question?</div>
  797.  
  798. Answer
  799.  
  800. </div>
  801.  
  802. <!--Askbox-->
  803. <p>
  804. <center>
  805. <iframe frameborder="0" scrolling="no" width="500" height="190" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:auto;" id="ask_form"></iframe>
  806. </center>
  807. </p>
  808.  
  809. </div></div>
  810.  
  811. <!--Navigation & Tags-->
  812. <div id="t3">
  813.  
  814. <div class="navi">
  815.  
  816. <!--
  817. When you are adding links, please follow the instruction below:
  818.  
  819. 1) If you're linking a page within the same blog
  820. e.g. linking http://hogwartsproject.tumblr.com/ask , you just need to add the 'ask' after the '/'
  821.  
  822. 2) If you're linking to a specific tag e.g. the 'hp' tag on your blog, you need to add 'tagged/hp' after the '/'
  823.  
  824. 3) If you're linking any external links or any pages outside your URL, then you need the full URL, including the 'http://' part.
  825.  
  826. -->
  827.  
  828. <a href="/">Link</a>
  829. <a href="/">Link</a>
  830. <a href="/">Link</a>
  831. <a href="/">Link</a>
  832. <a href="/">Link</a>
  833. <a href="/">Link</a>
  834. <a href="/">Link</a>
  835. <a href="/">Link</a>
  836. <a href="/">Link</a>
  837.  
  838. </div></div>
  839.  
  840.  
  841. <!--Blogroll-->
  842. <div id="t4">
  843.  
  844. {block:Following}
  845. <section class="wizards" id="wizards">
  846. {block:Followed}
  847. <article>
  848.  
  849. <a href="{FollowedURL}" title="{FollowedName}">
  850. <img src="{FollowedPortraitURL-128}"/></a>
  851. </article>
  852. {/block:Followed}
  853.  
  854. </section>
  855.  
  856. {/block:Following}
  857.  
  858. </div>
  859.  
  860.  
  861. <!--PLEASE DO NOT ALTER OR COVER THE CREDIT-->
  862. <div id="leo">
  863. <a href="http://hermionejean.co.vu">♚</a>
  864. </div>
  865. <!--END OF CREDIT-->
  866.  
  867.  
  868. <!--SCRIPTS-->
  869. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  870. <script>
  871. $(function() {
  872.  
  873. var $container = $('#wizards'),
  874. $articles = $container.children('article'),
  875. timeout;
  876.  
  877. $articles.on( 'mouseenter', function( event ) {
  878.  
  879. var $article = $(this);
  880. clearTimeout( timeout );
  881. timeout = setTimeout( function() {
  882.  
  883. if( $article.hasClass('active') ) return false;
  884.  
  885. $articles.not( $article.removeClass('blur').addClass('active') )
  886. .removeClass('active')
  887. .addClass('blur');
  888.  
  889. }, 65 );
  890.  
  891. });
  892.  
  893. $container.on( 'mouseleave', function( event ) {
  894.  
  895. clearTimeout( timeout );
  896. $articles.removeClass('active blur');
  897.  
  898. });
  899.  
  900. });
  901. </script>
  902.  
  903. <script src="http://static.tumblr.com/xbvpdcx/8a7nkqvai/classie.js" ></script>
  904. <script>
  905. /**
  906. * cbpAnimatedHeader.min.js v1.0.0
  907. * http://www.codrops.com
  908. *
  909. * Licensed under the MIT license.
  910. * http://www.opensource.org/licenses/mit-license.php
  911. *
  912. * Copyright 2013, Codrops
  913. * http://www.codrops.com
  914. */
  915. var cbpAnimatedHeader=(function(){
  916.  
  917. var b=document.documentElement,g=document.querySelector(".barca"),
  918. e=false,a=100;function f(){window.addEventListener("scroll",function(h){if(!e){e=true;setTimeout(d,250)}},false)}function d(){var h=c();if(h>=a){classie.add(g,"midget")}else{classie.remove(g,"midget")}e=false}function c(){return window.pageYOffset||b.scrollTop}f()})();
  919. </script>
  920.  
  921.  
  922. </body>
  923. </html><!--
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!