pesquise aqui
.............................................................................................................................................................................................
Mostrando postagens com marcador dicas. Mostrar todas as postagens
Mostrando postagens com marcador dicas. Mostrar todas as postagens

Aprenda como: "Expandir imagens"

"Imagens Expandir"


"P ara de Fazer este Efeito NAS Imagens, Siga o passo a passo."

"Não se esqueça de Antes de Começar salvar Uma modelo Cópia de Seu, Caso nao de Certo, É Só reinstalá-lo."









"CLIQUE-ME"
 


"Vá Ate O HTML fazer Seu blogue e cole este código APOS <head>"





<style type = "text / css">
/ * Créditos: Dynamic Drive CSS Biblioteca * /
/ * URL: http://www.dynamicdrive.com/style/ * /
.miniatura{
position: relative;
z-index: 0;
}
.thumbnail: hover {
background-color: transparent;
z-index: 50;
}
.thumbnail extensão {/ * CSS para imagem ampliada * /
position: absolute;
background-color: LightYellow;
padding: 5px;
left: -1000px;
border: 1px frustradas cinza;
visibility: hidden;
cor preta;
text-decoration: none;
}
.thumbnail extensão img {/ * CSS para imagem ampliada * /
border-width: 0;
padding: 2px;
}
.thumbnail: extensão hover {/ * CSS para imagem ampliada em foco * /
visibilidade: visível;
top: 0;
left: 60px; / * Posição onde a imagem ampliada deve compensar horizontalmente * /
}
</ Style>



"Agora copie este Segundo código e cole Onde você Quer Que apareçam como Imagens, colocando nenhuma locais Indicado o endereco das Imagens".


Código Para linkar Imagem Pequena com grande


< A class = "thumbnail" href = " AQUI O ENDERÇO DA IMAGEM #thumb"> <img src = " REPETIR O endereco DA IMAGEM AQUI " width = "100px" height = "66px" border = "0" /> <span > <img src = " REPETIR O endereco DA IMAGEM AQUI " /> <br /> </ span> </a>



"Código Para linkar Imagem NAS Palavras"



<a href=" class="thumbnail" AQUI O endereco DA IMAGEM #thumb"> ESCREVA AQUI O QUE QUER QUE Apareça <span> <img src = " REPETIR O endereco DA IMAGEM AQUI " /> <br /> </ span > </a>






"Créditos: Dynamic Drive CSS"




em Fonte e Créditos fazer pós Presente:


Marcadores:

Aprenda como se faz:..."Opção para mostrar e fechar imagem"





"Opção parágrafo Mostrar e fechar Imagem"

"Em Como Você faz? O blogue that atualiza e mantém VKU Eu vi Uma foto com uma particularidade Que Contém hum Botão de fechar, when rápido Você Clica no Botão um desaparece Imagem, num Primeiro momento PODE NÃO Parecer nada de especial, mas TEM A SUA Utilidade when Se trata de exibição de Conteúdo de Interesse e Que Tem hum lugar especial, sem Realmente se preocupar em ler. rápido Você DEVE USAR UM roteiro e, obviamente, Queremos Mostrar o Conteúdo ".


"Como Preço total: Adicionar O SEGUINTE, pingos POUCO</ Head> o script de adicionar '

<Script>
Função cerrarimagen () {
div = document.getElementById ( "close");
div.style.display = "none";
}
</ Script>

"E o bloco de Preço total: Adicionar como Imagens DEPOIS <body>
<Div style id = 'fechar' = 'border: 0 Importante; Fundo! Transparente; Esquerda: 830px ; top: 60px ; Posição: Fixo; width: 60px ; Z-index: 9999 '<a> href =' javascript: cerrarimagen (); "> <img src =" url-imagem de Perto "style =" float: right ; 'Title =' Fechar '/> <img src = "    URL da Imagem-um-show " /> </ a> </ div>




