Mostrando postagens com marcador Scripts. Mostrar todas as postagens
Mostrando postagens com marcador Scripts. Mostrar todas as postagens
segunda-feira, 13 de junho de 2011
Botões google youtube estilo de botões jquery e css
Aqui estão alguns botões estilo Google, legais e moderno.
Esse é basicamente em CSS
http://yayinternets.com/buttons.html
Esse abaixo usa também o jQuery
http://swizec.com/code/styledButton/
Menu jquery do site g1 globo.com
Procurando na net achei esse menu semelhante ao do site g1
http://www.sohtanaka.com/web-design/mega-drop-downs-w-css-jquery/
http://www.sohtanaka.com/web-design/mega-drop-downs-w-css-jquery/
quinta-feira, 5 de maio de 2011
Bordas Arredondadas css, Sombra com css, Gradiente com css dicac css
Bordas Arredondadas com CSS sem usar imagens mais não roda no internet explorer :@
Como usar
<div class="bordas"> </div>
assim sua div ficara com as boardas arredondadas com 6 px
.bordas{
-moz-border-radius-topleft:6px;
-webkit-border-top-left-radius:6px;
border-top-left-radius:6px;
-moz-border-radius-topright:6px;
-webkit-border-top-right-radius:6px;
border-top-right-radius:6px;
-moz-border-radius-bottomleft:6px;
-webkit-border-bottom-left-radius:6px;
border-bottom-left-radius:6px;
-moz-border-radius-bottomright:6px;
-webkit-border-bottom-right-radius:6px;
border-bottom-right-radius:6px;
border:1px solid #6C6C6C;
-moz-border-radius-topleft:6px;
-webkit-border-top-left-radius:6px;
border-top-left-radius:6px;
-moz-border-radius-topright:6px;
-webkit-border-top-right-radius:6px;
border-top-right-radius:6px;
-moz-border-radius-bottomleft:6px;
-webkit-border-bottom-left-radius:6px;
border-bottom-left-radius:6px;
-moz-border-radius-bottomright:6px;
-webkit-border-bottom-right-radius:6px;
border-bottom-right-radius:6px;
border:1px solid #6C6C6C;
}
Sombras Com CSS
Código simples e útil mais como sempre não funciona no senhor ranzinza do internet explorer
Como usar = <div class="sombra" > </div>
.sombra{
-moz-box-shadow:0 0 5px #000;
-webkit-box-shadow:0 0 5px #000;
box-shadow:0 0 5px #000;
-webkit-box-shadow:0 0 5px #000;
box-shadow:0 0 5px #000;
}
======================================================================
Como criar gradiente com CSS - ( Não Funciona com o Opera Browser )
Como Configurar :
Adicionar o Codigo a baixo no CSS do seu site e colocar uma class na tag que você deseja aplicar o gradiente
Ex:
<div class="gradiente" > aqui vai ficar com o gradiente que você colocou no css ! </div>
Cor 1
para iniciar o Gradiente e cor 2 será a segunda cor que terminará o gradiente
.gradiente{
background: -moz-linear-gradient(top, #COR 1 , #COR 2);background: -webkit-gradient(linear, left top, left bottom, from(#COR 1 ), to(#COR 2));
/*Internet Explorer 6,7 e 8*/
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#COR 1', endColorstr='#COR 2');
/*Internet Explorer 8 somente */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#COR 1', endColorstr='#COR 2')";}
======================================================================
Acessa ai www.radiokillerbrasil.com nesse meu site usei esses scripts !
15 Imagem slide jquery , Slide Jquery com Navegação
Com jQuery cada vez mais popular, o volume ea qualidade de plugins e tutoriais que os desenvolvedores estão lançando e escrita estão aumentando rapidamente.
deslizantes de conteúdo são uma grande maneira de mostrar grande quantidade de conteúdo em uma área menor de um pagina web ou um blog. auto deslizantes de conteúdo dinâmico de deslizamento são muito populares em inúmeros sites na web. Você está interessado em implementar uma barra de conteúdo em seu site? Confira esta lista!
deslizantes de conteúdo são uma grande maneira de mostrar grande quantidade de conteúdo em uma área menor de um pagina web ou um blog. auto deslizantes de conteúdo dinâmico de deslizamento são muito populares em inúmeros sites na web. Você está interessado em implementar uma barra de conteúdo em seu site? Confira esta lista!
Um controle deslizante foto bem legal. É apresentado em nettut, se você tentar fazer-se uma barra de fotografia. Visite este site.
Este é um bom tutorial que ensina a "mostrar o melhor conteúdo de seu site ou blog em uma bela maneira intuitiva" para "pegar mais olhos". Uma das técnicas para mostrar o conteúdo apresentado é a reprodução do conteúdo deslizante-auto ».
Este tutorial explica como desenvolver / criar cursores jQuery Beautiful tutorial com a descrição da imagem e nome.
A Simple Content Slider Usando jQuery Por Brenelz Web Development Dicas
gratuito e fácil de usar o componente Flash criada especialmente para a representação visual fácil de multimídia, tais como listas de XMLs, feeds RSS 2.0 do Picasa e Flickr.
um plugin JQuery que "permite que imagens ou qualquer conteúdo para deslizar horizontalmente ou verticalmente em click".
7. jqGalScroll | Site Oficial
jQuery Galeria Scroller (jqGalScroll) tem lista de imagens e cria uma rolagem suave rolagem galeria de fotos na vertical, horizontal ou diagonal. O plugin também vai criar a paginação para que você possa fluir através de suas fotos.
8. Galeria de Imagens | Site Oficial
Não é nada complicado - uma galeria de imagens simples / espectador. Ao chamar o plugin que você especificar quais as imagens que deseja usar como este:
um passo muito bem explicado passo tutorial por Dan Wellman para NETTUTS.
um tutorial escrito por Chris Coyier de CSS Tricks.com. Este script é baseado no Coda Slider. Ele tem características adicionais, tais como:
11. slideViewer | Site Oficial
SlideViewer é um jQuery (1.5Kb) leve plugin que permite criar instantaneamente uma galeria de imagem, escrevendo apenas algumas linhas de HTML, como uma lista não ordenada de imagens.
um tutorial de WebDesignBooth que explica como criar uma barra de conteúdo simples usando a biblioteca JQuery poderoso.
um script muito pequeno e leve slideslow, inspirada na apresentação de slides no website Barack Obama. O roteiro tem o poder de MorphList para melhorar a visualização e navegação das imagens.
Criando Destaque Slider em Wordpress tema utilizando s3Slider JQuery
