Texto rolante, texto deslizando, texto móvel, subindo, fazer uma faixa de texto... Existem dezenas de modos de descrever o texto que se move na pagina, mas o código para fazer isso é o marquee.
O texto acima foi feito com o seguinte código:
<marquee behavior="alternate" width="400" height="50" scrolldelay="2" scrollamount="2" direction="left" onmouseover="this.stop()" onmouseout="this.start()">Coloque aqui seu texto! ! !</marquee>
Agora vamos entender como isso funciona:
behavior="alternate" o texto fica indo e voltando.
behavior="scroll" é o modo normal, o texto entra por um lado e sai pelo outro
behavior="slide" o texto entra e para quando chega ao final da linha.
scrolldelay="2"
scrollamount="2"
direction="left" é a direção que o texto se desloca, pode ser left(esquerda), right(direita), up(para cima) down(para baixo)
width="400" isso é a largura que o texto percorerá. Pode ser qualquer valor e para que ocupe tudo o espaço disponivel simplesmente apague essa parte do código.
height="50" o mesmo que width, mas esse controla a largura.
onMouseOver=this.stop() onMouseOut=this.start() e finalmente esta parte do código que faz com que o texto pare de movimentar quando o mouse está sobre ele.
Meus parabénsssssss!
ResponderExcluirTudo aqui é maravilhoso estou lendo cada detalhe e fazendo uso é claro..
Os efeitos MARQUEE, se usados com abuso, provavelmente vão irritar o leitor de seu blog, e faze-lo sair da página mais rápido do que deseja... Algo interessante que não foi incluido na postagem acima é inserir o código loop="1". No lugar de 1 deixe o número de vezes que você quer que o texto ou imagem com MARQUEE passe. Assim você pode fazer a mensagem passar uma vez apenas para não incomodar o leitor. Para conseguir uma mensagem de boas-vindas passando no lugar onde fica a navbar de seu blog vá em Layout-->Editar HTML-->Cole o código da "Marquee" desejada entre a tag /head e a /b:skin. Caso deseje, inclua o loop="1". Deste modo, enquanto sua página carrega, o leitor recebe a mensagem de boas-vindas passando no alto, e quando carregar a mensagem não mais passará. Dicas interessantes a respeito são dadas no site em inglês Tips-for-new-bloggers.
ResponderExcluirCumprimentos!
Olá Fabiano...queria saber como fazer para deixar imagens no lugar do texto, tipo, meus selos que recebo, awards...esses tipos...tem como? Rolantes....
ResponderExcluirveja aqui sobre banners deslizando
ResponderExcluirhttp://www.dicasparablogs.com.br/2008/03/banners-deslizando.html
mas o funcionamento é o mesmo só precisa trocar o texto pelo código das imagens
Ola,fabiano...Queria saber se da para fazer o texto só andar para a direita e não fazer o vai e volta...
ResponderExcluiré só trocar alternate por scroll, veja o inicio da postagem explicando sobre isso
ResponderExcluirFabiano!
ResponderExcluirQuero agradecer de coração este teu trabalho! Mais uma ferramenta que uso daqui em meu blog... ficou show de bola!
Eu que não sabia quase nada sobre códigos e afins... agora já sei um bocadito.
Valeu mesmo!!!
Abração.
pow bem legal mesmoo
ResponderExcluirvaleu
Eu troquei a frase "digite aqui seu texto" por varios codigos, quantos posts existe no blog e etc... se quiserem dar uma olhada: http://smasher-blog.blogspot.com/
ResponderExcluirObrigado pelas dicas...
Dicasparablogs cada vez mais melhorando as vidas dos bloggueiros :P
Obrigada pela dica!
ResponderExcluirA frase ficou bem legal no meu blog...Valeu!
Aonde eu devo colar esse código marquee?
ResponderExcluirObrigado.
Junior.
adicione um gadget de html/javascript
ResponderExcluirOi Fabiano. É o seguinte: eu queria o texto deslizando entre o cabeçalho e a barra ou logo após a barra, mas nestes campos não tem a opção de adicionar um gadget, como há na barra lateral e no roda-pé. Como faço?
ResponderExcluirObrigado.
depois que adicionar o gadget arraste até o lugar que deseja
ResponderExcluirFabiano,
ResponderExcluirVocê é o cara!
Valeu.
Bjs,
lu.
Fabiano... Faltou a opção "deslizar para cima"
ResponderExcluirQual é o código para deslizar para cima?
Beijinho!
para fazer o texto deslizar para cima apague o direction="left" e coloque direction="up"
ResponderExcluirParabéns meu querido, ótimas dicas venho conhecendo através de você.
ResponderExcluirÓtimo trabalho!
Vlw cara me ajudou mt abraços !
ResponderExcluirCaro Fabiano, tem algum problema em colocar o texto deslizante numa gadget em cima do nome da postagem?
ResponderExcluirTipo, não vai afetar meu posicionamento no mecanismos de pesquisa do google ou atrapalhar nas indexações do google em minhas novas postagens?
Roberto
ResponderExcluirvocê pode colocar o gadget com o texto deslizante onde quiser...
mas para colocar esse feito no titulo da postagem será fazer adaptações para ver se realmente funciona... ainda não tenho um tutorial sobre o assunto
Obrigado Fabiano, vc esta sempre ajudando o pessoal e isso adimiro muito em vc, abraços.
ResponderExcluirFABIANO- O CODIGO DO TEXTO DESLIZANDO TA TRAVADO,SO FUNCIONA NO MODO SCROLL,OS OUTROS TAO PARADO,PQ SERA,
ResponderExcluirvocê deve ter alterado algo errado no código ou apagado algum sinal " por exemplo...
ResponderExcluirele funciona em todas as versões... mas pode demorar um pouco para carregar(iniciar a rolagem)
BLZA-SO QUE FUNCIONAVA O TEXTO DESLIZANDO,E PARO DE VEZ TODOS QUE EU COLOQUEI SEM EU MUDAR NADA ,ATE O TEU EXEMPLO AI ACIMA TRAVO,OLHA AI,SE PUDER AJUDAR MUITO OBRIGADO ABRAÇO
ResponderExcluirEU VI OUTROS QUE USAVAME ESSE CODIGO E NO DELES TA PARADO TB,COMO DISSE,SO SCROLL FUNCIONA
se usou em varias partes do blog talvez esse seja o motivo do erro, quando mais códigos diferente mais chances da pagina dar erro ou travar...
ResponderExcluirFabiano tem como trocar a cor do texto e o tamanho da fonte? no meu blog ficou com letra branca e eu queria um pouco maior do que esta agora, desde já agradeço!
ResponderExcluirjessica
ResponderExcluiresse código não altera a cor das letras do seu blog... ou seja ele segue a formação como se fosse um texto normal, mas pode colocar assim o código e fazer sua formataçao
Como Formatar o Texto do Blog
<div style="font-family:'Comic Sans MS', cursive; font-size:16pt; color:#00F"><marquee behavior="alternate" width="400" height="50" scrolldelay="2" scrollamount="2" direction="left" onmouseover="this.stop()" onmouseout="this.start()">Coloque aqui seu texto! ! !</marquee></div>
Valeu parceiro, você estar de parabéns pelo seu trabalho. Para iniciantes como eu você é muito importante. Você não sabe o quanto nos ajuda ter pessoas assim para nos ensinar. Obrigado.
ResponderExcluirMinha pergunta não tem nada a ver com a dica.
ResponderExcluirmais eu queria saber como por um player'zinho'
do Windows Media Player no meu blog
As únicas coisas que eu sei é que você bota a musica do seu computador pelo Player do computador e a musica sai no player do blog.
Como quando eu colo o código e aperto PLAY
fala que precisa de um Plugin mais eu não sei achar...Me ajuda?
geralmente os sites de musica já fornecem o código completo sem precisar instalar nada no blog
ResponderExcluirse aparece algum aviso de plugin no seu blog por causa da musica é melhor achar a musica em outro site.
a maioria dos visitantes vai sair do seu blog quando receber um aviso de plugin
Ótimas dicas para blogueiros, Fabiano Roberto. Tenho uma pergunta: o texto deslizante tem um limite de tamanho? Posso colocar uma relação de nomes de personalidades homenageando-as, por exemplo?
ResponderExcluirAluizio Moreira
ResponderExcluiracho que não tem limite
Eu coloquei um Link. Como eu faço pra que apareça o efeito quando as pessoas passam o mouse por cima do Link?
ResponderExcluirEx: Quando eu passo o mouse em um de seus marcadores, aparece um efeito indicando qual Link que irei clicar...
veja aqui Efeitos em links (sublinhado, sobrelinha, tachado)
ResponderExcluirFuncionou perfeitamente, mas como eu faço isso com os marcadores?? Pra que quando clicarem no nome os marcadores deslizem pra baixo?
ResponderExcluirEu vi em um blog, do mesmo jeito que está ai, só que com postagens populares se eu nao me engano. Onde acho isso?
ResponderExcluirlucas theodorico
ResponderExcluirveja esse link: Fazer Apresentação de Slides no Blogger com as Postagens Recentes
Vlw^^ Ae!
ResponderExcluirPrezado Fabiano,
ResponderExcluirComo faço para colocar texto rolante sem perder a configuração:
Por exemplo:
Santos x São Paulo
Palmeiras x Corinthians
Flamengo x Vasco
quando coloco em html, ele aparece desconfigurado, um do lado do outro, mesmo colocando "up"
Rogério coloque um < br / > para mudar de linha, assim:
ResponderExcluirSantos x São Paulo< br / >
Palmeiras x Corinthians< br / >
Flamengo x Vasco
no ultimo item da lista não há necessidade de colocar
Como eu Faço para que o texto não pare de rolar... tipo, um texto atrás do outro saindo de um lado e aparecendo no outo lado sem intervalos de texto?
ResponderExcluirpara deixar o teste deslizando sem parar o código é o
ResponderExcluirbehavior="scroll"
Desculpe Fabiano, mais você não entendeu a minha duvida.
ResponderExcluirEu quero saber, se tem como fazer com que este teste fique passando (Entrando em um lado e saído no outro) emendado as frases de inicio com o final, passando sem ter intervalo.
É que colei este teste no cabeçalho do meu Blog, mais o texto só inicia novamente depois que as outras palavras sumiram totalmente no outro lado.
Tem como colocar ele (tipo um circulo imaginário) onde as palavras passam sem intervalos de tempo... sem ter que esperar as palavras sumir por completo para aparecer novamente?
acho que não tem como retirar esse intervalo que aparece entre o final e o recomeço da lista de frases
ResponderExcluirFantastic!
ResponderExcluirFabiano...
ResponderExcluirComo faço para o texto movimentar mais rápido?
altere o numero 2 nestes trechos:
Excluirscrolldelay="2" scrollamount="2"
Valeu Fabiano.
ExcluirBrigadim!
Caro Fabiano, como faço pra colocar títulos de postagens deslizantes, de modo que, quando colocar o mouse sobre o título ele para, em seguida eu clico e ele me manda para o texto correspondente àquele título, isto é, pra página onde ele se encontra. Pode me ajudar? Grato
ResponderExcluiré o mesmo código de qualquer link, por exemplo:
Excluir< a href='http://www.dicasparablogs.com.br/2007/05/texto-deslizando.html' >Texto deslizando< /a >
coloque este código no lugar do texto deslizante e deve funcionar normalmente
Valeu, Fabiano, vou tentar. Abração
Excluiralguém pode me ajudar , quero colocar um gerador de nicks personalizado no meu site HELPPP
ResponderExcluirinfelizmente não tenho código para gerador de nicks
ResponderExcluir