"Por Exemplo, eu nao tenho SIDO Muito imaginativo, dada a euforia Que Existe ágora na rua com hum grupo de meia hora de Duração global de partida Para Ficar na História POR ISSO adicionei um MESMA Idéia Que O Nosso amigo Como Você faz?"

* Com Largura mover um parágrafo Imagem parágrafo Mostrar a Esquerda OU Direita. "* Um parágrafo Imagem fechar Adicione Ajuda

Esquerda e topo Porque de according com o * Tamanho da Imagem Que Será em Um Canto UO chamada outro." ' "* Com

float: right Indicar se a Imagem foi adicionada Para a Direita e float: left , Sé Para a esquerda ".



fonte e Créditos Deste Presente post: 
Marcadores: , ,

...dicas, entradas expandíveis, página principal...




"Ingressos homepage expansível"
RecordA
embora eu tente OS "Truques"
Antes de Fazer alterações
Manter SEMPRE Equipe SUA
Nunca é Seguro
Tudo Vai Bem .. .
"Algum Tempo Atrás VIMOS Como Conseguir ISSO NAS Páginas de marcas Serao exibidos APENAS OS Títulos das Entradas , Permitindo Clicar Sobre enguias viram completa."


"Were VARIAS PESSOAS TEM me perguntado Sobre Como Fazer ISSO, MAS na home page."


ISSO eu Tenho conseguido com Uma Ligeira modificação fazer 
Código não PoDE Até Nao Problemas apresentam "originais" em Duas Páginas POR vez.


"Truque" Acima Exibindo OS Títulos "recolhidos" Nós assumimos Que Você Não implementou o NAS Páginas de etiquetas.


[1] o Nós Baixar o roteiro precisamos executar o Efeito, descompactá-lo e Envia-lo um hum Alojamento Adequado Para o Seu url.


[2] Vamos Edição de HTML de Nosso Painel de Controlo 
"Modelos de widgets de" colocar a url do roteiro Nesse código e ENTÃO rápido Você Ve, os antes de </ head> :
src = "URL_DEL_SCRIPT 'type =' text / javascript"> <script </ script>
type = 'text / javascript "> <script
Função toggleIt (id) {
post = (id) document.getElementById;
if (post.style.display! 'none' =) {
'Nenhum' = post.style.display;
Outro {}
Post.style.display = '';
    }
}
</ Script>
[3] Agora, localizar o código that Está Escrito em preto, e adicione o código that Está Escrito em Vermelho , colocado Como se ve Aqui, OU SEJA , Código Negro Já está no Mercado de Trabalho e O Vermelho e o código Que É adicionado :
id = var = 'post'> 'PeekABooPost' <b: includable
class = "pós uncustomized-post-modelo '> <div
<Td width = <table> '40px'>
<A expr: onclick = "javascript: toggleIt (\" "+ Dados: post.id +" \ ");" "href = 'javascript: void (0)" style = "text- Decoração:' title = 'none exibição ESTA entrada '> [+/-] </ a> </ td>
<Class = H3 <td> 'pós-título'> <a expr:href='data:post.url'> <data: post.title /> </ a> </ h3> </ td> </ tr > </ table>
class = "pós-corpo 'div expr: id =' dados: post.id" style = "display: none">
<P> <data: post.body /> </ p>
<Div style = "clear: both;" /> <! - claro para fotos flutua ->
</ Div>
</ Div>
</ B: includable>

 id = var = 'top'> 'main' <b: includable
<! - Mensagens ->
id = 'blog-posts "> <div
Valores = 'dados: posts' var = 'post'> <b: laço
<B: if = 'cond dados: post.dateHeader'>
> Class = 'data-header' <h2 <data: post.dateHeader /> </ h2>
</ B: if>
Dados cond = ': <b: se blog.pageType = "static_page">
== Cond = 'dados: data: blog.url'> dados '= cond: blog.pageType blog.homepageUrl
Dados cond = ': <b: se blog.pageType = "item">
name = 'PeekABooPost' /> <b: dados includable 'post' =
<B: else />
name = 'post' /> <b: includable = 'post' de dados
</ B: if>
<B: else />
name = 'post' /> <b: includable = 'post' de dados
</ B: if>

 [4] Usaremos prévia Antes de salvar , ENTÃO rápido Você DEVE Ser Visível APENAS Títulos pós precedido Por Um [+/-] na home page.


 "Se rápido Você já figado Aplicado o" Truque "NAS Páginas de etiquetas e acrescentamos also à página inicial do blog"

 [1] Localize este Pedaço de código:

 id = var = 'top'> 'main' <b: includable
