Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
como criar esse widget?
2 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
como criar esse widget?
imagem no lado direito desse forum onde estao os membros da staff
http://www.fairytailrp.com/
passando o mouse sobre as fotos tem um movimento bem bacana eu gostaria de por isso em meu forum se possivel
grato
link do meu forum
http://legitspso.forumeiros.com/
http://www.fairytailrp.com/
passando o mouse sobre as fotos tem um movimento bem bacana eu gostaria de por isso em meu forum se possivel
grato
link do meu forum
http://legitspso.forumeiros.com/
Última edição por legit-nyck em 30.09.14 18:14, editado 1 vez(es)
Re: como criar esse widget?
Olá,
Crie um novo widget com este código
Até
Crie um novo widget com este código
- Código:
<div style="text-align: center;">
<br /><img style="border: 0px solid black; width: 140px; height: 232px;" src="http://i56.servimg.com/u/f56/18/84/98/25/staff110.png" id="showperson" align="middle" border="1" /> <br />
</div><script type="text/javascript">
<!--
// copyright 1998 Idocs, Inc. http://www.idocs.com/tags/
// Distribute this script freely, but please keep this
// notice with the code.
// var image information object
var mloi=new Object();
// set the image for swapping
function setswap()
{
if (! document.images)return;
var imgInfo=new Object();
imgInfo.defaultImg = new Image();
imgInfo.defaultImg.src = document.images[arguments[0]].src;
imgInfo.opts = new Object();
for (var i=1; i < arguments.length; i=i+2)
{
imgInfo.opts[arguments[i]]=new Image();
imgInfo.opts[arguments[i]].src = arguments[i+1];
}
mloi[arguments[0]] = imgInfo;
}
// set up the link for swapping
function swap(link,imgName,optName)
{
if (! document.images)return;
if (! link.swapReady)
{
link.imgName = imgName;
link.onmouseout = swapBack;
link.swapReady = true;
}
document.images[imgName].src=mloi[imgName].opts[optName].src;
}
function swapBack()
{document.images[this.imgName].src=mloi[this.imgName].defaultImg.src}
//-->
</script><script type="text/javascript">
setswap("showperson",
'Owner',
'http://i56.servimg.com/u/f56/18/84/98/25/staffl10.png',
'Hikaru',
'http://i56.servimg.com/u/f56/18/84/98/25/hikaru10.png',
'Luxin',
'http://i56.servimg.com/u/f56/18/84/98/25/luxin10.png',
'Javier',
'http://i56.servimg.com/u/f56/18/84/98/25/javier10.png',
'Manzo',
'http://i56.servimg.com/u/f56/18/84/98/25/manzo10.png',
'Tenshi',
'http://i56.servimg.com/u/f56/18/84/98/25/tenshi10.png',
'Mala',
'http://i39.servimg.com/u/f39/18/84/98/25/malaca10.png',
'Shin',
'http://i39.servimg.com/u/f39/18/84/98/25/shin-k10.png',
'Kinala',
'http://i39.servimg.com/u/f39/18/84/98/25/kinala10.png',
'Kazumi',
'http://i39.servimg.com/u/f39/18/84/98/25/kazumi10.png',
'Kaze',
'http://i39.servimg.com/u/f39/18/84/98/25/kaze10.png',
'Northot',
'http://i39.servimg.com/u/f39/18/84/98/25/northo10.png',
'Gevaudan',
'http://i39.servimg.com/u/f39/18/84/98/25/gevaud10.png',
'Jace',
'http://i39.servimg.com/u/f39/18/84/98/25/jace10.png',
'Yami',
'http://i39.servimg.com/u/f39/18/84/98/25/yami10.png',
'Vera',
'http://i39.servimg.com/u/f39/18/84/98/25/vera11.png',
'Sora',
'http://i56.servimg.com/u/f56/18/84/98/25/sora10.png');
//
</script>
<div style="text-align: center;">
<span style="font-size: x-small;">OWNER</span><br /><span style="font-size: x-small;"><a href="http://www.fairytailrp.com/u1" onmouseover="swap(this,'showperson','Owner')"><img src="http://i56.servimg.com/u/f56/18/84/98/25/u111.png" style="border: 0px black solid; height: 40px; width: 40px;" alt="Owner" border="0" /></a><br /></span>
<div style="font-size: x-small; text-align: center;">
<span style="font-size: x-small;">ADMINISTRATORS</span> <br /><a href="http://www.fairytailrp.com/u130" onmouseover="swap(this,'showperson','Luxin')"><img src="http://i56.servimg.com/u/f56/18/84/98/25/lux10.png" style="border: 0px black solid; height: 40px; width: 40px;" alt="Luxin" border="0" /></a> <a href="http://www.fairytailrp.com/u3510" onmouseover="swap(this,'showperson','Javier')"><img src="http://i56.servimg.com/u/f56/18/84/98/25/jav10.png" style="border: 0px black solid; height: 40px; width: 40px;" alt="Javier" border="0" /></a><a onmouseover="swap(this,'showperson','Tenshi')" href="http://www.fairytailrp.com/u2915"><img alt="Tenshi" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i56.servimg.com/u/f56/18/84/98/25/ten10.png" border="0" /></a> <br /> <span style="font-size: x-small;">GLOBAL MODERATORS</span><br /><a onmouseover="swap(this,'showperson','Manzo')" href="http://www.fairytailrp.com/u4898"><img alt="Manzo" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i56.servimg.com/u/f56/18/84/98/25/man10.png" border="0" /></a><a onmouseover="swap(this,'showperson','Kazumi')" href="http://www.fairytailrp.com/u3721"><img alt="Kazumi" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/kazu10.png" border="0" /></a> <a onmouseover="swap(this,'showperson','Sora')" href="http://www.fairytailrp.com/u1046"><img alt="Sora" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i56.servimg.com/u/f56/18/84/98/25/sor10.png" border="0" /></a>
<div style="font-size: x-small; text-align: center;">
<span style="font-size: x-small;">MODERATORS</span><br /><a onmouseover="swap(this,'showperson','Northot')" href="http://www.fairytailrp.com/u4183"><img alt="Northot" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/north10.png" border="0" /></a><a onmouseover="swap(this,'showperson','Gevaudan')" href="http://www.fairytailrp.com/u4641"><img alt="Gevaudan" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/gev10.png" border="0" /></a> <a onmouseover="swap(this,'showperson','Kinala')" href="http://www.fairytailrp.com/u4404"><img alt="Kinala" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/kina10.png" border="0" /></a>
<div style="font-size: x-small; text-align: center;">
<span style="font-size: x-small;"> JUNIOR MODERATORS</span><br /><a onmouseover="swap(this,'showperson','Shin')" href="http://www.fairytailrp.com/u1037"><img alt="Shin" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/shin10.png" border="0" /></a><a onmouseover="swap(this,'showperson','Mala')" href="http://www.fairytailrp.com/u2060"><img alt="Mala" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/mala10.png" border="0" /></a><br />
<div style="font-size: x-small; text-align: center;">
<span style="font-size: x-small;"> SUPPORT</span><br /><a onmouseover="swap(this,'showperson','Hikaru')" href="http://www.fairytailrp.com/u672"><img alt="Hikaru" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/hika10.png" border="0" /></a><a onmouseover="swap(this,'showperson','Jace')" href="http://www.fairytailrp.com/u5498"><img alt="Jace" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/jac10.png" border="0" /></a><a onmouseover="swap(this,'showperson','Yami')" href="http://www.fairytailrp.com/u11328"><img alt="Yami" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/yam10.png" border="0" /></a><a onmouseover="swap(this,'showperson','Vera')" href="http://www.fairytailrp.com/u11301"><img alt="Vera" style="border: 0px black solid; height: 40px; width: 40px;" src="http://i39.servimg.com/u/f39/18/84/98/25/ver10.png" border="0" /></a><br />
</div>
</div>
</div>
</div>
</div>
Até
Re: como criar esse widget?
xD agradecimentos adiantados pra vc mas tenho uma pergunta e as fotos da minha staff como vou inserir ?
Re: como criar esse widget?
Olá,
E só ir alterando o Link das imagens no código, por exemplo
No código tem este link "https://i.servimg.com/u/f56/18/84/98/25/staffl10.png", e só alterar pela imagem desejada.
Até
E só ir alterando o Link das imagens no código, por exemplo
No código tem este link "https://i.servimg.com/u/f56/18/84/98/25/staffl10.png", e só alterar pela imagem desejada.
Até
Tópicos semelhantes
» Como colocar esse widget?
» Como fazer esse Widget
» Como colocar esse widget
» Como colocar esse widget
» Como criar esse menu
» Como fazer esse Widget
» Como colocar esse widget
» Como colocar esse widget
» Como criar esse menu
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos