Qual é minha questão:
Como fazer um slide assim. 

Endereço do fórum que eu vi:
http://www.habbsea.com/

Versão do fórum:
PHPBB2

Olá!
Veja este tópico:
[TUTORIAL] Slides em widgets

Até mais.

Bruno eu queria exatamente igual, menos as imagens

Olá!
Poderia me mandar o link do fórum onde viu isso?

kkk você pediu uma coisa difícil hein. O site tem um código que bloqueia o botão direito, o atalho Alt + W e tals porém eu usei Alt + S, salvei a página e depois achei o código fonte. O código referente a esse widget é esse:

Código:

<div class="h3">Slides [EM MANUTENÇÃO]</div><div style="width:370px;">
  <div class="slider-wrapper theme-default">
      <div class="ribbon">
      </div>
      <div id="nivoslider-125" class="nivoSlider" style="width: 300px; height: 187px; position: relative; background-image: url(http://i.imgur.com/oRrGc.png); background-position: initial initial; background-repeat: no-repeat no-repeat;">
        <a href="http://www.habbsea.com/t648-loteria-habbsea-edicao-3-natal-01" class="nivo-imageLink" style="display: none;"><img src="./Habbsea - Feliz Natal a todos habbseanos!_files/49ksT.png" title="#nivoslider-125-caption-0" alt="" style="display: none;"></a>
                        <img src="./Habbsea - Feliz Natal a todos habbseanos!_files/oRrGc.png" alt="" style="display: none;">
                        <img src="./Habbsea - Feliz Natal a todos habbseanos!_files/fje20.png" alt="" style="display: none;">
<a href="http://www.habbsea.com/t686-int-novo-jogo-no-gamecenter-a-caminho" class="nivo-imageLink" style="display: none;"><img src="./Habbsea - Feliz Natal a todos habbseanos!_files/fBNum.png" title="#nivoslider-125-caption-1" alt="" style="display: none;"></a>

Certamente se você colocar ele assim não vai funcionar, então pelo menos tente, se não funfar vai servir de ajuda para outros usuários lhe fornecer o código correto

Aqui estar o código que eles usa:

Código:

<div style="width:370px;">
  <div class="slider-wrapper theme-default">
      <div class="ribbon">
      </div>
      <div id="nivoslider-125" class="nivoSlider" style="width:300px;height:187px;">
        <a href='http://www.habbsea.com/t648-loteria-habbsea-edicao-3-natal-01'><img src="http://i.imgur.com/49ksT.png" title="#nivoslider-125-caption-0" alt=""/></a>
                        <img src="http://i.imgur.com/oRrGc.png" alt=""/>
                        <img src="http://i.imgur.com/fje20.png" alt=""/>
<a href='http://www.habbsea.com/t686-int-novo-jogo-no-gamecenter-a-caminho'><img src="http://i.imgur.com/fBNum.png" title="#nivoslider-125-caption-1" alt=""/></a>
      </div>
  </div>
  <div id="nivoslider-125-caption-0" class="nivo-html-caption">
      Jogue na Loteria Habbsea, edição de Natal.
  </div><div id="nivoslider-125-caption-1" class="nivo-html-caption">
      Conheça o novo jogo do Habbo Hotel.
  </div>
      <script type="text/javascript">jQuery(window).load(function(){jQuery("#nivoslider-125").nivoSlider({effect:"random",slices:15,boxCols:8,boxRows:4,animSpeed:500,pauseTime:3000,startSlide:0,directionNav:true,directionNavHide:true,controlNav:true,controlNavThumbs:false,controlNavThumbsFromRel:true,keyboardNav:true,pauseOnHover:true,manualAdvance:false});});</script></div></div></div> </td><td align="left"><div class="module" style="width:435px; height:260px;"><div class="inner"><span class="corners-top"><span></span></span>

Não funcionou nenhum dos 2 '-' preciso do css/javascript.

Olá!

Utilize esse código CSS:

Código:

