API tools faq
paste
Advertisement
octomoosey

your bones (credit)

octomoosey
Oct 2nd, 2015
1,007
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.41 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!-- octomoosey @ tumblr -->
  4.  
  5. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6. <head><title>{Title}</title>
  7. <link rel="shortcut icon" href="{Favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9.  
  10. <link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
  11.  
  12. <link href='https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>
  13.  
  14.  
  15. <style type="text/css">
  16.  
  17.  
  18. ::-webkit-scrollbar{
  19. height:3px;
  20. width:3px;
  21. background:inherit;}
  22.  
  23. ::-webkit-scrollbar-thumb {
  24. background:#EDA600;} /*change the color of the scrollbar */
  25.  
  26. ::-webkit-scrollbar-track {
  27. background:transparent;}
  28.  
  29. body {
  30. background:#fff; /*change the color of the main background */
  31. margin:0px;
  32. font-family: 'Oswald', sans-serif; /*change the custom font */
  33. font-size:10px;
  34. line-height:150%;}
  35.  
  36. a {
  37. text-decoration: none;
  38. color: #EDA600; /*change the color of the general links */
  39. -webkit-transition: all 0.7s ease;
  40. transition: all 0.7s ease;
  41. -moz-transition: all 0.7s ease;
  42. -o-transition: all 0.7s ease;}
  43.  
  44. a:hover {
  45. color: #fff;} /*change the color of the general links hover */
  46.  
  47. #header {
  48. position:absolute;
  49. top:0px;
  50. left: 50%;
  51. margin-left: -250px;
  52. margin-bottom:50px;
  53. width:500px;}
  54.  
  55. #header img {
  56. max-width:500px;}
  57.  
  58. #container {
  59. position:absolute;
  60. background-color:#333; /*change the background color of the textblock */
  61. color:#fff; /*change the text color */
  62. top:150px;
  63. left: 50%;
  64. margin-left: -250px;
  65. margin-bottom:50px;
  66. letter-spacing:1px;
  67. width:500px;
  68. padding:0px;}
  69.  
  70. #maintitle {
  71. color:#fff; /*change the color of the main title text */
  72. padding:8px;
  73. text-align:left;
  74. letter-spacing:3px;
  75. font-size:30px;
  76. line-height:30px;
  77. text-transform:uppercase;
  78. font-family: 'Yanone Kaffeesatz', sans-serif;}
  79.  
  80. #nav {
  81. float:right;
  82. font-size:10px;
  83. margin-top:10px;}
  84.  
  85. #nav a {
  86. color:#EDA600; /*change the color of navigation at the top of the page */
  87. -webkit-transition: all 0.7s ease;
  88. transition: all 0.7s ease;
  89. -moz-transition: all 0.7s ease;
  90. -o-transition: all 0.7s ease;}
  91.  
  92. #nav a:hover{
  93. color: #fff;} /*change the color of the navigation hover */
  94.  
  95. #title {
  96. background-color:#fff; /*change the color of section title background */
  97. color:#333; /*change the color of the section title text */
  98. padding:8px;
  99. text-align:right;
  100. font-size:20px;
  101. font-family: 'Yanone Kaffeesatz', sans-serif;}
  102.  
  103. #box1 {
  104. padding:10px;}
  105.  
  106. #box1 span {
  107. float:right;}
  108.  
  109. #box1 img {
  110. float:left;
  111. max-height:80px;
  112. max-width:80px;
  113. margin-right:0px;
  114. margin-bottom:10px;}
  115.  
  116. #dhtmltooltip{
  117. text-align:center;
  118. position: absolute;
  119. width: 100px;
  120. color:#333; /*change the color of the hover info text */
  121. border: 1px solid #333; /*change the color of the hover info border */
  122. padding: 2px;
  123. background-color: #fff; /*change the color of the hover info background */
  124. visibility: hidden;
  125. z-index: 100;
  126. -webkit-border-radius: 5px;
  127. -moz-border-radius: 5px;
  128. border-radius: 5px;}
  129.  
  130. /*do not delete credit section */
  131.  
  132. #credit {
  133. bottom:5px;
  134. right:0px;
  135. opacity:1;
  136. position:fixed;
  137. padding:1px;}
  138.  
  139. {CustomCSS}</style></head><body>
  140.  
  141. <div id="header">
  142.  
  143. <!-- add the url of your header image here -->
  144.  
  145. <img src="https://40.media.tumblr.com/885bedc74ee71bd882a0eae397e3a052/tumblr_inline_nvjdpnrxo71ro20i7_540.jpg"></div>
  146.  
  147. <div id="container">
  148.  
  149. <!-- change the main title here here -->
  150. <div id="maintitle">octomoosey
  151.  
  152. <!-- add more links here to the top section if needed -->
  153. <div id="nav">
  154. <a href="/">home</a>
  155. <a href="/ask">ask</a>
  156. <a href="/submit">submit</a>
  157. <a href="https://www.tumblr.com/dashboard">dash</a>
  158. </div>
  159. </div>
  160.  
  161. <!-- to add more boxes for content copy everything from here to the start of the next section title-->
  162.  
  163. <!-- change the section title here -->
  164.  
  165. <div id="title">disclaimer</div>
  166.  
  167. <!-- add your content within the 'box1' div. if you want to get the 'split' effect with text on the left and the right of the box - put any right hand text inside 'span' tags as shown below -->
  168.  
  169. <div id="box1">
  170. Your bones don't break, mine do. That's clear. Your cells react to bacteria and viruses differently than mine. You don't get sick, I do. That's also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke. We get some in our lungs, we drown. However unreal it may seem, we are connected, you and I. We're on the same curve, just on opposite ends.
  171. </div>
  172.  
  173. <!-- change the section title here -->
  174.  
  175. <div id="title">blog credits - coding</div>
  176. <div id="box1">
  177. theme credit or base code <span><a href="/">theme creator & url</a></span> <br>
  178. about page credit <span><a href="/">page creator & url</a></span> <br>
  179. navigation page credit <span><a href="/">page creator & url</a></span> <br>
  180. code snippet for x feature <span><a href="/">creator & url</a></span> <br>
  181. code snippet for x feature <span><a href="/">creator & url</a></span>
  182. </div>
  183.  
  184. <!-- change the section title here -->
  185.  
  186. <div id="title">blog credits - main graphics</div>
  187. <div id="box1">
  188. background graphic <span><a href="/">graphic creator & url</a></span> <br>
  189. sidebar graphic[s] <span><a href="/">graphic creator & url</a></span> <br>
  190. online + offline graphics <span><a href="/">graphic creator & url</a></span> <br>
  191. </div>
  192.  
  193. <div id="title">blog credits - rp icons</div>
  194. <div id="box1">
  195.  
  196. <!-- to customise the icons, links and hover information - add in the url to the first line ( where the icon will link to ). then in the 'onmouseover' section after 'ddrivetip' add in the description or information that will appear on hover - make sure not to delete the apostrophes or brackets. then add in the icon image url to the last section. copy and paste more sections to add more links -->
  197.  
  198. <a href="https://octomoosey.tumblr.com/"
  199. onMouseover="ddrivetip('octomoosey - you can even put a longer description here if you like')";
  200. onMouseout="hideddrivetip()">
  201. <img src="https://40.media.tumblr.com/bd60ea352c82f12b5eabdea2574ba414/tumblr_inline_npixhd60sd1ro20i7_100.jpg"></a>
  202.  
  203. <a href="https://octomoosey.tumblr.com/"
  204. onMouseover="ddrivetip('blog name - the box will resize to hold all of your content automatically')";
  205. onMouseout="hideddrivetip()">
  206. <img src="https://40.media.tumblr.com/c6ec19ff79810bb9850a009f7dcf8a2c/tumblr_inline_npiyi533y41ro20i7_100.jpg"></a>
  207.  
  208. <a href="https://octomoosey.tumblr.com/"
  209. onMouseover="ddrivetip('another blog name')";
  210. onMouseout="hideddrivetip()">
  211. <img src="https://40.media.tumblr.com/c586a61b1ad082b20ec68f101ea70b8d/tumblr_inline_npiyje913H1ro20i7_100.jpg"></a>
  212.  
  213. <a href="https://octomoosey.tumblr.com/"
  214. onMouseover="ddrivetip('octomoosey')";
  215. onMouseout="hideddrivetip()">
  216. <img src="https://40.media.tumblr.com/d4be09a708700aeeb6a749c2869bd110/tumblr_inline_npiykfdGZx1ro20i7_100.jpg"></a>
  217.  
  218. <a href="https://octomoosey.tumblr.com/"
  219. onMouseover="ddrivetip('blog name')";
  220. onMouseout="hideddrivetip()">
  221. <img src="https://40.media.tumblr.com/f66842b2128a8cdac428dfda8d0f44e6/tumblr_inline_npiykiBcC51ro20i7_100.jpg"></a>
  222.  
  223. <a href="https://octomoosey.tumblr.com/"
  224. onMouseover="ddrivetip('another blog name')";
  225. onMouseout="hideddrivetip()">
  226. <img src="https://41.media.tumblr.com/86c22f0ee320d301e38fc07808ebed25/tumblr_inline_npizfslRsk1ro20i7_100.jpg"></a>
  227.  
  228. </div>
  229.  
  230. </div>
  231.  
  232. <div id="dhtmltooltip"></div>
  233.  
  234. <script type="text/javascript">
  235.  
  236. /***********************************************
  237. * Cool DHTML tooltip script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
  238. * Please keep this notice intact
  239. * Visit Dynamic Drive at https://www.dynamicdrive.com/ for full source code
  240. ***********************************************/
  241.  
  242. var offsetxpoint=-50 //Customize x offset of tooltip
  243. var offsetypoint=20 //Customize y offset of tooltip
  244. var ie=document.all
  245. var ns6=document.getElementById && !document.all
  246. var enabletip=false
  247. if (ie||ns6)
  248. var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""
  249. document.body.appendChild(tipobj)
  250.  
  251. function ietruebody(){
  252. return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
  253. }
  254.  
  255. function ddrivetip(thetext, thecolor, thewidth){
  256. if (ns6||ie){
  257. if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
  258. if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
  259. tipobj.innerHTML=thetext
  260. enabletip=true
  261. return false
  262. }
  263. }
  264.  
  265. function positiontip(e){
  266. if (enabletip){
  267. var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
  268. var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
  269. var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
  270. var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20
  271.  
  272. var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000
  273.  
  274. if (rightedge<tipobj.offsetWidth)
  275. tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
  276. else if (curX<leftedge)
  277. tipobj.style.left="5px"
  278. else
  279. tipobj.style.left=curX+offsetxpoint+"px"
  280. if (bottomedge<tipobj.offsetHeight)
  281. tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
  282. else
  283. tipobj.style.top=curY+offsetypoint+"px"
  284. tipobj.style.visibility="visible"
  285. }
  286. }
  287.  
  288. function hideddrivetip(){
  289. if (ns6||ie){
  290. enabletip=false
  291. tipobj.style.visibility="hidden"
  292. tipobj.style.left="-1000px"
  293. tipobj.style.backgroundColor=''
  294. tipobj.style.width=''
  295. }
  296. }
  297.  
  298. document.onmousemove=positiontip
  299.  
  300. </script>
  301.  
  302. <div id="credit"><a href="https://octomoosey.tumblr.com/"
  303. onMouseover="ddrivetip('theme by octomoosey')";
  304. onMouseout="hideddrivetip()">
  305. <img src="https://31.media.tumblr.com/ce8b580be9fa9afaa442fdb216c9b293/tumblr_inline_nj1tziQKpe1ronkfd.png"></a></div>
  306. </body>
  307.  
  308. </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!