Arquivo da tag: Scripts

21 simples e úteis Tutoriais de jQuery

Introdução

São 21 tutoriais e scripts que se concentram em seção diferente de um site (menu, galeria deslizante, dicas, dock, janela modal, ajax eturtorials jQuery).  jQuery é um framework em javascript incrível.

Menu de Navegação

Colocar link “Leia mais” usando jQuery

O Plugin jQuery Expander é um script para mostrar/recolher o conteúdo de um texto grande.

Aqui está uma maneira simples de usar este plug-in seu HTML ou páginas ASP.NET

1. Declare uma Div ou ASP.NET Painel.

<div class="readmore">
   The Div Text Comes Here
</div>

Continue lendo Colocar link “Leia mais” usando jQuery

jQZoom Evolution 2.3

Esse script pode ser modificado para exibir uma máscara sobre a imagem ou não mostrar uma janela de lupa.
Este plugin jQuery ajuda a inserir imagens detalhadas grandes em qualquer website.
O script pode ser aplicada a imagens únicas ou múltiplas na mesma página.

Nota: Atualizei o link que estava errado.

Imagens:

Este slideshow necessita de JavaScript.

Clique aqui para baixar.

Como forçar os usuários a atualizar seu IE6

IE6 Update

Se os usuários de forma consciente não atualizam o IE6 para uma versão mais recente, por que não agora tentarmos alguma maneira não ortodoxa para que eles atualizem? Uma maneira que pode funcionar muito bem é simulando aquela barra de atualização que aparece no browser dizendo que o mesmo precisa ser atualizado para que o site seja melhor visualizado. Se você ainda tem IE6 no seu PC, então aproveite e visite essa página teste criada para simular o update. Continue lendo Como forçar os usuários a atualizar seu IE6

Delete com jQuery Ajax

Removendo conteúdo com o Ajax é uma ferramenta útil para ter em qualquer kit de web designers. Usando algumas linhas de jQuery podemos remover um div e, simultaneamente, remover um registro do banco de dados com Ajax. No download e demonstração você verá uma pequena cruz vermelha à direita de cada comentário. Clicar na cruz irá remover o comentário div com um slide up de animação que irá remover a div. clique na imagem abaixo para conferir o demo.

jquery-delete

Continue lendo Delete com jQuery Ajax

30 Javascript Image e Galeria de fotos – Mootool, Prototype, jQuery e Tutoriais

Nesse post tem vários scripts de galeria de fotos feito em jQuery, Mootool, Prototype e com alguns tutoriais. Continue lendo 30 Javascript Image e Galeria de fotos – Mootool, Prototype, jQuery e Tutoriais

Plugin de Máscara de formulários para JQuery – Masked Input

Se trata de um plugin bem simples e pequeno (2.8kb) de jquery pra fazer máscaras nos inputs de um formulário, como cpf, cnpj, telefone, cep, etc…

Pra usar é bem simples, faça download dos arquivos :

JQuery 1.2.6, versão pack e
Masked Input-1.1.4, versão pack

e chame-os dentro do HEAD da sua página :

 título do site  ...<script src="js/jquery-1.2.6.pack.js" type="text/javascript"></script><script src="js/jquery.maskedinput-1.1.4.pack.js" type="text/javascript"></script>

Para aplicar a máscara, as regras são simples:

a – Representa qualquer letra (A-Z,a-z)
9 – Representa qualquer número (0-9)
* – Representa qualquer caractére alfanumérico (A-Z,a-z,0-9)

Veja os exemplos

<script type="text/javascript">// <![CDATA[
$(document).ready(function(){
$("#telefone").mask("9999-9999");
$("#cpf").mask("999.999.999-99");
$("#cep").mask("99999-999");
$("#data").mask("99/99/9999");
});
// ]]></script>

Veja um exemplo de um campo ajustável, onde pode ser usado como CPF ou como CNPJ no mesmo campo.

<script type="text/javascript">// <![CDATA[
function str_replace(busca,subs,valor){
			var ret=valor;
			var pos=ret.indexOf(busca);
			while(pos!=-1){
				ret=ret.substring(0,pos)+subs+ret.substring(pos+busca.length,ret.length);
				pos=ret.indexOf(busca);
			}
			return ret;
		}

function mascara(valor,masc){
	var res=valor,mas=str_replace("?","",str_replace("9","",masc));
	for(var i=0;i<mas.length;i++){
		res=str_replace(mas.charAt(i),"",res);
		mas=str_replace(mas.charAt(i),"",mas);
	}
	var ret="";
	for(var i=0;i<masc.length&&res!="";i++){ switch(masc.charAt(i)){ case"?": ret+=res.charAt(0); res=res.substring(1,res.length); break; case"9": while(res!=""&&(res.charCodeAt(0)>57||res.charCodeAt(0)<48))res=res.substring(1,res.length);
				if(res!=""){
					ret+=res.charAt(0);
					res=res.substring(1,res.length);
				}
				break;
			default:
				ret+=masc.charAt(i);
		}
	}
	return ret;
}

	$(document).ready(function(){
		
		$("#cpf_cnpj").keyup(function(){
			
			if($(this).val().length <= 14) 
				$(this).val( mascara($(this).val(), '999.999.999-99') ); 
			else
				$(this).val( mascara($(this).val(), '999.999.999/9999-99') ); 
				
		})
		
	});
// ]]></script>

E o campo fica assim


<input id="cpf_cnpj" name="cpf_cnpj" type="text" />

Fonte: digitalbush

Até a próxima. =)