Posts da categoria CSS

Rotacionar imagens com descrição

Esse script constrúido com CSS e jQuery rotaciona imagens, com uma área para inserir uma descrição sobre elas.

É útil quando se deseja mostrar produtos, portfólio e álbum de fotos.

image-rotator

Site: http://designm.ag/tutorials/image-rotator-css-jquery/

Demo: http://www.sohtanaka.com/web-design/examples/image-rotator/

Licença: Não especificada.

jQuery Page Peel

Script que permite mostrar um banner na parte superior direita do site. O banner fica escondido, como uma “orelha”. Ao ser clicado ele aparece.

Essa técnica é denomidada Page Peel.

sample2

Site: http://www.sohtanaka.com/web-design/simple-page-peel-effect-with-jquery-css/

Demo: http://www.sohtanaka.com/web-design/examples/peeling-effect/

Licença: Não especificada.

Menu animado com jQuery

Menu construído com CSS e animado com jQuery. Possui uma aparência profissional e elegante.

jquery-animated-menu

Site: http://www.shopdev.co.uk/blog/animated-menus-using-jquery/

Demo: http://www.shopdev.co.uk/blog/menuDemo.html

Licença: Não especificada.

Tooltip jQuery

Easy Tooltip é um script de tooltip com jQuery. Destaca-se algumas funcionalidades:

  • Permite definir a posição (x, y);
  • Possibilita aplicar diferentes estilos CSS em diferentes tooltips na mesma página;
  • Botão fechar e título na tooltip.

easy-tooltip

Site: http://cssglobe.com/post/4380/easy-tooltip–jquery-plugin

Demo: http://cssglobe.com/lab/easytooltip/03.html

Licença: Não especificada.

Lightbox com CSS

Essa solução dispensa o uso de javascript, normalmente utilizado para escrever esse tipo de aplicação. Usa somente CSS.

lightbox-css

Site: http://www.studiomoh.com/fun/csslightbox/

Demo: http://www.studiomoh.com/fun/csslightbox/

Licença: Não especificada.

Carrinho de Compras com PHP e Ajax

jCart é um sistema de carrinho de compras utilizando PHP e Ajax com jQuery.  Pode ser facilmente adaptado e customizado via CSS. Validação server side, o que aumenta a segurança.

jcart

Site: http://conceptlogic.com/jcart/

Demo: http://conceptlogic.com/jcart/

Licença: MIT License.

Menu vertical mostrar e esconder

Menu em CSS com efeito de mostrar e esconder, ou show/hide como são chamados. Possui a versão simples com javascript e a versão com mootools.

moomenu

Site: http://woork.blogspot.com/2008/03/two-css-vertical-menu-with-showhide.html

Demo: http://woork.bravehost.com/moomenu/index.html

Licença: Não especificada.

Menu horizontal estilo Digg

Barra de navegação utilizando CSS, estilo Digg. Cantos arredondados e imagens em backbround.

diggbar

Site: http://woork.blogspot.com/2008/01/digg-like-navigation-bar-using-css.html

Demo: - - - - - - - - - - - - - - - - - - - -

Licença: Não especificada.

Caixa de alerta com CSS

Caixa de alerta utilizando mootools e jquery. Opções de warning, erro e info.

sexyalertbox12

Site: http://www.coders.me/web-html-js-css/javascript/sexy-alert-box-12-mootools-jquery

Demo: http://www.coders.me/ejemplos/sexy-alert-box-1-2/

Licença: MIT License.

Menu lateral que aparece quando é clicado

Menu lateral que aparece quando é clicado.  Conhecidos como sliding menu, esse estilo poupa espaço na corpo da página.

menu-side-bar

Site: http://www.andrewsellick.com/35/sexy-sliding-javascript-side-bar-menu-using-mootools

Demo: http://www.andrewsellick.com/examples/sliding-side-bar/

Licença: Não especificada.