Arquivo da tag: language javascript

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

Script para ajustar altura da div junto com a da página

Estava trabalhando em um site que tem um menu lateral, que tem a altura de 100%, só que quando abria um submenu, aparecia a barra de rolagem, e altura do menu não ajustava o tamanho sozinho, fiz uma demorada busca até que achei esse script abaixo.

Colocar antes da TAG </head>

&lt;/pre&gt;
&lt;script&gt;
function alertSize() {
 var myWidth = 0, myHeight = 0;
 if( typeof( window.innerWidth ) == 'number' ) {
 //Non-IE
 myWidth = window.innerWidth;
 myHeight = window.innerHeight;
 } else if( document.documentElement &amp;&amp; ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
 //IE 6+ in 'standards compliant mode'
 myWidth = document.documentElement.clientWidth;
 myHeight = document.documentElement.clientHeight;
 } else if( document.body &amp;&amp; ( document.body.clientWidth || document.body.clientHeight ) ) {
 //IE 4 compatible
 myWidth = document.body.clientWidth;
 myHeight = document.body.clientHeight;
 }

return [ alert(&quot;width: &quot;+myWidth+&quot; pxnheight: &quot;+myHeight+&quot; px&quot;) ];
}
&lt;/script&gt;
&lt;script&gt;
function ajustarAltura(){
 var heightTela = document.body.scrollHeight
 document.getElementById('menuLateral').style.height = heightTela+&quot;px&quot;;
}
&lt;/script&gt;
&lt;pre&gt;

Colocar no fim da página.

&lt;/pre&gt;
&lt;script&gt;
alertSize();
alert(&quot;menulateral: &quot;+$(&quot;#menuLateral&quot;).css(&quot;height&quot;));
alert(&quot;document.body.scrollWidth: &quot;+document.body.scrollWidth+&quot; pxndocument.body.scrollHeight: &quot;+document.body.scrollHeight+&quot; px&quot;);
&lt;/script&gt;
&lt;pre&gt;

Pegar informações dentro de uma TAG com Javascript

O código abaixo mostra como selecionar o valor de uma Tag, com javascript. O exemplo abaixo utiliza-se da tag span

Valor do Span aquiou
  alert(document.getElementById('creditototal').firstChild.data);

ou

 alert(document.getElementById('creditototal').innerHTML);

Outro exemplo:

function mostra(){
var altura = document.getElementById(&quot;img&quot;).height;
var largura = document.getElementById(&quot;img&quot;).width;
alert(&quot;Altura: &quot;+altura+&quot;nLargura: &quot;+largura);
}
window.onload = mostra;

Simples Galeria feito em jQuery

Recentemente, fui convidado para codificar uma galeria de fotos muito simples com o jQuery. É realmente simples e é a primeira vez que eu construí uma galeria com jQuery. Ele funciona através da utilização do link para a imagem grande da tag rel que estabelecemos em nosso código html. nós então substituir o conteúdo da div com o id da #image. As funções  hide() e fadeIn() são opcionais. Confira a demonstração abaixo e, como de costume, você pode baixar o código completo!

gallery Continue lendo Simples Galeria feito em jQuery

Editor de texto com PHP e jQuery

Linha de edição, como é conhecido, ou ser capaz de editar conteúdo diretamente em uma página é uma grande ferramenta tem sob sua correia. Vou percorrer exatamente como ele funciona e também como postar o conteúdo do texto atualizado através de um script PHP para o processamento do lado do servidor para colocar no banco de dados.

O Código

Parece um pouco complexo para que eu vou correr rapidamente com exatamente o que está acontecendo.

  1. Quando você visitar a página de demonstração são apresentados com um bloco de texto. Se você passar o mouse sobre o texto que você verá um ícone de edição pouco semelhante a quando você quiser editar o conteúdo no Facebook.
  2. Se o usuário clicar sobre o bloco de código do texto é substituída por uma textarea de formulário com a opção de salvar ou cancelar as alterações.

EDIT Continue lendo Editor de texto com PHP e jQuery

Checker de Disponibilidade de Usuário em jQuery, PHP e MySQL

Checa o banco de dados para verificar se um usuário existe ou não e retorna verdadeiro ou falso.

username

O JavaScript

  1. Então, para começar temos o nosso jQuery em função documento pronto, dentro deste temos um ouvinte de evento. Keyup função que quando acionada corre a função ‘username_check “.
  2. Dentro da função ‘username_check’, em primeiro lugar atribuir ‘username’ a variável com o valor do campo de entrada com o nome ID #.
  3. Vamos agora executar algumas verificações que o campo de entrada de nome de usuário não é vazia e que os seus 4 ou mais caracteres de comprimento. Se tudo estiver ok ea variável nome de usuário é de 4 caracteres podemos ir em frente e fazer a solicitação ajax. Continue lendo Checker de Disponibilidade de Usuário em jQuery, PHP e MySQL

Manipuladores de atributos no jQuery

English: The text "jQuery" in the of...
English: The text “jQuery” in the official logo of jQuery. For the entire logo, see: File:JQuery logo.svg (Photo credit: Wikipedia)

O jQuery oferece 10 métodos que que estão na categoria de atributos, neste post vou mostrar como cada um deles funcionam, com um exemplo simples e pratico, os métodos que estão na categoria de atributos são: Continue lendo Manipuladores de atributos no jQuery

jQuery PHP Ajax Autocomplete

Existem duas funções no bloco de código abaixo. o primeiro uma ‘sugerir’ executa a solicitação ajax com base na entrada usuários no campo de texto que é passado para a função quando a função for executada. Nós referenciar a entrada com “inputString” a variável.

a primeira secção do código é uma simples se instrução para verificar se o comprimento da entrada de utilizadores na caixa de texto é mais do que 0. Se for, corremos o pedido ajax para obter a lista de sugestões do banco de dados. #country refere-se à ID da entrada de texto em nosso formulário. Você pode ver que estamos adicionando “carga” a classe para a entrada de texto. Isso é para mostrar um gif animado de carga para mostrar ao usuário que está recebendo dados do banco de dados. Continue lendo jQuery PHP Ajax Autocomplete

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

15 Efeitos jQuery Fantásticos e Gratuitos

English: The text "jQuery" in the of...

Já falámos anteriormente sobre jQuery, uma livraria de funções Javascript, que se baseia no lema “Escrever menos e fazer mais”. A sua aparição remonta a Janeiro de 2006, tendo sido anunciado no BarCampNYC, sendo que até à data tem tido constantes actualizações, novos addons e melhorias. Veio ajudar a resolver problemas de incompatibilidades entre os navegadores, reduzir o tamanho de código e introduzir a reutilização de código através de plugins. Para si que é um utilizador devoto de jQuery, trazemos-lhe hoje 15 Efeitos jQuery Fantásticos e Gratuitos, para trazer novas e melhoradas funcionalidades aos seus websites! Continue lendo 15 Efeitos jQuery Fantásticos e Gratuitos