API tools faq
paste
moanszayn

Navi

moanszayn
Jan 1st, 2014
2,177
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.70 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <head>
  4.  
  5. <!-- lustinglou's navigation base from meem follow the rules -->
  6.  
  7. <!-- !!!PLEASE READ PLEASE READ PLEASE READ PLEASE READ PLEASE READ !!!-->
  8.  
  9. <!-- the theme will look off place while you edit but is fine once you save so don't change the position of anything unless you want to put things in a different place or it won't look correct once you save -->
  10.  
  11. <title>{title}</title>
  12.  
  13. <link rel="shortcut icon" href="{favicon}" />
  14.  
  15. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  16.  
  17. <script>
  18.  
  19. (function($){
  20.  
  21. $(document).ready(function(){
  22.  
  23. $("a[title]").style_my_tooltips({
  24.  
  25. tip_follows_cursor:true,
  26.  
  27. tip_delay_time:50,
  28.  
  29. tip_fade_speed:600,
  30.  
  31. attribute:"title"
  32.  
  33. });
  34.  
  35. });
  36.  
  37. })(jQuery);
  38.  
  39. </script>
  40.  
  41. <script type="text/javascript"
  42. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  43.  
  44.  
  45.  
  46. <style type="text/css">
  47.  
  48. body {
  49. background:#fff;
  50. margin:0px;
  51. color:#9a9a9a;
  52. font-family: baskerville;
  53. line-height:100%;
  54. }
  55.  
  56. a {
  57. text-decoration:none;
  58. }
  59.  
  60. #container a {
  61. color: #999;
  62. padding:2px 4px;
  63. text-decoration:none;
  64. -moz-transition-duration:0.5s;
  65. -webkit-transition-duration:0.5s;
  66. -o-transition-duration:0.5s;
  67. }
  68.  
  69. #container a:hover {
  70. color:#fff;
  71. background:#000;
  72. -moz-transition-duration:0.5s;
  73. -webkit-transition-duration:0.5s;
  74. -o-transition-duration:0.5s;
  75. }
  76.  
  77. #container {
  78. font-family:baskerville;
  79. font-size:10px;
  80. text-align:center;
  81. margin:0px auto;
  82. margin-top: -75px;
  83. margin-left:-40px;
  84.  
  85. }
  86.  
  87.  
  88. @font-face{font-family:Basic L;src:url(http://static.tumblr.com/9wzbixa/Cf3mj2g0f/basicl.ttf);}
  89.  
  90.  
  91. #title {
  92. font-family:Basic L;
  93. font-size:34px;
  94. margin-top:-342px;
  95. margin-left:-15px;
  96. width:300px;
  97. color:#000;
  98. text-align:center;
  99. -webkit-transition-duration:1s;
  100. }
  101.  
  102. #title:hover {
  103. font-style:italic;
  104. -webkit-transition-duration:1s;
  105. }
  106.  
  107. #back {
  108. margin-top:258px;
  109. margin-bottom:-10px;
  110. word-spacing:1px;
  111. font-family:calibri;
  112. font-size:8px;
  113. text-transform:uppercase;
  114. margin-left:100px;
  115. width:200px;
  116.  
  117. }
  118.  
  119. #back a{
  120. color:#000;
  121. }
  122.  
  123.  
  124.  
  125. #sub {
  126. margin-top:-170px;
  127. font-family:Georgia ;
  128. font-style:none;
  129. border-bottom:1px solid #777;
  130. font-size:12px;
  131. }
  132.  
  133. #links {
  134. font-family:Latha;
  135. font-style:none;
  136. font-size:11px;
  137. }
  138.  
  139. #box {
  140. width:300px;
  141. padding:40px;
  142. border:0px solid #ddd;
  143. margin:0px auto;
  144. }
  145.  
  146. #image {
  147.  
  148. margin-left:250px;
  149. margin-top:115px;
  150. width: 100px;
  151. height: 100px;
  152.  
  153. }
  154.  
  155. #image img {
  156. margin-left:100px;
  157. width: 200px;
  158. height: 200px;
  159. padding:0px;
  160. border-bottom:3px solid #000;
  161.  
  162. -moz-transition-duration:0.5s;
  163. -webkit-transition-duration:0.5s;
  164. -o-transition-duration:0.5s;
  165.  
  166. }
  167.  
  168.  
  169.  
  170. #image2 {
  171. margin-left:580px;
  172. margin-top: -122px;
  173. width: 240px;
  174. height: 240px;
  175.  
  176.  
  177. }
  178.  
  179. #image2 img {
  180. margin-left: -35px;
  181. width:240px;
  182. height: 240px;
  183. padding:0px;
  184. border:3px solid #000;
  185. -moz-transition-duration:0.5s;
  186. -webkit-transition-duration:0.5s;
  187. -o-transition-duration:0.5s;
  188.  
  189. }
  190.  
  191. #image3 {
  192. margin-left:941px;
  193. margin-top: -218px;
  194. width: 250px;
  195. height: 250px;
  196. z-index:-1;
  197.  
  198. }
  199.  
  200. #image3 img {
  201. margin-left: -150px;
  202. width:200px;
  203. height: 200px;
  204. border-bottom:3px solid #000;
  205. -moz-transition-duration:0.5s;
  206. -webkit-transition-duration:0.5s;
  207. -o-transition-duration:0.5s;
  208. z-index:-1;
  209.  
  210. }
  211.  
  212. #credit{
  213. right:8px;
  214. bottom: 2px;
  215. position:fixed;
  216. padding:5px;
  217. }
  218.  
  219. </style>
  220.  
  221. </head>
  222.  
  223.  
  224. <body>
  225. <!-- change the pictures here -->
  226.  
  227. <div id="image">
  228. <img src="http://31.media.tumblr.com/e442598d8780edbda5ad297d2ac6afd6/tumblr_mr9zaxyt1M1s7ly1xo2_250.gif"></div>
  229.  
  230. <div id="image2">
  231. <img src="http://24.media.tumblr.com/2b5bb4936cd1d9a679e449a040872ec5/tumblr_mr9zaxyt1M1s7ly1xo3_250.gif"></div>
  232.  
  233. <div id="image3">
  234. <img src="http://31.media.tumblr.com/36fc2a0a241155b575b862ec9c89fd5a/tumblr_mr9zaxyt1M1s7ly1xo1_250.gif"></div>
  235.  
  236. <!-- change the navigation title & three links here -->
  237.  
  238. <div id="box">
  239. <div id="title">navigation title</div>
  240. <div id="back"><a href="http://LINK">back</a> <a href="http://LINK">ask</a> <a href="http://www.tumblr.com/dashboard">dash</a></div>
  241. <br><br>
  242. </div>
  243.  
  244. <!-- change the subtitles and links here. to add more rows copy + paste from <span id="sub">subtitle</span> to <br><br> for each row & before the </div> </div> -->
  245.  
  246. <div id="container">
  247. <span id="sub">subtitle</span>
  248. <br><div id="links">
  249. <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a>
  250. <br><br>
  251. <span id="sub">subtitle</span>
  252. <br>
  253. <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a>
  254. <br><br>
  255. <span id="sub">subtitle</span>
  256. <br>
  257. <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a> - <a href="http://LINK">blah</a>
  258. <br>
  259. </div>
  260. </div>
  261.  
  262. <!-- dont touch :) -->
  263.  
  264.  
  265. <div id="credit" data="credit"><a href="http://nouicide.tumblr.com"><img src="http://24.media.tumblr.com/d51c7e63ee92e592f42bead860a1cb3e/tumblr_mrczibkCXy1som5q2o1_500.png" width="50px" height="65px"></a></div>
  266.  
  267. </body>
  268.  
  269.  
  270. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!