Novidades em forma de imagem, tipo o top 5 do forum

[slaider]

Qual é minha questão:
Fala galera o/

e agora eu preciso de mais um codigo hehe

^ o codigo acima eu tenho, porem esta dando erro
eu gostaria de um codigo q tenha apenas as imagens trocando, tipo o top 5 aqui do forum so q um pouco mais complexo

alguem teria ? vlw

Endereço do meu fórum:
http://over-design.vampire-legend.net

Versão do fórum:
PHPBB3

[Sennior]

Saudações!

Mas o mesmo é para por onde? Sobre os Widgets?
Ao mais leia:

https://ajuda.forumeiros.com/-t13791.htm

Até mais!

[slaider]

nao nao, eu quero pra um experimento meu, so preciso de um codigo funcional q troque as imagens de segundos em segundos e que de uma opção de numeros (1,2,3,4,5 tipo o top 5 aqui ds foruns) porem mais complexo q esse aqui do forum
esse tutorial ai nao é o que procuro

[Sennior]

Saudações!

Então deseja que seja no Widget?

[Don Corleone]

Acho que ele quer uma página Html amigo.

como neste fórum,

http://narutovirus.ativoforum.com/forum

[Gmtp]

Olá,

Negativo, Gente ele quer que as novidades do fórum dele apareça em scroll em um widget, É isso ?

Até mais

[slaider]

sim eu quero o codigo de algum scroll, o desse site ae q o houdini passou é uma boa, se alguem tiver o codigo dele hehe

[Don Corleone]

Aqui meu caro:

Painel de Controle Visualização Geral Mensagem da Página Inicial e coloque o código abaixo e salve. Depois só modificar as imagens e os links.

Código:


<script>var counts = 5;
 img1 = new Image();
 img1.src = 'http://i76.servimg.com/u/f76/18/13/12/36/rpg_ba10.png';
 img2 = new Image();
 img2.src = 'http://i73.servimg.com/u/f73/17/65/69/87/12010.gif';
 img3 = new Image();
 img3.src = 'http://imageshack.us/a/img407/5026/parcyq.jpg';
 img4 = new Image();
 img4.src = 'http://imageshack.us/a/img407/5026/parcyq.jpg';
 img5 = new Image();
 img5.src = 'http://imageshack.us/a/img407/5026/parcyq.jpg';
 var smallImg = new Array();
 smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
 smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
 smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
 smallImg[3] = 'http://i.imgur.com/j9q7B.png';
 smallImg[4] = 'http://i.imgur.com/mzFKQ.png';

 url1 = 'http://pokemonsupremo.forumbrasil.net/';
 url2 = 'http://somosmugiwara.forumeiros.com';
 url3 = '#';
 url4 = '#';
 url5 = '#';
 alt1 = new Image();
 alt1.alt = 'Mind Design';
 alt2 = new Image();
 alt2.alt = 'Seja Nosso parceiro';
 alt3 = new Image();
 alt3.alt = 'Seja Nosso parceiro';
 alt4 = new Image();
 alt4.alt = 'Seja Nosso parceiro';
 alt5 = new Image();
 alt5.alt = 'Seja Nosso parceiro';
 var nn = 1;
 var key = 0;
 function change_img() {
 if (key == 0) {
 key = 1;
 } else if (document.all) {
 document.getElementById("pic").filters[0].Apply();
 document.getElementById("pic").filters[0].Play(duration = 6);
 }
 eval('document.getElementById("pic").src=img' + nn + '.src');
 eval('document.getElementById("url_theme").href=url' + nn);
 eval('document.getElementById("pic").alt=alt' + nn + '.alt');
 if (nn == 1) {
 document.getElementById("url_theme").target = "_blank";
 document.getElementById("url_theme").style.cursor = "pointer";
 } else {
 document.getElementById("url_theme").target = "_blank"
 document.getElementById("url_theme").style.cursor = "pointer"
 }
 for ( var i = 1; i <= counts; i++) {
 document.getElementById("xxjdjj" + i).className = 'axx';
 }
 document.getElementById("xxjdjj" + nn).className = 'bxx';
 nn++;
 if (nn > counts) {
 nn = 1;
 }
 tt = setTimeout('change_img()', 4000);
 }
 function changeimg(n) {
 nn = n;
 window.clearInterval(tt);
 change_img();
 }
 function ImageShow() {
 document.write('<div class="picshow_main">');
 document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
 document.write('<div class="picshow_change">');
 for ( var i = 0; i < counts; i++) {
 document.write('<a href="javascript:changeimg(' + (i + 1)
 + ');" id="xxjdjj' + (i + 1)
 + '" class="axx" target="_self"><img src="' + smallImg[i]
 + '"></a>');
 }
 document.write('</div></div>');
 change_img();
 }</script><script>ImageShow()</script> <span class="corners-bottom"><span></span></span></div></div></counts></center></div></div></td><td valign="top" width="60%"><div class="module main"><div class="main-head"><div class="h3">Slide</div></div><div class="main-content clearfix"><html>
