#scritps

[dieuy-blog]

Script ImgUr para Nautilus

Siempre que quiero compartir una imagen de forma rápida y segura utilizo los servicios de ImgUr.…

View Post

[reciteoseuamor]

Textos aleatórios

Os textos seram exibidos de maneira aleatória, você pode regular a quantidade mudando o valor 5 para o valor referente a quantidade desejada.

<script language="JavaScript"> var r_text = new Array (); r_text[0] = "Frase 1"; r_text[1] = "Frase 2"; r_text[2] = "Frase 3"; r_text[3] = "Frase 4"; r_text[4] = "Frase 5"; var i = Math.floor(5*Math.random()) document.write(r_text[i]); </script>

Não faça alterações no script, ele pode não funcionar corretamente.

[reciteoseuamor]

Menu Lava lamp

Antes de mais nada, conheçam o autor do script. Veja o menu aqui. Sei que existem 45624 mil tutoriais do menu lava lamp, só que alguns deles não explicam como editar o menu, vou tentar explicar como você pode personalizar.

01)Insira os scripts acima da tag </head> (os scripts abaixo, foram hospeados por mim)

<!-- lava lamp by marlívia --> <script type="text/javascript" src="http://marlivia-tutorial.webs.com/jquery-1.1.3.1.min.js"></script> <script type="text/javascript" src="http://marlivia-tutorial.webs.com/jquery.lavalamp.js"></script> <!-- Optional --> <script type="text/javascript" src="http://marlivia-tutorial.webs.com/jquery.easing.min.js"></script> <script type="text/javascript"> $(function() { $(".lavaLamp").lavaLamp({ fx: "backout", speed: 700 })}); </script>

02)No lugar desejado, adicione o código abaixo para exibir o menu :

<div class="lavaLamp"> <li><a href="url-da-página.com">About</a></li> <li><a href="url-da-página.com">Ask-me</a></li> <li><a href="url-da-página.com">Extras</a></li> <li><a href="url-da-página.com">Links</a></li> <li><a href="url-da-página.com">Créditos</a></li> <li><a href="url-da-página.com">Home</a></li> <li><a href="url-da-página.com">Link</a></li> </div>

Agora vamos partir para o css, vamos personaliza-lo. Ah, baixem o menu, se desejarem. Adicione os códigos a seguir no seu css!: a)Posicionamento:

/**** menu lava lamp editado por Marlívia!*/ .lavaLamp { float:left;/* posicionado ao lado esquerdo!*/ margin:1em 0 2em 0; /* margin superior e inferior! */ background-color: #D3E6E6;/* cor do fundo do menu! */ padding:10px; /* não altere!*/ width:425px; /* largura do menu!*/ height:22px; /* altura do menu !*/ position:relative; /* posição! */ display:block; /* importante!*/ }

b)Links :

/** menu lava lamp! */ .lavaLamp li { float: left; list-style: none; } /** edite as cores!*/ .lavaLamp li a { font-size: 10px; /* tamanho da fonte! */ font-family: verdana; /* fonte! */ font-weight: bold; /* negrito! */ text-decoration: none; /* underline none!*/ text-transform: uppercase; /* letrás maiúsculas! */ color: #fff; /* cor do link! */ text-align: center; /* centralizado! */ } /* não precisa editar!*/ .lavaLamp li a { outline: none; height: 22px; top: 7px; z-index: 10; letter-spacing: 0; float: left; display: block; margin: auto 10px; position: relative; overflow: hidden;}

c)Por ultimo, o efeito deslizante do menu:

/* menu lava lamp!*/ .lavaLamp li.back{ background-color: #F1A0AB;/* cor do fundo */ width: 9px; /* largura! */ top:15px; /* não altere!*/ height: 30px; /* altura!*/ position: absolute; /* importante!*/ } .lavaLamp li.back .left { background-color: #F1A0AB;/* cor do fundo */ height: 22px; /*altura!*/ }

Opcional: Se você desejar deixar com as bordas arredondadas, acresente no seu css:

/** menu lava lamp!*/ .lavaLamp,.lavaLamp li.back,.lavaLamp li.back .left { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;} /** crédite! marlívia tumblr */

Daí é só modificar de acordo com seu gosto, lembre-se se for alterar algum valor, por exemplo a altura, mude a altura dos outros códigos, para não ficar desproporcional.

[reciteoseuamor]

Menu de abas

Autor do script Barelyfitz

01)Baixe aqui o script (o download é automático), em seguida hospede o script em seu servidor, caso não tenha utilize a ferramenta de upload do tumblr. 02)Após hospedar o script adicione o código baixo antes da tag </head> do seu theme (substituindo pelo link do arquivo hospedado):

<script type="text/javascript" src="http://www.seu-servidor-com.br/tabber.js"></script>

03)No seu css adicione (editei o css, é só você adicionar as cores desejadas):

/* menu de abas editado by marlivia */ .tabberlive .tabbertabhide {display: none;} .tabberlive {margin-top: 1em;} ul.tabbernav {margin: 0; padding: 3px 0; font-family: verdana; font-size: 10px;} ul.tabbernav li {list-style: none; margin: 0; display: inline;} ul.tabbernav li a {padding: 3px 0.5em; margin-left: 3px; border: 1px solid #COR;background-color:#COR; border-bottom: none; text-decoration: none;} ul.tabbernav li a:link {color: #COR;} ul.tabbernav li a:visited {color: #COR;} ul.tabbernav li a:hover, ul.tabbernav li.tabberactive a {color: #COR; background-color: #COR; border: 1px solid #COR;} ul.tabbernav li.tabberactive a:hover {color: #COR; background-color: #COR; border: 1px solid #COR;} .tabberlive .tabbertab {padding: 5px; border: 0; border-top: 0;} .tabberlive .tabbertab h2 {display: none;} .tabberlive .tabbertab h3 {display: none;} .tabberlive#tab2 .tabbertab {height: 200px; overflow: auto;} /* fim do menu de bars */

04)No local desejado, onde queira exibir o menu, adicione :

<div class="tabber"> <div class="tabbertab"> <h3>Aba 1</h3> Conteúdo da aba 1 </div> <div class="tabbertab" title="Aba 2"> Conteúdo da aba 2 </div> <div class="tabbertab" title="Aba 3"> Conteúdo da aba 3 </div> </div>

[reciteoseuamor]

Oi Líviiia! Então, uma perguntinha: o "bonecadeluxo" fechou? É que eu estava querendo ver aquela opacidade utilizando JS (eu acho). Obrigada, beijo. Deus abençoe :D

Oi,eu fechei ='/ estou sem tempo para postar lá : Mais então ai o código,pode usar é o mesmo que uso : abaixo do

coloque :

Acima do coloque :

gradualFader.init() //activate gradual fader

Adicione nas imagens

class="gradualfader"

Dessa maneira:

class="gradualfader" src="url-da-sua-imagem.jpg" />

Beijoocas ;*