<! - Mensagens ->
id = 'blog-posts "> <div
Valores = 'dados: posts' var = 'post'> <b: laço
<B: if = 'cond dados: post.dateHeader'>
> Class = 'data-header' <h2 <data: post.dateHeader /> </ h2>
</ B: if>

 Dados cond = ': <b: if blog.homepageUrl = dados: blog.url>
Dados cond = ': <b: se blog.pageType = "item">
name = 'PeekABooPost' /> <b: dados includable 'post' =
<B: else />
name = 'post' /> <b: includable = 'post' de dados
</ B: if>
<B: else />

 name = 'post' /> <b: includable = 'post' de dados

 </ B: if>

 [2] E em SEGUIDA, adicione uma parte Que ESTÁ destacada em Vermelho:

 id = var = 'top'> 'main' <b: includable
<! - Mensagens ->
id = 'blog-posts "> <div
Valores = 'dados: posts' var = 'post'> <b: laço
<B: if = 'cond dados: post.dateHeader'>
> Class = 'data-header' <h2 <data: post.dateHeader /> </ h2>
</ B: if>

 Dados cond = ': <b: if blog.homepageUrl = dados: blog.url>
Dados cond = ': <b: se blog.pageType = "item">
name = 'PeekABooPost' /> <b: dados includable 'post' =
<B: else />
name = 'post' /> <b: includable = 'post' de dados
</ B: if>
<B: else />

 == Cond = 'dados: data: blog.url'> dados '= cond: blog.pageType blog.homepageUrl
Dados cond = ': <b: se blog.pageType = "item">
name = 'PeekABooPost' /> <b: dados includable 'post' =
<B: else />
name = 'post' /> <b: includable = 'post' de dados
</ B: if>
<B: else />

 name = 'post' /> <b: includable = 'post' de dados

 </ B: if>
</ B: if>
em Fonte e Créditos:
http://elescaparatederosa.blogspot.com/search/label/Plantillas?updated-max=2009-01-08T02%3A56%3A00%2B01%3A00&max-results=20?max-results
Marcadores: , ,

veja como se faz:..."Gadget Nuvem de Tags Blogger"




Gadget Nuvem de Tags Blogger

"  Nuvem de Tags do Blogger está disponível. Para usa-lá basta ir à sua página “Layout”, clicar “Adicionar um Gadget” , opção “Marcadores” . Marcar opção “Cloud “(nuvem). Veremos também algumas possibilidades de personalização."

 image
"  Temos ainda a opção de exibir somente os títulos (tags) selecionados, clicando em “Marcadores Selecionados” e “Edit”..."
image
image
Personalizar a Nuvem de Tags – Parte 1
 
"  A nuvem vai ter a mesma configuração que você usa para seus para seus widgets, ou seja, cor das letras (links visitados) e margens, mas podemos mudar isso, por exemplo:
Centralizar a nuvem de marcadores.Veja"

 image
Para ter apenas esse efeito, é preciso colocar colocar um código simples dentro do seu documento HTML (folha de estilos).

 image
Dentro do HTML (folha de estilos) procure pelo seguinte:
]]></b:skin>
Copie o código abaixo e cole acima de dele:
.cloud-label-widget-content {text-align:center;}
"  Clic em VISUALIZAR, se estiver tudo bem, cic em SALVAR MODELO."
 
Personalizar a Nuvem de Tags – Parte 2
 
"   Podemos também, além de centralizar, mudar as cores dos títulos, espaçamento e efeito (hover) ao clicar. Veja (como a que estou usando na sidebar)"

