posted under , , by dicasweb

Às vezes é apenas divertido para brincar com as linguagens de programação que sabemos e ver o que podemos criar. Veja no link abaixo.

Demo:
http://nettuts.s3.amazonaws.com/378_jqueryKeyboard/demo/index.html
Download:
http://net.tutsplus.com/tutorials/javascript-ajax/creating-a-keyboard-with-css-and-jquery/

Exemplo criativo do uso do microfone pelo flash

posted under , by dicasweb


Agora a criaticidade no FLASH com JAVASCRIPT foi longe de mais, para que tem microfone veja o link abaixo.

http://jsexperiments.appspot.com/files/mouth.html

COLOCAR EFEITO ZOOM NAS FOTOS

posted under by dicasweb

A função deste javascript é adicionar a possibilidade do visitante do seu site aplicar um zoom nas fotos que você exibe. Quando o usuário passar a seta do mouse sobre a foto ela se transformará em uma lupa com o sinal de +. Quando a foto é clicada ocorre uma animação que vai ampliando a imagem até seu tamanho original (maior). Clicando novamente na foto ela é reduzida. Você também poderá adicionar uma descrição no final de cada foto.

O mesmo javascript pode ser utilizado para mudar o tamanho a foto (horizontal ou vertical), mover a foto para a direita ou esquerda exibindo um texto ou conteúdo que esteja atrás.

Veja mais informações e exemplos funcionando aqui. Veja a documentação. Clique para download.

CALENDÁRIO EM JAVASCRIPT PARA SEU SITE

posted under by dicasweb

O moomonth.com é um script feito em javascript perfeito para quem precisa colocar uma agenda de atividades ou de acontecimentos em algum site. Muito útil para sites de empresas de eventos, hoteis, casas de show, escolas, cursos, etc. Ela pode ser totalmente configurada e personalizada. Possui um bonito efeito visual de transição. Ao clicar em algum dia do mês a caixa com o conteúdo daquele dia é ampliada automaticamente. Veja ele funcionando aqui. Você encontra a documentação aqui. O download está na primeira página do site moomonth.com

CARREGADOR DE BIBLIOTECA JAVASCRIPT

posted under by dicasweb

Com o script jsloader.com você pode carregar as bibliotecas javascript mais famosas e utilizadas na Internet de forma rápida e simples. Por exemplo: Se você está desenvolvendo uma aplicação que necessite de um editor de texto e html como o conhecido FCKEditor basta usar o código: JSLoader.load(”ria”,”fckeditor”,”2.5″); e você terá a versão 2.5 do fckeditor rodando no seu site. Com o JSLoader você pode carregar: FCKEditor, JQuery, Lightbox, MochiKit, PlotKit, Google Prettify, Prototype.js, Scriptaculous, SWFUpload, TinyMCE e YahooUI. Veja os comandos aqui.

ADCIONAR COMENTÁRIOS EM FOTOS COM JAVASCRIPT

posted under by dicasweb
O site fotonotes.net oferece uma biblioteca desenvolvida em Ajax/DHTML que permite aos visitantes do seu site criarem marcarem determinadas regiões de uma foto e adicionar comentários sobre aquela região. Um recurso parecido já é utilizado em sites conhecidos como o Flickr. O pacote acompanha os arquivos PHP que trabalham junto com o javascript. Veja um exemplo aqui.

SITE HORIZONTAL COM JAVASCRIPT

posted under by dicasweb

Este javascript permite que você crie menu, páginas de conteúdo ou de imagens organizando o conteúdo em abas que vão se abrindo horizontalmente. É um efeito semelhante a um acordeão.

O script é muito leve (possui apenas 1kb). Para ver um exemplo do script em funcionamento visite a página http://www.leigeber.com/2008/05/horizontal-javascript-accordion-menu/. Clique nas opções One, Two, Three, Four que aparecem na barra horizontal verde para observar o efeito. Para baixar o pacote de exemplo e arquivos clique na opção: Click here to download the script. que se encontra no final do artigo.

