27 de setembro de 2009

[JS] TOOLTIPS

Arquivado em: jQuery — Leonardo Miranda @ 20:36

tooltips

Olá queridos vou disponibilizar para vocês um plugin onde serve para explicar algum link, ou fazer algum comentário.

Passo 1

Acesse o site do plugin Easiest Tooltip ou caso queira ver a DEMO

Passo 2

Agora vamos importar o jQuery e o plugin.

<script src="jquery.js" type="text/javascript"></script>
<script src="main.js" type="text/javascript"></script>

Passo 3

Adicione o texto no ALT do link.

<a href="http://cssglobe.com" title="Web Standards Magazine">Roll over for tooltip</a>

Para ver todas as formas possíveis com o uso deste plugin acesse e para fazer o download do js AQUI

22 de setembro de 2009

[JS] INTEGRANDO TWITTER COM SITE

Arquivado em: jQuery — Leonardo Miranda @ 15:54

twitter_bird

Olá, tive que integrar um site com o twitter e com uma rápida pesquisa encontrei um tutorial muito simples no Pinceladas Web. Nós iremos utilizar um JS e pronto.

Tutorial

Faça o download do JS o download do plugin e a biblioteca jQuery antes da sua <head>

<script src="jquery.twitter.js" type="text/javascript"></script>

Logo depois

<div id="twitter"></div>

Agora altere o seu login e pronto, coloque esse script antes do <head>


$(document).ready(function() {
$("#twitter").getTwitter({
userName: "jquery",
numTweets: 5,
loaderText: "Loading tweets...",
slideIn: true,
showHeading: true,
headingText: "Latest Tweets",
showProfileLink: true
});
});

18 de setembro de 2009

[JS] WIZARD PLUGIN – FAÇA UM PASSO A PASSO

Arquivado em: jQuery — Leonardo Miranda @ 0:02

step1plugin

Estava olhando plugin por plugin da mega lista e encontrei este plugin maravilhoso, podemos utilizá-lo para fazer um passo a passo em um formulário de contato, cadastro de usuário e várias outras coisas que você imaginar.

Demo

Passo 01

Iremos linkar a biblioteca jquery e o js do plugin.

<script type="text/javascript" src="http://leomiranda.com.br/js/jquery.js"></script>
<script type="text/javascript">
function loadnext(divout,divin){
$("." + divout).hide();
$("." + divin).fadeIn("fast");}
</script>

Para baixar a biblioteca jquery clique aqui

Passo 02

Agora basta colocar nosso código html.

Como o código HTML é muito grande acesse a página demo e copie no código fonte tudo entre o body para testar, depois basta editá-lo.

16 de setembro de 2009

[JS] MEGA LISTA DE PLUGINS

Arquivado em: jQuery — Leonardo Miranda @ 15:43

jquery_logo

Validação de Formulários

jQuery Validation.
Auto Help.
Simple jQuery form validation.
jQuery XAV – form validations.
jQuery AlphaNumeric.
Masked Input.
TypeWatch Plugin.
Text limiter for form fields.
Ajax Username Check with jQuery.

Veja a lista a lista completa!

CONTINUE LENDO ESTE ARTIGO… »

[JS] LIGHTBOX RENOVADO

Arquivado em: jQuery — Leonardo Miranda @ 15:11

image

O plugin jQuery Lightbox foi o primeiro no qual eu tive contato, acho que de muitos, e ele foi aperfeiçoado, antes o que era apenas para uso com imagens, agora podemos utilizar

Imagens

  • Vídeos
  • Flash
  • Iframe

CONTINUE LENDO ESTE ARTIGO… »

12 de setembro de 2009

[JS] Drop-Down plugin

Arquivado em: jQuery — Leonardo Miranda @ 11:51

dropdown.js


$(document).ready(function(){
if(!$("#menu dt").children().not(".titulo").is("span")){
$("#menu dt").prepend("")
}
$("#menu").find("dd").hide();
$("#menu").find("dt").toggle(function(){
$(this).next().slideDown("slow");
$(this).find("span").not(".titulo").empty();
$(this).prepend("");
}, function() {
$(this).next().slideUp("slow");
$(this).find("span").not(".titulo").empty();
$(this).prepend("");
});
});