xTibia

.com
LI

[ Reprovado ]{Website} Texto Com Efeito De Onda

Por lipezinhoh, 13 de dez. de 2011 em Archived

efeitos
site
website
php
onda
animados
texto
tibia
script
otserv
5.0 (1)
5
1.1k
lipezinhohL
13 de dezembro de 2011 às 02:52

Ola pessoal vou compartilhar esse simples efeito de texto para que vocês adicione em seus sites.

 

ele vai ficar assim:

 

efeito.html

 

Para adicionar o efeito basta ir na basta do seu site htdocs/layouts/tibiacom e abre o arquivo layout.php e adicione o seguinte código:

 

<head>

 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 

<title>nome do seu serve</title>

 

 

 

<style>

 

#theDiv {

 

position : relative; z-index: 8; visibility : visible; align : center; color:#555555;

 

}

 

</style>

 

 

 

 

 

<script language="JavaScript">

 

 

 

function nextSize(i,incMethod,textLength)

 

{

 

if (incMethod == 1) { return (22*Math.abs(Math.sin(i/(textLength/3.14))) );

 

}

 

if (incMethod == 2) { return (255*Math.abs(Math.cos(i/(textLength/3.14))));

 

}

 

return(0)

 

}

 

function sizeCycle(text,method,dis)

 

{

 

var output = "";

 

for (i = 0; i < text.length; i++) {

 

size = parseInt(nextSize(i +dis,method,text.length));

 

output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";

 

}

 

if (document.all)

 

theDiv.innerHTML = output;

 

else if (document.getElementById){

 

rng = document.createRange();

 

el = document.getElementById('theDiv');

 

rng.setStartBefore(el);

 

htmlFrag = rng.createContextualFragment(output);

 

while (el.hasChildNodes()) el.removeChild(el.lastChild);

 

el.appendChild(htmlFrag);}

 

else if (document.layers){

 

 

 

document.theDiv.document.write("<font face='Verdana'point-size=11>"+output+"</font>");

 

document.theDiv.document.close();}

 

 

 

 

 

}

 

//coloque seu texto aqui

 

 

 

function doWave(n) {

 

var theText = 'BEM VINDO AO LENDARIOT!!!!';

 

 

 

 

 

sizeCycle(theText,1,n);

 

if (n > theText.length) {

 

n=0

 

}

 

setTimeout("doWave(" + (n+1) + ")", 50);

 

}

 

 

 

</script>

 

 

 

 

 

<body onload="doWave(0)">

 

 

 

 

 

<div ID="theDiv" align="center"></div>

 

</head>

 

 

 

<body>

 

 

 

</body>

 

</html>

 

 

texto em verde: aqui você pode colocar o nome do seu servidor exemplo o meu é lendariot eu deixei assim:

<title>lendariot</title>

 

 

texto em laranja: aqui você escolhe a cor que você coloca no texto segue a baixo uma pequena lista de cores:

 

position : relative; z-index: 8; visibility : visible; align : center; color:#FF9933CC;

 

 

OgAAAF0yiXUmm22xJx-821jtHBcR6ec2TnyjCQpuVDCCleryjXhVuakFQnCibs0c4svbdfBgkHU-cAdXh3ayLoJ_RocAm1T1UD6befxG38u87Ze7nBoVRLryV6np.jpg

 

 

texto em vermelho: digite o texto que quizer aqui onde está em vermelho como o exemplo a baixo:

 

 

var theText = 'digite seu texto!!!!';

 

 

 

somente isso!

eu vi um tópico parecido antes de postar mais a diferença que naquele a letra segue o mouse mais nesse efeito ele é fixado na tela.

caso tenha algum tópico parecido me avise eu coloco os créditos.

se gostou por favor comentem!

e muito obrigado.

Editado Dezembro 13 por lipeehhhh

SkyDangerousS
13 de dezembro de 2011 às 12:26

Seria mais facil você postar na seção de website.

Não seria bem um tutorial :(

lipezinhohL
13 de dezembro de 2011 às 17:23

bom a intenção desse post é ensinar as pessoas que não tem experiencia com website e deseja colocar algo diferente no site.

no caso tentei explicar da maneira mais simples e detalhado de como fazer isso.

no caso se for aprovado poderá ser movido para o tópico de tutorial de website. pois não tem muitos fóruns abertos no website, mas de qualquer forma agradeço pela participação com um comentário construtivo

Editado Dezembro 14 por lipeehhhh

1 mês depois...
Gabriel CoutoG
01 de janeiro de 2012 às 04:34

Reprovado, tente fazer melhor na próxima oportunidade!

Veja melhor como fazer um tutorial: http://www.xtibia.com/forum/topic/136176-formatao-aprenda-a-criar-um-bom-tutorial/

 

Movido Para a Seção Correta.

3 meses depois...
Gabriel CoutoG
15 de abril de 2012 às 16:20

Olá XTibiano!

 

Infelizmente, seu tutorial reprovado.

Procure por ajuda na seção de como formular um bom tutorial.

 

Grato pela atenção.

Movido.