Arquivo da tag: Cascading Style Sheets

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

47 Surpreendentes Demos de Animações em CSS3

Aqui está uma compilação de 47 de cair o queixo CSS3 demos animação. Eles demonstram as possibilidades da transformação CSS3 e propriedade de transição. Alguns são muito úteis e podem ser utilizados como alternativas Javascript. A maioria deles são simplesmente para olhar. A fim de visualizar estes efeitos, você precisa de um navegador WebKit, como Safari e Chrome (desculpa para os usuários do Internet Explorer). Divirta-se!

CSS3 Clock With jQuery

css3 clock

Analogue Clock

analogue clock Continue lendo 47 Surpreendentes Demos de Animações em CSS3

50 Tutoriais CSS3 úteis

English: CSS3 Styling
English: CSS3 Styling (Photo credit: Wikipedia)

Cada dia CSS3 torna-se cada vez mais popular entre os web designers e desenvolvedores web. Hoje muitas funções interessantes e recursos estão sendo feitos para CSS3, que proporcionam menor tempo de conclusão, mais flexibilidade e fácil de manutenção para páginas web. Neste post vamos oferecer-lhe uma grande coleção de 50 úteis CSS3 tutoriais, você sempre pode usar sempre que precisar. Continue lendo 50 Tutoriais CSS3 úteis

Wookmark jQuery plugin

jquery-plugin-example

Navegando acabei achando esse http://www.wookmark.com/, quem tem um layout bem interessante e descobri que ele disponibiliza um script para poder usar, Olhem abaixo. Continue lendo Wookmark jQuery plugin

Tags HTML5 para IE8

Como sempre, o IE é muito atrás em tecnologia. Este artigo explica como obter suas tags HTML5 trabalhando como se estivessem em Opera, Safari, Chrome ou Firefox.

Você pode obter etiquetas HTML5 trabalho no IE7 e IE8, incluindo este JavaScript na cabeça do seu documento. Para preformance incluí-lo depois de carregar o CSS.

<!--[if lt IE 9]>
 <script>
 document.createElement('header');
 document.createElement('nav');
 document.createElement('section');
 document.createElement('article');
 document.createElement('aside');
 document.createElement('footer');
 document.createElement('hgroup');
 </script>
 <![endif]-->

 

Firefox, Opera, Chrome, todos consegue reconhecer, mas o IE8 e as versões anteriores, não. Certifique-se de declarar qualquer novo elemento HTML5 como block em seu arquivo css, ou declarar in-line para todos os navegadores, pra não ter conflito futuro.

header,nav,section,article,aside,footer,hgroup { display: block; }

Se preferir, você pode puxar um mais elaborado html shiv do Google Code assim:

<!-- Pulled from http://code.google.com/p/html5shiv/ -->
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

Fonte: http://www.nickyeoman.com/blog/html/118-html5-tags-in-ie8

 

CSS3 Repeating Gradients [CSS3 Tips]

Há muitos recursos de CSS3 que mudam a maneira como decorar um site, um dos quais é CSS3 Gradients. Antes de CSS3, definitivamente, precisamos de imagens para criar o efeito de gradiente, agora somos capazes de entregar o mesmo (e melhor) efeitos usando apenas CSS.

Nós discutimos dois tipos de gradientes que podem ser conseguidos com CSS3:

Desta vez, vamos olhar para o seu irmão: repetição de  gradientes.

Continue lendo CSS3 Repeating Gradients [CSS3 Tips]

Ótimos plugins para ser usado no Chrome – Atualizado

google chrome
google chrome (Photo credit: toprankonlinemarketing)

Juntei ótimos plugins que vai facilitar na hora de programar ou pra analisar o desempenho e as estruturas do site, assim podendo melhorar seu sites.

Color Pick

Chrome Web Store - Color Picker

Color Pick é um ótimo plugin para descobrir o código hexa decimal de elementos dentro de um site.

https://chrome.google.com/webstore/detail/ohcpnigalekghcmgcdcenkpelffpdolg

Continue lendo Ótimos plugins para ser usado no Chrome – Atualizado

40 Sci-Fi-incríveis Fontes Você pode obter gratuitamente

O @font-face CSS regra torna mais fácil do que nunca para implementar tipos de fontes originais em seu site sem a necessidade de recorrer a fontes do Google ou de qualquer uma das opções premium. Você não pode querer usar uma fonte personalizada para o seu site inteiro, mas eles podem ser usados ​​com grande efeito para tomar uma posição de sair, mantendo a capacidade para ser lido pelos mecanismos de busca.

Abaixo está uma seleção dos melhores tipos de fontes de ficção científica reconhecível mostra, bem como uma série de outros que seguem o mesmo tema.

Leitura recomendada: Gothic Alta Qualidade & Fontes Horror Continue lendo 40 Sci-Fi-incríveis Fontes Você pode obter gratuitamente

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

Imagem com efeito de Zoom com jQuery

Então, hoje eu vou correr pela técnica usada para ampliar as miniaturas das imagens e exibir a sobreposição de texto.

jquery-thumbs Continue lendo Imagem com efeito de Zoom com jQuery