API tools faq
paste
Advertisement
helpdesigns

Theme para about tumblr de html - #Isah ♥

helpdesigns
Aug 24th, 2014
277
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 13.67 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2.  
  3. <!--- Theme about by Helpdesigns - Isah Revolucionou --->
  4. <head>
  5. <script type="text/javascript"
  6. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  7. <script>
  8. $(document).ready(function() {
  9.     //
  10. //When you click on a link with class of poplight and the href starts with a #
  11.  
  12. $('a.poplight[href^=#]').click(function() {
  13.  
  14.     var popID = $(this).attr('rel'); //Get Popup Name
  15.  
  16.     var popURL = $(this).attr('href'); //Get Popup href to define size
  17.  
  18.     //Pull Query & Variables from href URL
  19.  
  20.    var query= popURL.split('?');
  21.  
  22.     var dim= query[1].split('&');
  23.  
  24.     var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  25.  
  26.     //Fade in the Popup and add close button
  27.  
  28.     $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://static.tumblr.com/fyc2dbo/tQanaqied/tumblr_inline_n4m95yjlwe1s14gux.png" class="btn_close" title="Feche aqui" alt="Close" /></a>');
  29.  
  30.     //Define margin for center alignment (vertical   horizontal) - we add 80px to the height/width to accomodate for the padding  and border width defined in the css
  31.  
  32.     var popMargTop = ($('#' + popID).height() + 80) / 2;
  33.  
  34.     var popMargLeft = ($('#' + popID).width() + 80) / 2;
  35.  
  36.     //Apply Margin to Popup
  37.  
  38.     $('#' + popID).css({
  39.  
  40.         'margin-top' : -popMargTop,
  41.  
  42.         'margin-left' : -popMargLeft
  43.  
  44.     });
  45.  
  46.     //Fade in Background
  47.  
  48.     $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
  49.  
  50.     $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies
  51.  
  52.     return false;
  53.  
  54. });
  55.  
  56.  
  57. //Close Popups and Fade Layer
  58.  
  59. $('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
  60.  
  61.     $('#fade , .popup_block').fadeOut(function() {
  62.  
  63.         $('#fade, a.close').remove();  //fade them both out
  64.     });
  65.     return false;
  66. });
  67.  
  68. });
  69.  
  70. </script>
  71.  
  72.  
  73.  
  74.                       <title>{Title}</title>
  75.         <link rel="shortcut icon" href="{favicon}">
  76.  
  77. <style>
  78.  
  79. a {color: #fff; text-decoration: none; text-transform: none;}
  80. a:hover {color:#fff; background-color: transparent; text-decoration: none;}
  81.  
  82.  
  83.  
  84.  
  85.  
  86. body {background-color:#1c1c1c; font-family: verdana; color: {color:text}; text-align: center; font-size: 11px; background-image:url(''); background-attachment: fixed; }
  87.  
  88.  
  89. /*--- Descreva-se - Revolucionou - Helpdesigns---*/
  90. #descrevase {width:370px;height:300px;background:#;color:#fff;position:fixed;margin-top:210px;font-family:PF Arma Five;font-size:8px;margin-left:450px;line-height:17px;}
  91.  
  92. @font-face {src: url('http://static.tumblr.com/08l8cbl/bxDmeztw0/pf_arma_five.ttf'); font-family: PF Arma Five;}
  93.  
  94.  
  95.  
  96.  
  97. /*--- Frase - Revolucionou - Helpdesigns---*/
  98. #tihd {font-family:LavanderiaRegular;font-size:35px;color:#fff;z-index:999999999999999999999;text-shadow:0px 1px 1px #000;position:fixed;margin-left:450px;margin-top:150px;}
  99.  
  100. @font-face {font-family: 'LavanderiaRegular';src: url('http://static.tumblr.com/2lqtwbf/G1Dlyrsst/lavanderia_regular-webfont.eot');src: url('http://static.tumblr.com/2lqtwbf/G1Dlyrsst/lavanderia_regular-webfont.eot?#iefix') format('embedded-opentype'),url('http://static.tumblr.com/2lqtwbf/RAPlyrset/lavanderia_regular-webfont.ttf') format('truetype'),url('http://static.tumblr.com/2lqtwbf/kb1lyrsq2/lavanderia_regular-webfont.svg#LavanderiaRegular') format('svg');}
  101.  
  102.  
  103. #tumblr_controls{position: fixed!important}
  104. #tumblr_controls{position: fixed!important}
  105. #tumblr_controls{position: fixed!important}
  106. #tumblr_controls{position: fixed!important}
  107.  
  108.  
  109. #s-m-t-tooltip {max-width:300px;padding:3px 4px 5px 4px;margin:15px 20px;background-color:#000; font-family:PF Arma Five;  font-size:8px;  letter-spacing:1px;   text-transform:uppercase; color:#fff; z-index:9999999;}/*********helpdesigns******/
  110.  
  111.  
  112.   /*--- Pop up - Revolucionou - Helpdesigns---*/
  113.   #fade { /*--Transparent background layer--*/
  114.     display: none; /*--hidden by default--*/
  115.     background-image:url('http://media.tumblr.com/1c453b401e8094af9b23f46588348395/tumblr_inline_mo7ay3aLng1qz4rgp.png');
  116.     position: fixed; left: 0; top: 0;
  117.     width: 100%; height: 100%;
  118.     opacity: .80;
  119.     z-index: 9999;
  120. }
  121. .popup_block{
  122.     display: none; /*--hidden by default--*/
  123.     background: #fff;
  124.     padding: 20px;
  125.     border:0px double #0f0f0f;
  126.     float: left;
  127.     font-size: 1.2em;
  128.     position: fixed;
  129.     top: 50%; left: 50%;
  130. z-index:10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000;background-image:url('');
  131. background:#000;
  132.     /*--CSS3 Box Shadows--*/
  133.     -webkit-box-shadow: 0px 0px 20px #aaa;
  134.     -moz-box-shadow: 0px 0px 20px #aaa;
  135.     box-shadow: 0px 0px 20px #000;
  136.     /*--CSS3 Rounded Corners--*/
  137.     -webkit-border-radius: 0px;
  138.     -moz-border-radius: 0px;
  139.     border-radius: 0px;
  140. }
  141. img.btn_close {
  142.     float: right;
  143.     margin: -40px -40px 0 0;
  144. }
  145. /*--Making IE6 Understand Fixed Positioning--*/
  146. *html #fade {
  147.     position: absolute;
  148. }
  149. *html .popup_block {
  150.     position: absolute;
  151. }
  152.  
  153.  
  154.  
  155. @font-face {src: url('http://static.tumblr.com/08l8cbl/bxDmeztw0/pf_arma_five.ttf'); font-family: PF Arma Five;}
  156.  
  157. /*--- Titulo e box - Helpdesigns---*/
  158.  
  159. .helpdesignstitulo {text-align:left; font:30px  'LavanderiaRegular'; opacity:1; line-height:19px; padding:1px;padding-bottom:2px; color:#fff;}
  160.  
  161.  
  162. .boxhelp {background:#000;overflow: auto;font-family:PF Arma Five;color:#fff; font-size:8px;}
  163.  
  164. /*--- Link - Revolucionou - Helpdesigns---*/
  165.  
  166.  #gainhelpd {z-index:999999999999999;position: fixed; width:500px; margin-left:620px; margin-top:330px; padding: 0px; text-align: center;-webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  167.  
  168. #gainhelpd a {float: left; display: block; letter-spacing:0px;font-size:8px; font-family: PF Arma Five; text-align: center; margin-bottom:0px; margin-left:1px; color:#fff; text-decoration: none; line-height:27px;-webkit-transition: all 0.5s ease-out; -moz-transition: all 0.3s ease-out; height:30px;opacity:1;width:50;overflow:hidden;text-indent:0px;background:#;}
  169. #gainhelpd a:hover {-webkit-transition: all 0.5s ease-out;color:#aaa;  font-weight:calibri;-webkit-transition: all 0.5s ease-out;text-transform:none;width:50px;text-shadow:1px 1px 1px #000;background:#;}
  170.  
  171. @font-face {src: url('http://static.tumblr.com/08l8cbl/bxDmeztw0/pf_arma_five.ttf'); font-family: PF Arma Five;}
  172.  
  173. /*--- Não remover os creditos ---*/
  174.  
  175. </style>
  176.  
  177.  <script type="text/javascript"
  178. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  179. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  180. <script>
  181.     (function($){
  182.  
  183.         $(document).ready(function(){
  184.             $("[title]").style_my_tooltips();
  185.         });
  186.     })(jQuery);
  187. </script>
  188.  
  189. <body>
  190. <div id="tihd">About my tumblr</div>
  191.  
  192. <div id="gainhelpd">
  193. <a href="#?w=500" rel="pop" class="poplight">• Nome</a>
  194. <a href="#?w=500" rel="poptwo" class="poplight">• Nome</a>
  195. <a href="#?w=500" rel="poptree" class="poplight">• Nome</a>
  196. <a href="#?w=500" rel="popfor" class="poplight">• Nome</a>
  197.  </div>
  198. </div>
  199.  
  200. <!--- DESCRIÇÃO AQUI --->
  201. <div id="descrevase"><img src="https://31.media.tumblr.com/avatar_2d5694829d6d_64.png" style="float:left;width:50px;height:50px;margin-right:5px ">Aqui neste espaço, você pode descrever um pouco do seu tumblr, quando ele foi criado, com que intuito, quando tal moderadora entrou e afins, não precisa ser uma coisa muito longa. Então já pra deixar explicadinho, os pop ups já estão arrumados, ele é todo pelo html, e pode ser mudada as cores, os abouts das moderadoras e as fotos, deixei tudo indicado entre outros, esse icon ao lado da descri você coloca a url da img. Peço a você que não use de base, e não retire os créditos, se pegar por favor de like, assim irá nos motivar a postar mais coisas.</div>
  202.  
  203.  
  204. <div style="display:block;top:610px;left:20px;font-size:8px;font-family:PF Arma Five;position:fixed;padding:3px;z-index:55554235555;}"><a href="http://helpdesigns.tumblr.com/" title="Theme about by helpdesigns - Isah">HELPDESIGNS ©</a>
  205. </div>
  206. </body>
  207.  
  208. </html>
  209.  
  210. <!--- Moderadora 1 --->
  211. <div id="pop" class="popup_block">
  212. <div class="helpdesignstitulo">Url da moderadora</div></br>
  213. <div class="boxhelp">
  214. <img src="http://33.media.tumblr.com/073ab642a76d931c2d415f2aa1927d2a/tumblr_n86a0ujIg11stws7go8_250.png" style="float: left;margin-right:3px; border:3px solid #1c1c1c;width:64px;height:64px">Arrume a foto, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal. Fica bonito ir apenas até aqui.<br><br>
  215. </div>
  216.  
  217. </div></div>
  218.  
  219. <!--- Moderadora 2 --->
  220. <div id="poptwo" class="popup_block">
  221. <div class="helpdesignstitulo">Url da moderadora</div></br>
  222. <div class="boxhelp">
  223. <img src="http://31.media.tumblr.com/841a1a56a403f14b5e93532f59b4fb40/tumblr_n86a0ujIg11stws7go5_250.png" style="float: left;margin-right:3px; border:3px solid #1c1c1c;width:64px;height:64px">Arrume a foto, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal. Fica bonito ir apenas até aqui.<br><br>
  224. </div>
  225.  
  226. </div></div>
  227.  
  228. <!--- Moderadora 3 --->
  229. <div id="poptree" class="popup_block">
  230. <div class="helpdesignstitulo">Url da moderadora</div></br>
  231. <div class="boxhelp">
  232. <img src="http://38.media.tumblr.com/6b52aca4b0c07400f7fe46b2c9245de0/tumblr_n86a48WggX1stws7go1_250.png" style="float: left;margin-right:3px; border:3px solid #1c1c1c;width:64px;height:64px">Arrume a foto, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal. Fica bonito ir apenas até aqui.<br><br>
  233. </div>
  234.  
  235. </div></div>
  236.  
  237. <!--- Moderadora 4 --->
  238. <div id="popfor" class="popup_block">
  239. <div class="helpdesignstitulo">Url da moderadora</div></br>
  240. <div class="boxhelp">
  241. <img src="http://37.media.tumblr.com/9f731798d1061d297e5ce8fa52288425/tumblr_n86a48WggX1stws7go6_250.png" style="float: left;margin-right:3px; border:3px solid #1c1c1c;width:64px;height:64px">Arrume a foto, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal, about aqui, aqui você se descreve e tal. Fica bonito ir apenas até aqui.<br><br>
  242. </div>
  243.  
  244. </div></div>
  245.  
  246.  
  247.  
  248. </div>
  249. </div>
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!