Arquivo da tag: HTML element

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

Hack CSS para IE, FireFox, Opera

Esse post e voltado para quem ainda tem problemas com as versões do IE (Internet Explore), que quando acha que o trabalho está terminado, acaba vendo que o CSS no IE está tudo estourado, torto, com fonte diferente, onde acaba dando ainda mais trabalho.
Aqui vou mostrar hacks de algumas versões do IE.
Hacks CSS são regras que só servem para determinado navegardor. No caso, esse determinado navegador geralmente é o IE, mas podemos encotrar alguns hacks para outros navegadores também.


#element {
color:orange;
}
#element {
*color:white;    /* IE6+7, doesn't work in IE8/9 as IE7 */
}
#element {
_color: red;     /* IE6 */
}

 #element {
_color /***/: red9;     /* IE8 */
}

#element {
color: green\0/IE8+9; /* IE8+9  */
}
:root #element { color:pink \0/IE9; }  /* IE9 */
#element, x:-moz-any-link, x:default { margin-top:50px; } /* Firefox 3.0 para o mais novo */
@media not all and (-webkit-min-device-pixel-ratio:0) {  #element { margin-top:50px; }  }  /* Opera 10 mais novo */

24 Sliders Fantásticos Com jQuery

A Vantagem De Usar Um Slider

Um slider é uma solução ótima para você exibir o conteúdo que você quer destacar, com a possibilidade de você conseguir mostrar vários artigos, tutoriais, fotos, imagens, produtos ou serviços no mesmo espaço, dado que existe uma rodagem desse conteúdo, que pode ser automática ou manual, através dum sistema de navegação simples, quase sempre constituído por setas, paginação ou imagens miniatura. Continue lendo 24 Sliders Fantásticos Com jQuery

Top 50 plugins gratuitos e tutoriais para jQuery

jQuery, para os que não conhecem, é uma biblioteca Javascript que torna a vida dos programadores e webdesigners, que trabalham com Javascript, muito, mas muito mais fácil! Se vocênão conhece, sugiro dar uma lida nesse ótimo artigo (em inglês) jQuery para designers.

A comunidade em torno do jQuery é muito grande e muito ativa; os desenvolvedores estão sempre criando novos plugins com as mais diversas funcionalidades e disponibilizando para outros desenvolvedores na internet.

Aqui estarei listando 50 dos melhores plugins gratuitos que já encontrei. Observações sobre a lista: ela não está em ordem e os plugins que não possuem “demonstração online” ao lado é porque o exemplo se encontra na mesma página.

  1. jQuery Corners (demonstração online)
    Crie bordas arredondadas facilmente.
  2. jQuery plugin: Treeview (demonstração online)
    Crie facilmente um menu no formato “Treeview”.
  3. Jcrop (demonstração online)
    Plugin para cortar fotos com jQuery.
  4. Galleriffic (demonstração online)
    Galerrific é um plugin para jQuery que permite que você crie uma galeria de fotos super rápida.
  5. Simple Star Rating System
    Crie um sistema de avaliação, com estrelas, facilmente.
  6. jQuery lightBox plugin
    O famoso lightbox.
  7. FaceBook Like – jQuery and autosuggest Search Engine (demonstração online)
    Plugin para criar um autosuggest com um design baseado no do Facebook.
  8. jQuery sIFR Plugin
    Este plugin permite que você substitua um texto com um fonte default pelo mesmo texto com uma fonte customizada.
  9. jQuery plugin: Accordion (demonstração online)
    Plugin para criar menus no estilo Acordião. (veja o exemplo online para entender melhor)
  10. Tutorial: Crie uma interface com tabs (demonstração online)
    Um tutorial que ensina a criar uma interface com tabs com ajuda do jQuery.
  11. ThickBox (demonstração online)
    É como um lightbox mas que funciona para todo tipo de conteúdo: imagem, galeria de fotos, iFrame, texto, formulários e puxar conteúdo via AJAX.
  12. Table Sorter Plugin
    Plugin que permite que o usuário ordene uma tabela automaticamente (sem atualizar a página) de acordo com o campo clicado.
  13. Tutorial para justificar elementos via jQuery e CSS
    Aprenda a justificar perfeitamente diferentes elementos via jQuery e CSS.
  14. Jquery Slider
    Crie facilmente aquele efeito do conteúdo sendo deslizado ao clicar em algum link.
  15. prettyComments
    Acabou o problema com seus inputs de texto e textareas; agora o comprimento delas vai aumentando enquanto os usuários vão digitando.
  16. Masked Input Plugin
    Coloque máscaras para datas, telefones, CEP etc nos inputs de uma maneira super simples.
  17. jQZoom (demonstração online)
    O usuário terá uma visão ampliada de uma imagem ao passar o mouse sobre ela. (funciona como uma lupa)
  18. jWYSIWYG
    Um editor WYSIWYG em jQuery fácil de ser chamado e com poucas ferramentas.
  19. Tutorial para criar um menu no estilo de porta de garagem (demonstração online)
    Aprenda a criar menus desse tipo.
  20. TableRowCheckboxToggle (demonstração online)
    Permite adicionar a função “toogle” em uma linha de uma tabela.
  21. jQuery Corner Demo
    Adicione bordas arredondadas e diversos outros tipos de canto nos elementos da sua página.
  22. jQuery Flash Plugin
    Acabou o problema para inserir flash na sua página de maneira válida.
  23. Pagination (demonstração online)
    Crie uma paginação para uma lista enorme de itens.
  24. DynaCloud
    Plugin que gera uma nuvem de tags ou palavras-chave de um texto ou de alguma página.
  25. EasyDrag jQuery Plugin
    Permite que você possa dar a habilidade de selecionar e arrastar a praticamente qualquer objeto da sua página.
  26. JCarousel (demonstração online)
    Crie um carousel de imagens facilmente com JQuery.
  27. Tutorial para criar um belo menu com sub-itens (demonstração online)
    Plugin para cortar fotos com jQuery.
  28. Slider Gallery (demonstração online)
    Uma galeria de imagens, com um slider, similar à do site da Apple.
  29. Tutorial para criar um header igual ao do Digg (demonstração online)
    Um ótimo tutorial que abusa do CSS e do jQuery para criar um header semelhante ao do Digg, com direito à menus com sub-menus e tudo mais.
  30. Drop Shadows
    Crie um efeito de drop shadow via jQuery.
  31. Flexi Grid
    Um poderoso plugin para se mostrar e editar um grid (tabela) com diversas linhas e colunas para o usuário.
  32. jQuery Multimedia Portfolio (demonstração online)
    Um plugin para criar um portfolio que suporta diferentes tipos de media: fotos, áudio e vídeo; detectando automaticamente a extensão de cada um para aplicar o respectivo player.
  33. Accessible slider (demonstração online)
    Um controle no formato de um slider pra você usar na sua aplicação web.
  34. Simple Effects Plugins
    Permite que você adicione efeitos em seus objetos de uma maneira super simples. Efeitos como “toogle”, esconder, mostrar, fade-in e fade-out e slide.
  35. jQuery Nice Form
    Estilize os elementos do seu formulário facilmente com esse plugin.
  36. Humanized Messages (demonstração online)
    Plugin para exibir mensagens de feedback para os usuários.
  37. HoverAccordion
    Um menu no formato acordião que funciona com mouse over.
  38. jQuery.ScrollTo (demonstração online)
    Plugin para fazer um scroll até um elemento específico na página.
  39. Facebox
    Uma lightbox inspirada no design do facebook, permite carregar imagens, divs ou páginas inteiras.
  40. jQueryColorPicker
    Um plugin para facilitar o usuário na hora de escolher uma cor.
  41. jQuery AlphaNumeric
    Previna que o usuário insira algum tipo de caracter dentro de um input.
  42. Another In-Place Editor (demonstração online)
    Plugin que transformará qualquer elemento em um campo editável.
  43. Featured Content Glider
    Plugin para criar seções com o conteúdo de destaque no site, com slideshow e tudo mais.
  44. Gradient jQuery plugin (demonstração online)
    Permite que você crie e insira gradientes facilmente nos elementos do site.
  45. Cookie Plugin for jQuery
    Um plugin para facilitar o uso de cookies.
  46. Date Picker
    Plugin que permite ao usuário escolher uma data através de um pequeno calendário.
  47. Tutorial para criar um header com fade (demonstração online)
    Tutorial que ensina a criar um header com fade-in durante o hover e fade-out quando o usuário tira o mouse de cima do header.
  48. JQuery Cycle Plugin (demonstração online)
    Plugin que permite adicionar diversos efeitos de transição entre fotos e imagens.
  49. jTruncate (demonstração online)
    Plugin para fixar um limite de caracteres em uma div e colocar um link do tipo “leia mais” que irá expandir a div sem refresh.
  50. Farbtastic
    Cria um controle do tipo paleta de cores onde o usuário poderá fazer a sua seleção.