image
"   Para isso o procedimento é um pouco mais complexo, mas nada difícil. Minha dica é que você use um template de testes para fazer as alterações."
 
Copie todo o código abaixo e cole em um bloco de notas para fazer mudanças. Consulte o site Paleta de Cores para pegar o código das cores escolhidas.
 
A Fonte pode ser: Verdana, Arial, Georgia, Times, Trebuchet .
<style type='text/css'>
/*--- Bloco que determina alinhamento (eu uso central)---*/

.cloud-label-widget-content {
text-align:center;
}
/*---Espaço entre linhas e links----*/
.cloud-label-widget-content span {
display: inline-table;
line-height: 1.2;
padding: 0 0 0 5px;
vertical-align: middle;
}
/*---Tipo da fonte (letra)---*/
.cloud-label-widget-content span a {
font-family: Verdana;
font: normal;
}
/*--- Cor do efeito ao passar o mouse---*/
.cloud-label-widget-content span a:hover {
color:#FFF !important;
}
/* --Propriedades de cada um dos 5 tamanhos de letra da nuvem-- */
.label-size-1 a {
color: #0066CC;
font-size: 11px;
}
.label-size-2 a {
color: #336699;
font-size: 13px;
}
.label-size-3 a {
color: #0099CC;
font-size: 14px;
}
.label-size-4 a {
color: #006699;
font-size: 17px;
}
.label-size-5 a {
color: #0099CC;
font-size: 20px;
} </style>
Muito bem, feitas as alterações, copie todo o código, va a sua folha de estilos e procure por <body> . Cole todo o código abaixo.

Clique em VISUALIZAR e se estiver tudo bem, clic em SALVAR MODELO.

Fonte:

Vagabundia

HTMHelen
fonte e créditos deste presente post:
Marcadores: , , ,

Aprenda como se faz:..."Mostrar / ocultar - Efeito suspenso"

Mostrar / ocultar - Efeito suspenso


Esta é uma técnica criada com CSS Desizntech pode ver o seu exemplo aqui. Achei muito interessante para ocultar o conteúdo, já que só precisa adicionar algumas linhas em folhas de estilo para usá-lo.
Depurando um código seria o suficiente para acrescentar um pouco
antes]]> </ B: skin> seguinte:

# Ul suspensa. Drop {
display: none;
}
# Dropdown ul: hover {Drop.
display: block;
padding-bottom: 10px;
}

"   Então, para onde queremos adicionar esse efeito seria algo como"   ...:

Aqui está o conteúdo inicial
<div id="dropdown"> <ul>Continuar a leitura<A class = "gota">
conteúdo oculto ...
</ A> </ ul> </ div>
Isto continua a nossa entrada.


"  Muitos pacotes de desktop publicação e editores de páginas web usam actualmente o Lorem Ipsum como o modelo de texto padrão, e pesquisa por "    lorem ipsum"   wil
"  Há muitas variações de passagens de Lorem Ipsum disponíveis, mas a maioria tem alguma alteração sofreu em formulário, pelo humor injetado, randomizados ou palavras."

Se em vez disso, adicione Ler uma imagem que pode substituir o texto "  Ler"    por 
 
<Img src = "url-de-imagem-"/>
 
Aqui está o conteúdo inicial
Isto continua a nossa entrada.

"  Nós podemos também adicionar alguns estilos para a tag span e em vez de "   leitura"   adicionar"
 
 
  <Span class = "span">Leia</ Span>
 
 
..."  e os seguintes estilos antes "
 
 
]]></ B: skin>
 
. Span {
border: solid # 333;
padding: 2px;
background: # fff;
color: # 333;
font-size: 12;
}
Aqui está o conteúdo inicial
Isto continua a nossa entrada.



fonte e créditos deste presente post:
Marcadores: ,
Assinar: Postagens (Atom)
 
|Template by ebds|http://vejatudosobre.blogspot.com.br/ |