sofiiayala

Blogroll #1 for tumblr

Jan 26th, 2015
2,387
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.79 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head><title>{Title}</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5.  
  6. <!---- Blogroll #1 by Sofi (castiiel.tumblr.com). DON'T REMOVE THE CREDIT OR CLAIM THE THEME AS YOURS. DON'T USE IT AS A BASE --->
  7.  
  8. <style type="text/css">
  9.  
  10. #dhtmltooltip{
  11. position: absolute;
  12. margin-left:70px;
  13. margin-top: 0px;
  14. border:2px #fff solid;
  15. padding:10px 3px;
  16. line-height:0px;
  17. font-family:consolas, trebuchet ms, sans-serif;
  18. text-transform:uppercase;
  19. font-size:10px;
  20. color:white;
  21. font-weight:bolder;
  22. letter-spacing: 1.5px;
  23. background:rgba(0,0,0, 0.5);
  24. visibility: hidden;
  25. z-index: 999999999999999999999999999;
  26. /*Remove below line to remove shadow. Below line should always appear last within this CSS*/
  27. filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
  28. }
  29.  
  30. .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop {
  31.  
  32. display: none;
  33.  
  34. }
  35.  
  36. body{
  37. font-family:Arial;
  38. background: #f3f3f3;
  39. margin:-10px;
  40. overflow-x:hidden;
  41. }
  42.  
  43. a{
  44. text-decoration:none;
  45. -webkit-transition-duration:.6s;
  46. -moz-transition-duration:.6s;
  47. -o-transition-duration:.6s;
  48. -ms-transition-duration:.6s;
  49. }
  50.  
  51. a:hover{
  52. -webkit-transition-duration:.6s;
  53. -moz-transition-duration:.6s;
  54. -o-transition-duration:.6s;
  55. -ms-transition-duration:.6s;
  56. }
  57.  
  58. #content {
  59. margin:auto;
  60. margin-top:50px;
  61. width:770px;
  62. text-align:center;
  63. }
  64.  
  65. #pannel {
  66. width:128px;
  67. height:128px;
  68. padding:8px;
  69. background:white;
  70. border:1px solid #dfdfdf;
  71. position: relative;
  72. margin:10px;
  73. display:inline-block;
  74. }
  75.  
  76. #pannel img{
  77. width:128px;
  78. height:128px;
  79. }
  80.  
  81. #all {
  82. position: relative;
  83. text-align:center;
  84. margin: -15px 0px;
  85. bottom:50%;
  86. width: 128px;
  87. }
  88.  
  89. #topbar {
  90. width: 100%;
  91. margin:auto;
  92. background:#fff;
  93. border-bottom:1px solid #dfdfdf;
  94. font-size:14px;
  95. font-family: trebuchet ms, consolas, 'lato', sans-serif;
  96. text-transform:uppercase;
  97. padding: 25px 0px 15px;
  98. letter-spacing:1.4px;
  99. color:#000;
  100. text-align:right;
  101. }
  102.  
  103. #topbar a {
  104. color: #000;
  105. font-size:10px;
  106. margin-right:15px;
  107. }
  108.  
  109. #uptownfunk {
  110. margin:auto;
  111. margin-top:50px;
  112. width:770px;
  113. text-align:center;
  114. font-family: trebuchet ms, 'lato', sans-serif;
  115. margin-bottom:50px;
  116. font-size: 10px;
  117. letter-spacing:2px;
  118. text-transform:uppercase;
  119. }
  120.  
  121. #uptownfunk a {
  122. color:#000;
  123. }
  124.  
  125. </style>
  126. </head>
  127. <body>
  128.  
  129. <div id="topbar">
  130. <a href="http://tumblr.com">dash</a>
  131. <a href="/">index</a>
  132. <a href="/ask">mail</a>
  133. <a href="/">about</a>
  134. <b><span style="margin-right:25px;">amazing blogs i am following</span></b>
  135. </div>
  136.  
  137. <div id="content">
  138.  
  139. {block:Following}
  140. {block:Followed}
  141. <div id="pannel">
  142. <a href="{FollowedURL}"><img src="{FollowedPortraitURL-128}" onMouseover="ddrivetip('{FollowedName}')"; onMouseout="hideddrivetip()"></a>
  143. </div>
  144. {/block:Followed}
  145. {/block:Following}
  146.  
  147. </div>
  148.  
  149. <div id="uptownfunk"><a href="http://castiiel.tumblr.com">theme by castiiel</a></div>
  150.  
  151. <div id="dhtmltooltip"></div>
  152.  
  153. <script type="text/javascript">
  154.  
  155. /***********************************************
  156. * Cool DHTML tooltip script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
  157. * This notice MUST stay intact for legal use
  158. * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
  159. ***********************************************/
  160.  
  161. var offsetxpoint=-60 //Customize x offset of tooltip
  162. var offsetypoint=20 //Customize y offset of tooltip
  163. var ie=document.all
  164. var ns6=document.getElementById && !document.all
  165. var enabletip=false
  166. if (ie||ns6)
  167. var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""
  168.  
  169. function ietruebody(){
  170. return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
  171. }
  172.  
  173. function ddrivetip(thetext, thecolor, thewidth){
  174. if (ns6||ie){
  175. if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
  176. if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
  177. tipobj.innerHTML=thetext
  178. enabletip=true
  179. return false
  180. }
  181. }
  182.  
  183. function positiontip(e){
  184. if (enabletip){
  185. var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
  186. var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
  187. //Find out how close the mouse is to the corner of the window
  188. var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
  189. var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20
  190.  
  191. var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000
  192.  
  193. //if the horizontal distance isn't enough to accomodate the width of the context menu
  194. if (rightedge<tipobj.offsetWidth)
  195. //move the horizontal position of the menu to the left by it's width
  196. tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
  197. else if (curX<leftedge)
  198. tipobj.style.left="5px"
  199. else
  200. //position the horizontal position of the menu where the mouse is positioned
  201. tipobj.style.left=curX+offsetxpoint+"px"
  202.  
  203. //same concept with the vertical position
  204. if (bottomedge<tipobj.offsetHeight)
  205. tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
  206. else
  207. tipobj.style.top=curY+offsetypoint+"px"
  208. tipobj.style.visibility="visible"
  209. }
  210. }
  211.  
  212. function hideddrivetip(){
  213. if (ns6||ie){
  214. enabletip=false
  215. tipobj.style.visibility="hidden"
  216. tipobj.style.left="-1000px"
  217. tipobj.style.backgroundColor=''
  218. tipobj.style.width=''
  219. }
  220. }
  221.  
  222. document.onmousemove=positiontip
  223.  
  224. </script>
  225.  
  226. </body>
  227. </html>
  228. <!--
Advertisement
Add Comment
Please, Sign In to add comment