<title> </title>
<head>
<link href='http://arquivos.homehots.net/js/SimpleSlide/css/simpleslide.css' rel='stylesheet' type='text/css'/>
<script src='http://arquivos.homehots.net/js/SimpleSlide/js/jquery.js' type='text/javascript'></script>
<script src='http://arquivos.homehots.net/js/SimpleSlide/js/jquery.simpleSlide.js' type='text/javascript'></script>
<script src='http://arquivos.homehots.net/js/SimpleSlide/js/sitejs.js' type='text/javascript'></script>
<style type="text/css">
/* s3slider
----------------------------------------------- */
#s3slider {
width: 540px; /* largura total do slide*/
height: 300px; /* altura total do slide*/
position: relative; /* important */
overflow: hidden; /* important */
}
#s3sliderContent {
width: 540px; /* importante que as imagens devem ter a mesma largura ou mais */
position: absolute; /* important */
top: 0; /* important */
padding: 0px;
margin-left: 0; /* important */
}
.s3sliderImage {
float: left; /* important */
position: relative; /* important */
display: none; /* important */
}
.s3sliderImage span {
position: absolute; /* important */
left: 0;
font: 15px/20px Arial, Helvetica, sans-serif;
padding: 30px 13px;
width: 640px;
background-color: #000; /*cor de fundo do slide*/
filter: alpha(opacity=70); /* here you can set the opacity of box with text */
-moz-opacity: 0.7; /* here you can set the opacity of box with text */
-khtml-opacity: 0.7; /* here you can set the opacity of box with text */
opacity: 0.7; /* here you can set the opacity of box with text */
color: #fff;
display: none; /* important */
bottom: 0;
/*
Nesta última linha em negrito, determina se a caixa de texto aparecerá na parte superior ou inferior das imagens
top: 0; -> a caixa de texto aparecerá na parte superior
si ponemos
bottom: 0; -> a caixa de texto aparecerá na parte inferior
*/
}
.clear {
clear: both;
}
#slider-wrapper {
background:url(http://3.bp.blogspot.com/-5a4HgOqKh6o/TlKOm3ZYdDI/AAAAAAAAE7s/hvtXoERSo7s/s1600/loading.gif) no-repeat;
width:540px;
height:300px;
margin:0 auto;
padding-top:74px;
margin-top:50px;
}
#slider {
position:relative;
width:540px;
height:300px;
margin-left:0px;
border 1px solid #000000;
background:url(http://3.bp.blogspot.com/-5a4HgOqKh6o/TlKOm3ZYdDI/AAAAAAAAE7s/hvtXoERSo7s/s1600/loading.gif) no-repeat 50% 50%;
box-shadow: 6px 0px 25px -2px #000000, -6px 0px 25px -2px #000000;
}
#slider img {
position:absolute;
top:0px;
left:0px;
display:none;
}
#slider a {
border:0;
display:block;
}
.nivo-controlNav {
position:absolute;
left:220px;
bottom:25px;
}
.nivo-controlNav a {
display:block;
width:22px;
height:22px;
background:url(http://4.bp.blogspot.com/-FmV66aYwEP4/TlKOmRAvVnI/AAAAAAAAE7o/b6jArWv6hc8/s1600/bullets.png) no-repeat;
text-indent:-9999px;
border:0;
margin-right:3px;
float:left;
}
.nivo-controlNav a.active {
background-position:0 -22px;
}
.nivo-directionNav a {
display:block;
width:30px;
height:30px;
background:url(http://2.bp.blogspot.com/-gqq2M5VJD1k/TlKOl9jc3SI/AAAAAAAAE7k/tDMFuwOGExA/s1600/arrows.png) no-repeat;
text-indent:-9999px;
border:0;
}
a.nivo-nextNav {
background-position:-30px 0;
right:15px;
}
a.nivo-prevNav {
left:15px;
}
.nivo-caption {
text-shadow:none;
font-family: Helvetica, Arial, sans-serif;
}
.nivo-caption a {
color:#efe9d1;
text-decoration:underline;
}
/* The Nivo Slider styles */
.nivoSlider {
position:relative;
}
.nivoSlider img {
position:absolute;
top:0px;
left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:0;
padding:0;
margin:0;
z-index:6;
display:none;
}
/* The slices and boxes in the Slider */
.nivo-slice {
display:block;
position:absolute;
z-index:5;
height:100%;
}
.nivo-box {
display:block;
position:absolute;
z-index:5;
}
/* Caption styles */
.nivo-caption {
position:absolute;
left:0px;
bottom:0px;
background:#000;
color:#fff;
opacity:0.8; /* Overridden by captionOpacity setting */
width:100%;
z-index:8;
}
.nivo-caption p {
padding:5px;
margin:0;
}
.nivo-caption a {
display:inline !important;
}
.nivo-html-caption {
display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
position:absolute;
top:45%;
z-index:9;
cursor:pointer;
}
.nivo-prevNav {
left:0px;
}
.nivo-nextNav {
right:0px;
}
.nivo-directionNav a {
display:block;
width:30px;
height:30px;
background:url(http://2.bp.blogspot.com/-gqq2M5VJD1k/TlKOl9jc3SI/AAAAAAAAE7k/tDMFuwOGExA/s1600/arrows.png) no-repeat;
text-indent:-9999px;
border:0;
}
a.nivo-nextNav {
background-position:-30px 0;
right:15px;
}
a.nivo-prevNav {
left:15px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
position:relative;
z-index:9;
cursor:pointer;
}
.nivo-controlNav a.active {
font-weight:bold;
}
.nivo-controlNav a {
display:block;
width:22px;
height:22px;
background:url(http://4.bp.blogspot.com/-FmV66aYwEP4/TlKOmRAvVnI/AAAAAAAAE7o/b6jArWv6hc8/s1600/bullets.png) no-repeat;
text-indent:-9999px;
border:0;
margin-right:3px;
float:left;
}

</style>
</head>
<body><div id="setting_up" class="left" rel="green">
    <div class="slideshow">
    <div class="left-button left" rel="1" ></div>

      <div class="simpleSlide-window left" rel="1">
        <div class="simpleSlide-tray" rel="1" >
                              <div class="simpleSlide-slide" rel="1" alt="1">
              <a href="#" target="_blank">
                  <div style="background-image: url(http://i.imgur.com/lZIwJO4.png)">
                    <p>RPG Baseado no anime naruto, Naruto Virus "se espalha rapido" </p>
                  </div>
              </a>
            </div>

                                <div class="simpleSlide-slide" rel="1" alt="1">
              <a href="http://narutovirus.ativoforum.com/f1-regrasafins" target="_blank">
                  <div style="background-image: url(http://i.imgur.com/JkV8EBx.png)">
                    <p>Leia as regras antes de mais nada.!</p>
                  </div>
              </a>
            </div>
                                <!------------------------------------------------------------->
                                <div class="simpleSlide-slide" rel="1" alt="1"><!-- Vence 11/01/2013-->
              <a href="http://www.richardstn1.wix.com/extremezombie" target="_blank">
                  <div style="background-image: url('http://i.imgur.com/ABxLAot.png')">
<p>Abertas Vaga para kage's , corra é por tempo limitado.</p>
                  </div>
              </a>
            </div>
                                <!------------------------------------------------------------->
                                <div class="simpleSlide-slide" rel="1" alt="1"><!-- Vence 11/01/2013-->
              <a href="#" target="_blank">
                  <div style="background-image: url('http://img19.imageshack.us/img19/7694/serv4i.jpg')">
<p>GM exclusivo/Admins Competentes/Sistema No Lag/29 Orgs</p>
                  </div>
              </a>
            </div>
                                <!------------------------------------------------------------->
                                <div class="simpleSlide-slide" rel="1" alt="1"><!-- Vence 07/01/2013-->
              <a href="#" target="_blank">
                  <div style="background-image: url('http://img22.imageshack.us/img22/3778/anuncieaquigb.jpg')">
<p>Tenha o banner do seu servidor aqui na Style Games!</p>
                  </div>
              </a>
            </div>
                                <!------------------------------------------------------------->
            <div class="simpleSlide-slide" rel="1" alt="">
              <a href="#" target="_blank">
                  <div style="background-image: url(http://img22.imageshack.us/img22/3778/anuncieaquigb.jpg)">
<p>Tenha o banner do seu servidor aqui na Style Games!</p>
                  </div>
              </a>
            </div>

        </div>
      </div><div class="right-button left" rel="1"></div>
    </div>
  <div class="auto-slider" rel="1"></div>
</div>
</body>
</html></div></div>