COMO MOSTRAR CAIXA DE DICA NOS LINKS

posted under by dicasweb

Este script oferecido pelo site nickstakenburg.com é uma solução sofisticada e rápida de ser aplicada para criar caixas de diálogo com dicas nos links do seu site. Quando o visitante passa o mouse sobre o link a caixa é exibida com qualquer conteúdo html determinado por você. Existem diversos formatos e efeitos. Você pode personalizar tudo: cores, formatos, efeitos, imagens, textos, etc. A caixa de diálogo aberta pode conter um botão de fechar. O javascript utiliza o conhecido Prototype e Scriptaculous. Veja os exemplos e dicas de como utilizar aqui

MOSTRAR FOTO PANORÂMICA EM SITES

posted under by dicasweb

Uma boa foto panorâmica é um elemento obrigatório em sites de hotéis, pousadas, restaurantes, atrações turísticas, empreendimentos imobiliários e qualquer tipo de negócio onde a imagem vale mais que mil palavras.

Hoje em dia muitas máquinas digitais já possuem funções para facilitar a fotografia panorâmicas. Mas mesmo que sua máquina digital não possua este tipo de recurso basta ter um tripé de alumínio.

Para adicionar sua foto panorâmica em um site existe uma extensão do script jquery chamada “Jquery Virtual Tur“. Veja como fica o resultado aqui. Passe o mouse sobre a imagem para ver os botões para avançar. Clique no botão para dar um giro de 360 graus. Clique no X para parar. Uma versão traduzida das orientações para uso deste script você encontra aqui.

CAIXA DE DIÁLOGO ELEGANTE EM JAVASCRIPT

posted under by dicasweb

Uma solução bonita e elegante para criar caixas de diálogo no seu site. O pacote inclui imagens, css e javascript. Funciona em todos os navegadores mais atuais. Ele é muito leve (4.5kb) e pode ter o visual totalmente personalizado. Para ver funcionando clique aqui. Você deve clicar nos links de exemplo que aparecem nesta página. Veja orientações de como utilizar e download aqui. Versão traduzida.

ADCIONAR COMENTÁRIOS EM FOTOS COM JAVASCRIPT

posted under by dicasweb
O site fotonotes.net oferece uma biblioteca desenvolvida em Ajax/DHTML que permite aos visitantes do seu site criarem marcarem determinadas regiões de uma foto e adicionar comentários sobre aquela região. Um recurso parecido já é utilizado em sites conhecidos como o Flickr. O pacote acompanha os arquivos PHP que trabalham junto com o javascript. Veja um exemplo aqui.

REFLEXO EM 3D EM IMAGENS USANDO EM JAVASCRIPT

posted under by dicasweb

Aqui temos uma solução simples utilizando javascript para colocar reflexo nas imagens do seu site. Você encontrará um exemplo e os códigos para download na página ajaxorized.com/3d-image-reflection-with-javascript/

METIDOR DE SEGURANÇA DE SENHA EM JAVASCRIPT

posted under by dicasweb

Ótima solução desenvolvida em javascript para medir a qualidade e segurança de senhas. Você pode adicionar este script nos formulários do seu site onde o usuário precisa criar uma senha. A verificação é feita em tempo real e exibe a qualidade da senha criada através de uma barra colorida. Senhas ruins tem tontalidade avermelhada e senhas boas tonalidades esverdeadas. No exemplo também é feita a verificação do formato do e-mail digitado. Para ver um exemplo funcionando e baixar os scripts clique aqui

MASCARA JAVASCRIPT PARA FORMATAR FORMULÁRIOS

posted under by dicasweb

Não adianta pedir para que o usuário digite o número de telefone em um determinado formato no formulário do seu site que ele não vai seguir suas recomendações. O ideal será utilizar uma mascara utilizando algum código javascript para formatar conteúdo da forma que você desejar. Para isto você pode utilizar o Masked Input Plugin que é um plugin do conhecido jquery.js

Com ele é possível formatar campos de data, telefone, SSN, Chave de produtos, e Tax ID. Se você tem algum conhecimento em javascript será fácil fazer adaptações para outros formatos como cnpj, cpf, rg, cep, etc.

Para ver um exemplo funcionando visite Masked Input Plugin e clique na orelha “Demo”.

CAIXAS DE TEXTO UTILIZANDO MOOTOOLS

posted under by dicasweb

ma solução em javascript (usando o Mootools javascript framework) para criar bonitas caixas de texto como a figura acima. Você pode utilizar estas caixas para colocar formulários, conteúdo texto html, vídeos, figuras, etc. Para ver ele funcionando visite: greghoustondesign.com/demos/mocha/

Clicando em “Examples” na primeira opção do menu superior você poderá ver muitos exemplos do que você poderá fazer. Para download visite

EXEMPLO DE MENU PROFISSIONAL CSS E JAVASCRIPT

posted under by dicasweb

Uma solução de MENU desenvolvida com CSS, HTML e Javascript. Foi testado com sucesso no IE6, IE7, Firefox, Opera, Netscape, Mozilla e Safari (PC). O menu horizontal abre telas verticais com diversas opções. Tem qualidade profissional e pode ser usado como base para projetar seu sites. Para mais informações visite. Para copiar clique aqui.

JAVASCRIPT PARA EFEITOS EM FOTOS

posted under by dicasweb

O site www.swfir.com fornece um javascript para download que permite aplicar diversos efeitos nas fotos do seu site sem precisar editar as mesmas em programas gráficos como o Photoshop, Fireworks, etc. A solução é eficiente e rápida de ser aplicada. Perfeito se você tem um blog ou um site e deseja aplicar um estilo diferente em todas as fotos dos textos e posts sem perder tempo. Alguns efeitos:

Shadow - adiciona uma sombra nas fotos usando o javascript e css.

Corners - adiciona contornos arredondados nas imagens.

Rotate - permite deixar a foto torta no angulo que você desejar.

Border - permite adicionar bordas brancas na foto.

Você também aprenderá como fazer imagens ficarem elásticas. Como adicionar fotos inclinadas no meio do conteúdo texto.

SCRIPT PARA GALERIA DE FOTOS ESTILO APPLES ITUNES

posted under by dicasweb

Se você gosta do visual do Apple´s iTunes ou Finders CoverFlow este script irá lhe ajudar a criar uma galeria de fotos ou um sistema de navegação por imagens com o mesmo estilo visual. Você só precisa instalar o script, colocar as fotos em uma determinada pasta e deixar que ele fará o resto. Tenha mais informações sobre o funcionamento do script em www.outcut.de/MooFlow/ onde também será possível fazer seu download.

ENCONTRAR PARTES DE CÓDIGOS DE DIVERSAS LINGUAGENS

posted under by dicasweb

O site posteet.com oferece o serviço que permite compartilhar com outras pessoas pedaços de códigos de diversas linguagens. Veja nesta página alguns exemplos de códigos javascript ou códigos relacionados a PHP.

Para acessar os códigos não é necessário se cadastrar. Mas se desejar compartilhar seus códigos com outras pessoas basta se cadastrar e participar. Existe um sistema de busca e uma nuvem de tags que facilita a navegação e a localização dos códigos.

COLOQUE UMA GALERIA DE FOTOS NO SITE

posted under by dicasweb

Aqui temos uma solução desenvolvida com javascript / ajax para construir galeria de fotos. O estilo da galeria é profissional. A navegação é feita por meio de uma barra com as miniaturas das fotos. É possível adicionar uma descrição em forma de texto em cada imagem exibida na galeria. Para ver um exemplo funcionando (demo1, demo2). Para acessar o site do projeto monc.se/galleria. Para download e mais informações clique. Se você não sabe nada de javascript tome uma atitude agora.

top