.nivoSlider { position: relative; } .nivoSlider img { position: absolute; top: 0; left: 0; } .nivoSlider a.nivo-imageLink { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; padding: 0; margin: 0; z-index: 6; display: none; } .nivo-slice { display: block; position: absolute; z-index: 5; height: 100%; } .nivo-box { display: block; position: absolute; z-index: 5; } .nivo-caption { position: absolute; left: 0; bottom: 0; background: #000; color: #fff; opacity: .8; width: 300px; z-index: 8; } .nivo-caption p { padding: 5px; margin: 0; } .nivo-caption a { display: inline!important; } .nivo-html-caption { display: none; } .nivo-directionNav a { position: absolute; z-index: 9; cursor: pointer; } .nivo-prevNav { left: 0; } .nivo-nextNav { right: 0; } .nivo-controlNav a { position: relative; z-index: 9; cursor: pointer; } .nivo-controlNav a.active { font-weight: bold; } .theme-default .nivoSlider { background: #fff url(http://i46.servimg.com/u/f46/15/66/68/20/loadin10.gif) no-repeat 50% 50%; -webkit-box-shadow: 0 1px 5px 0 #4a4a4a; -moz-box-shadow: 0 1px 5px 0 #4a4a4a; box-shadow: 0 1px 5px 0 #4a4a4a; } .theme-default .nivoSlider img { position: absolute; top: 0; left: 0; display: none; } .theme-default .nivoSlider a { border: 0; display: block; } .theme-default .nivo-controlNav { position: absolute; bottom: -42px; margin-left: -40px; left: 50%; } .theme-default .nivo-controlNav a { display: block; width: 22px; height: 22px; background: url(http://i46.servimg.com/u/f46/15/66/68/20/bullet10.png) no-repeat; text-indent: -9999px; border: 0; margin-right: 3px; float: left; } .theme-default .nivo-controlNav a.active { background-position: 0 -22px; } .theme-default .nivo-directionNav a { display: block; width: 30px; height: 30px; background: url(http://i46.servimg.com/u/f46/15/66/68/20/arrows10.png) no-repeat; text-indent: -9999px; border: 0; bottom: 20px; } .theme-default a.nivo-nextNav { background-position: -30px 0; right: 15px; } .theme-default a.nivo-prevNav { left: 15px; } .theme-default .nivo-caption { font-family: Helvetica,Arial,sans-serif; } .theme-default .nivo-caption a { color: #fff; border-bottom: 1px dotted #fff; } .theme-default .nivo-caption a:hover { color: #fff; }

Aqui está o HTML:

Código:

<table><tbody><tr><td align="left"><div class="module" style="width:300px; height:260px;"><div class="inner"><span class="corners-top"><span></span></span><div class="h3">Slides [EM MANUTENÇÃO]</div><div style="width:370px;">
  <div class="slider-wrapper theme-default">
      <div class="ribbon">
      </div>
      <div id="nivoslider-125" class="nivoSlider" style="width: 300px; height: 187px; position: relative; background-image: url(http://i.imgur.com/oRrGc.png); background-position: initial initial; background-repeat: no-repeat no-repeat;">
        <a href="http://www.habbsea.com/t648-loteria-habbsea-edicao-3-natal-01" class="nivo-imageLink" style="display: none;"><img src="http://i.imgur.com/49ksT.png" title="#nivoslider-125-caption-0" alt="" style="display: none;"></a>
                        <img src="http://i.imgur.com/oRrGc.png" alt="" style="display: none;">
                        <img src="http://i.imgur.com/fje20.png" alt="" style="display: none;">
<a href="http://www.habbsea.com/t686-int-novo-jogo-no-gamecenter-a-caminho" class="nivo-imageLink" style="display: none;"><img src="http://i.imgur.com/fBNum.png" title="#nivoslider-125-caption-1" alt="" style="display: none;"></a>
      <div class="nivo-caption" style="opacity: 0.8; display: none;"><p style="display: block; opacity: 1;">
      Jogue na Loteria Habbsea, edição de Natal.
  </p></div><div class="nivo-directionNav" style="display: none;"><a class="nivo-prevNav">Prev</a><a class="nivo-nextNav">Next</a></div><div class="nivo-controlNav"><a class="nivo-control" rel="0">1</a><a class="nivo-control" rel="1">2</a><a class="nivo-control active" rel="2">3</a><a class="nivo-control" rel="3">4</a></div><div class="nivo-box" style="opacity: 0; left: 0px; top: 0px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: 0px 0px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0; left: 38px; top: 0px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -38px 0px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0; left: 76px; top: 0px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -76px 0px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.30778788831140963; left: 114px; top: 0px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -114px 0px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.6823083851409856; left: 152px; top: 0px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -152px 0px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.9964413022849068; left: 190px; top: 0px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -190px 0px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 228px; top: 0px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -228px 0px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 266px; top: 0px; width: 34px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -266px 0px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0; left: 0px; top: 47px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: 0px -47px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0; left: 38px; top: 47px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -38px -47px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.30778788831140963; left: 76px; top: 47px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -76px -47px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.7660540380791945; left: 114px; top: 47px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -114px -47px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.9964413022849068; left: 152px; top: 47px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -152px -47px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 190px; top: 47px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -190px -47px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 228px; top: 47px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -228px -47px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 266px; top: 47px; width: 34px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -266px -47px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0; left: 0px; top: 94px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: 0px -94px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.30778788831140963; left: 38px; top: 94px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -38px -94px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.7660540380791945; left: 76px; top: 94px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -76px -94px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.9964413022849068; left: 114px; top: 94px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -114px -94px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 152px; top: 94px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -152px -94px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 190px; top: 94px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -190px -94px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 228px; top: 94px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -228px -94px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 266px; top: 94px; width: 34px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -266px -94px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.30778788831140963; left: 0px; top: 141px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: 0px -141px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.7660540380791945; left: 38px; top: 141px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -38px -141px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 0.9964413022849068; left: 76px; top: 141px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); overflow: hidden; background-position: -76px -141px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 114px; top: 141px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -114px -141px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 152px; top: 141px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -152px -141px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 190px; top: 141px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -190px -141px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 228px; top: 141px; width: 38px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -228px -141px; background-repeat: no-repeat no-repeat;"></div><div class="nivo-box" style="opacity: 1; left: 266px; top: 141px; width: 34px; height: 47px; background-image: url(http://i.imgur.com/fje20.png); background-position: -266px -141px; background-repeat: no-repeat no-repeat;"></div></div>
  </div>
  <div id="nivoslider-125-caption-0" class="nivo-html-caption">
      Jogue na Loteria Habbsea, edição de Natal.
  </div><div id="nivoslider-125-caption-1" class="nivo-html-caption">
      Conheça o novo jogo do Habbo Hotel.
  </div>
      <script type="text/javascript">jQuery(window).load(function(){jQuery("#nivoslider-125").nivoSlider({effect:"random",slices:15,boxCols:8,boxRows:4,animSpeed:500,pauseTime:3000,startSlide:0,directionNav:true,directionNavHide:true,controlNav:true,controlNavThumbs:false,controlNavThumbsFromRel:true,keyboardNav:true,pauseOnHover:true,manualAdvance:false});});</script></div></div></div> </td><td align="left"><div class="module" style="width:435px; height:260px;"><div class="inner"><span class="corners-top"><span></span></span><div class="h3">Habbo Hotel: Últimas notícias</div><div id="get"><ul><li class="get"> <a href="/t695-int-novos-icones-hospedados"><font color="#FFF"></font><img src="http://i43.servimg.com/u/f43/16/73/94/18/tinyic10.gif">      <font color="#000"><b>[INT] Novos ícones hospedados.</b></font></a>  <span class="getAutor"> por <a href="/u82">      Layed</a></span> </li><li class="get"> <a href="/t686-int-novo-jogo-no-gamecenter-a-caminho"><font color="#FFF"></font><img src="http://i43.servimg.com/u/f43/16/73/94/18/tinyic10.gif">      <font color="#000"><b>[INT] Novo jogo no gamecenter a caminho!</b></font></a>  <span class="getAutor"> por <a href="/u82">      Layed</a></span> </li><li class="get"> <a href="/t684-int-novos-mobis-natalinos"><font color="#FFF"></font><img src="http://i43.servimg.com/u/f43/16/73/94/18/tinyic10.gif">      <font color="#000"><b>[INT] Novos mobis natalinos.</b></font></a>  <span class="getAutor"> por <a href="/u82">      Layed</a></span> </li><li class="get"> <a href="/t656-int-paul-revela-novidades"><font color="#FFF"></font><img src="http://i43.servimg.com/u/f43/16/73/94/18/tinyic10.gif">      <font color="#000"><b>[INT] Paul revela novidades!</b></font></a>  <span class="getAutor"> por <a href="/u146">      Justemoi</a></span> </li><li class="get"> <a href="/t655-br-pt-lista-de-fa-sites-oficiais-atualizada"><font color="#FFF"></font><img src="http://i43.servimg.com/u/f43/16/73/94/18/tinyic10.gif">      <font color="#000"><b>[BR/PT] Lista de fã-sites oficiais atualizada?</b></font></a>  <span class="getAutor"> por <a href="/u146">      Justemoi</a></span> </li><li class="get"> <a href="/t654-int-novo-balao-de-fala-para-a-equipe"><font color="#FFF"></font><img src="http://i43.servimg.com/u/f43/16/73/94/18/tinyic10.gif">      <font color="#000"><b>[INT] Novo balão de fala para a equipe.</b></font></a>  <span class="getAutor"> por <a href="/u82">      Layed</a></span> </li></ul></div></div></div></td></tr></tbody></table>

Melhores cumprimentos.

Encerra aqui já resolvi, se quiserem ver o resultado : http://esquadrao.forumbrasil.net/