Código de slides

Qual é minha questão:
queria saber como fornecer um slide igual ao desse fórum

http://www.playforum.com.br/forum#



Medidas que eu tomei para corrigir o problema:
nenhuma

Links e imagens do meu problema:


Endereço do meu fórum:
http://top-styleart.forumeiros.com/

Versão do meu fórum:
PHPBB3

Só poderá saber com o Administrador do fórum, aquilo é um código HTML adicionado num Widget do Fórum...

Até Mais!

Olá,

Aqui está:

Código:

<style type="text/css">
#slideshow {list-style:none; color:#fff}
#slideshow span {display:none}
#wrapper {width:506px; display:none}
#wrapper * {margin:0; padding:0}
#information {position:absolute; bottom:0; width:500px; height:0; background:#000; color:#fff; overflow:hidden; z-index:200; opacity:.7; filter:alpha(opacity=70)}
#fullsize {position:relative; width:500px; height:300px; padding:2px; border:1px solid #ccc; background:#000}
#information h3 {padding:4px 8px 3px; font-size:14px}
#information p {padding:0 8px 8px}
#image {width:500px}
#image img {position:absolute; z-index:25; width:auto}
.imgnav {position:absolute; width:25%; height:306px; cursor:pointer; z-index:150}
#imgprev {left:0; background:url(http://i.imgur.com/2swMA.gif) left center no-repeat}
#imgnext {right:0; background:url(http://i.imgur.com/gpQMw.gif) right center no-repeat}
#imglink {position:absolute; height:306px; width:100%; z-index:100; opacity:.4; filter:alpha(opacity=40)}
.linkhover {background:url(http://i.imgur.com/S3DyJ.gif) center center no-repeat}
#thumbnails {margin-top:15px}
#slideleft {float:left; width:20px; height:81px; background:url(http://i.imgur.com/VIMIj.gif) center center no-repeat; background-color:#222}
#slideleft:hover {background-color:#333}
#slideright {float:right; width:20px; height:81px; background:#222 url(http://i.imgur.com/RjDRW.gif) center center no-repeat}
#slideright:hover {background-color:#333}
#slidearea {float:left; position:relative; width:456px; margin-left:5px; height:81px; overflow:hidden}
#slider {position:absolute; left:0; height:81px}
#slider img {cursor:pointer; border:1px solid #666; padding:2px}
  </style>
   <ul id="slideshow">
      <li>
         <h3>Converse com a galera</h3>
         <span>http://i.imgur.com/ktyUm.png</span>
         <p>Una-se agora ao nosso Chatbox e converse com os membros do fórum.</p>
         <a href="javascript:open('/#bottom');"><img src="http://i.imgur.com/2v6bh.png"></a>
      </li>
      <li>
         <h3>Design</h3>
         <span>http://i.imgur.com/zmmeW.jpg</span>
         <p>Veja agora como aprender a ser um Designer e muito mais...</p>
         <a href="javascript:open('/c4-area-grafica');"><img src="http://i.imgur.com/ZIesa.png"></a>
      </li>
   <li>
         <h3>Habbo</h3>
         <span>http://i.imgur.com/ie8xD.png</span>
         <p>Você joga Habbo ou tem um servidor privado? Veja mais.</p>
         <a href="javascript:open('/f2-area-habbo-hotel');"><img src="http://i.imgur.com/GDHWq.png"></a>
      </li>
      <li>
         <h3>Minecraft</h3>
         <span>http://i.imgur.com/VhJ8N.jpg</span>
         <p>Jogue agora o melhor game de construção de todos os tempos.</p>
         <a href="javascript:open('/f7-zone-minecraft');"><img src="http://i.imgur.com/eX3Pw.png"></a>
      </li>
      <li>
         <h3>Transformice</h3>
         <span>http://i.imgur.com/EmvJp.png</span>
         <p>Você é um ratinho comilão? Se joga Transformice tenha o melhor acervo aqui.</p>
         <a href="javascript:open('/f6-zone-transformice');"><img src="http://i.imgur.com/Ny1rF.png"></a>
      </li>
      <li>
         <h3>GTA</h3>
         <span>http://i.imgur.com/XyOhO.jpg</span>
         <p>Você joga GTA? Então está no lugar certo, clique e veja mais.</p>
         <a href="javascript:open('/f9-zone-gta');"><img src="http://i.imgur.com/JO0Rj.png"></a>
      </li>
      <li>
         <h3>Entretenimento</h3>
         <span>http://i.imgur.com/e0NxJ.png</span>
         <p>Está entediado, quer mais diversão? Então clique e veja o que temos de melhor</p>
         <a href="javascript:open('/c7-entretenimento');"><img src="http://i.imgur.com/9DS61.png"></a>
      </li>
   </ul>
   <div id="wrapper">
      <div id="fullsize">
         <div id="imgprev" class="imgnav" title="Voltar"></div>
         <div id="imglink"></div>
         <div id="imgnext" class="imgnav" title="Próxima"></div>
         <div id="image"></div>
         <div id="information">
            <h3></h3>
            <p></p>
         </div>
      </div>
      <div id="thumbnails">
         <div id="slideleft" title="Primeiros"></div>
         <div id="slidearea">
            <div id="slider"></div>
         </div>
         <div id="slideright" title="Últimos"></div>
      </div>
   </div>
<script type="text/javascript" src="http://pproxy.webs.com/css/compressed.js"></script>
<script type="text/javascript">
   $('slideshow').style.display='none';
   $('wrapper').style.display='block';
   var slideshow=new TINY.slideshow("slideshow");
   window.onload=function(){
      slideshow.auto=true;
      slideshow.speed=5;
      slideshow.link="linkhover";
      slideshow.info="information";
      slideshow.thumbs="slider";
      slideshow.left="slideleft";
      slideshow.right="slideright";
      slideshow.scrollSpeed=4;
      slideshow.spacing=5;
      slideshow.active="#fff";
      slideshow.init("slideshow","image","imgprev","imgnext","imglink");
   }
</script>

Até mais!

Esse código não funciona, olha o que deu no Portal:



Até Mais!

Caro amigo !
Slide eu Não sei !
Mais para Colocar Ele Centralizado
Faça os Seguintes Passos
Painel de Administração Visualização Pagina Inicial Geral Mensagem na Página Inicial : Conteúdo da mensagem Coloque oque você quer : Exemplo : Oi !

Caso queria aquele o Codigo da Noticia !

Código:

<link rel="stylesheet" type="text/css" href="http://Claudi0.com.nu/css123.css" />
<link rel="stylesheet" type="text/css" media='screen,print' href="http://whispers.com.br/public/min/index.php?ipbv=32006&amp;f=public/style_css/css_7/colorpicker.css,public/style_css/css_7/ipb_help.css,public/style_css/css_7/ipb_common.css" />

<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" title='Main' media="screen" href="http://whispers.com.br/public/style_css/css_7/ipb_ie.css" />
<![endif]-->
<!--[if lte IE 8]>
<style type='text/css'>
.ipb_table { table-layout: fixed; }
.ipsLayout_content { width: 99.5%; }
.maintitle, .ipbfs_titlebox, .post_controls{
border: 1px solid #929fab;
border-top: 1px solid #8692a0;
border-bottom: 1px solid #97a3af;
}
</style>
<![endif]-->

<!-- Forces resized images to an admin-defined size -->
<style type='text/css'>
img.bbc_img {
max-width: 600px !important;
max-height: 600px !important;
}
</style>






</head><div id="user_bar" class="clearfix" style="background-color: rgb(60, 69, 71); ">

<div id="user_navigation" class="not_logged_in">

<ul class="ipsList_inline">
<li>
<span class="services">
<a href="http://pixeleiros.forumeiros.com/login"><img src="http://whispers.com.br/public/style_images/Spectrum/loginmethods/facebook.png" alt="Log in with Facebook"></a>




</span>
<a href="/login" title="Entrar" id="sign_in"><img src="http://whispers.com.br/public/style_images/Spectrum/user_login.png" alt=""> Entrar</a>
</li>
<li>
<a href="http://pixeleiros.forumeiros.com/register" title="Cadastre-se" id="register_link"><img src="http://whispers.com.br/public/style_images/Spectrum/user_register.png" alt=""> Cadastre-se</a>
</li>
</ul>
</div>

<div id="search" class="right">
<form action="/app=core&amp;module=search&amp;do=search&amp;fromMainBar=1" method="post" id="search-box">
<fieldset>
<label for="main_search" class="hide">Pesquisar</label>
<a href="http://whispers.com.br/index.php?app=core&amp;module=search&amp;search_in=forums" title="Pesquisa Avançada" accesskey="4" rel="search" id="adv_search" class="right">Avançado</a>
<span id="search_wrap" class="right">
<input type="text" id="main_search" name="search_term" class="" size="17" tabindex="6" placeholder="Pesquisar...">
<span class="choice ipbmenu clickable" id="search_options" style="">Fórum</span>
<ul id="search_options_menucontent" class="ipbmenu_content ipsPad" style="position: absolute; display: none; z-index: 9999; ">
<li class="title" style="z-index: 10000; "><strong style="z-index: 10000; ">Pesquisar em:</strong></li>



<li class="app" style="z-index: 10000; "><label for="s_forums" title="Fórum" style="z-index: 10000; "><input type="radio" name="search_app" class="input_radio" id="s_forums" value="forums" checked="checked" style="z-index: 10000; ">Fórum</label></li><li class="app" style="z-index: 10000; "><label for="s_members" title="Membros" style="z-index: 10000; "><input type="radio" name="search_app" class="input_radio" id="s_members" value="members" style="z-index: 10000; ">Membros</label></li><li class="app" style="z-index: 10000; "><label for="s_core" title="Ajuda" style="z-index: 10000; "><input type="radio" name="search_app" class="input_radio" id="s_core" value="core" style="z-index: 10000; ">Ajuda</label></li>














</ul>
<input type="submit" class="submit_input clickable" value="">
</span>

</fieldset>
</form>
</div>

</div>
<center><img src="http://i43.servimg.com/u/f43/17/23/04/96/untitl10.png" alt="Logo"></center>
<br><br><div id="secondary_navigation" class="clearfix" style="background-color: rgb(60, 69, 71); ">
<ol class="breadcrumb top ipsList_inline left" id="breadcrumb">
<li itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb" class="first">
<a href="/forum" itemprop="url">
<span itemprop="title">Pixeleiros</span>
</a>
</li>

</ol>
<ul id="secondary_links" class="ipsList_inline right">




</ul>
</div><div class="guestMessage">
<strong>Bem Vindo ao Pixeleiros</strong><br>
Bem vindo {USERNAME} , Obrigado por Acessar Nosso Fórum ! Caso seja Convidado Registre-se e Faça Parte da Nossa Familia
Se ja for "da casa" Continue a Postar !
 <a href="http://pixeleiros.forumeiros.com/login">login aqui</a> - ou <a href="http://pixeleiros.forumeiros.com/register">registre-se</a> grátis!
</div>

Creditos : Whispers , Pois o Codigo é Dele !
Caso dê Certo Agradeca

-TheKiller escreveu:Esse código não funciona, olha o que deu no Portal:



Até Mais!

Você colocou Como Widget certo ?

Siim! No Portal '-'

Faça como Citei Acima !
Coloque em "Geral"

não funcionou ,

Obrigado Caio mais quero o código do slide mesmo

-TheKiller Acontece o Mesmo quando Adiciono o código

TopStyle , Mande-me as Imagens que Quer no Slide para mim poder Ajudar-te

Pode Ser As Mesmas depois eu mesmo edito .

Código:

<link rel="stylesheet" type="text/css" href="http://Claudi0.com.nu/css123.css" />
<link rel="stylesheet" type="text/css" media='screen,print' href="http://whispers.com.br/public/min/index.php?ipbv=32006&amp;f=public/style_css/css_7/colorpicker.css,public/style_css/css_7/ipb_help.css,public/style_css/css_7/ipb_common.css" />

<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" title='Main' media="screen" href="http://whispers.com.br/public/style_css/css_7/ipb_ie.css" />
<![endif]-->
<!--[if lte IE 8]>
<style type='text/css'>
.ipb_table { table-layout: fixed; }
.ipsLayout_content { width: 99.5%; }
.maintitle, .ipbfs_titlebox, .post_controls{
border: 1px solid #929fab;
border-top: 1px solid #8692a0;
border-bottom: 1px solid #97a3af;
}
</style>
<![endif]-->

<!-- Forces resized images to an admin-defined size -->
<style type='text/css'>
img.bbc_img {
max-width: 600px !important;
max-height: 600px !important;
}
</style>






</head><div id="user_bar" class="clearfix" style="background-color: rgb(60, 69, 71); ">

<div id="user_navigation" class="not_logged_in">

<ul class="ipsList_inline">
<li>
<span class="services">
<a href="http://pixeleiros.forumeiros.com/login"><img src="http://whispers.com.br/public/style_images/Spectrum/loginmethods/facebook.png" alt="Log in with Facebook"></a>




</span>
<a href="/login" title="Entrar" id="sign_in"><img src="http://whispers.com.br/public/style_images/Spectrum/user_login.png" alt=""> Entrar</a>
</li>
<li>
<a href="http://pixeleiros.forumeiros.com/register" title="Cadastre-se" id="register_link"><img src="http://whispers.com.br/public/style_images/Spectrum/user_register.png" alt=""> Cadastre-se</a>
</li>
</ul>
</div>

<div id="search" class="right">
<form action="/app=core&amp;module=search&amp;do=search&amp;fromMainBar=1" method="post" id="search-box">
<fieldset>
<label for="main_search" class="hide">Pesquisar</label>
<a href="http://whispers.com.br/index.php?app=core&amp;module=search&amp;search_in=forums" title="Pesquisa Avançada" accesskey="4" rel="search" id="adv_search" class="right">Avançado</a>
<span id="search_wrap" class="right">
<input type="text" id="main_search" name="search_term" class="" size="17" tabindex="6" placeholder="Pesquisar...">
<span class="choice ipbmenu clickable" id="search_options" style="">Fórum</span>
<ul id="search_options_menucontent" class="ipbmenu_content ipsPad" style="position: absolute; display: none; z-index: 9999; ">
<li class="title" style="z-index: 10000; "><strong style="z-index: 10000; ">Pesquisar em:</strong></li>



<li class="app" style="z-index: 10000; "><label for="s_forums" title="Fórum" style="z-index: 10000; "><input type="radio" name="search_app" class="input_radio" id="s_forums" value="forums" checked="checked" style="z-index: 10000; ">Fórum</label></li><li class="app" style="z-index: 10000; "><label for="s_members" title="Membros" style="z-index: 10000; "><input type="radio" name="search_app" class="input_radio" id="s_members" value="members" style="z-index: 10000; ">Membros</label></li><li class="app" style="z-index: 10000; "><label for="s_core" title="Ajuda" style="z-index: 10000; "><input type="radio" name="search_app" class="input_radio" id="s_core" value="core" style="z-index: 10000; ">Ajuda</label></li>
<center>













</ul>
<input type="submit" class="submit_input clickable" value="">
</span>

</fieldset>
</form>
</div>

</div>
<html><style type="text/css">
#slideshow {list-style:none; color:#fff}
#slideshow span {display:none}
#wrapper {width:506px; display:none}
#wrapper * {margin:0; padding:0}
#information {position:absolute; bottom:0; width:500px; height:0; background:#000; color:#fff; overflow:hidden; z-index:200; opacity:.7; filter:alpha(opacity=70)}
#fullsize {position:relative; width:500px; height:300px; padding:2px; border:1px solid #ccc; background:#000}
#information h3 {padding:4px 8px 3px; font-size:14px}
#information p {padding:0 8px 8px}
#image {width:500px}
#image img {position:absolute; z-index:25; width:auto}
.imgnav {position:absolute; width:25%; height:306px; cursor:pointer; z-index:150}
#imgprev {left:0; background:url(http://i.imgur.com/2swMA.gif) left center no-repeat}
#imgnext {right:0; background:url(http://i.imgur.com/gpQMw.gif) right center no-repeat}
#imglink {position:absolute; height:306px; width:100%; z-index:100; opacity:.4; filter:alpha(opacity=40)}
.linkhover {background:url(http://i.imgur.com/S3DyJ.gif) center center no-repeat}
#thumbnails {margin-top:15px}
#slideleft {float:left; width:20px; height:81px; background:url(http://i.imgur.com/VIMIj.gif) center center no-repeat; background-color:#222}
#slideleft:hover {background-color:#333}
#slideright {float:right; width:20px; height:81px; background:#222 url(http://i.imgur.com/RjDRW.gif) center center no-repeat}
#slideright:hover {background-color:#333}
#slidearea {float:left; position:relative; width:456px; margin-left:5px; height:81px; overflow:hidden}
#slider {position:absolute; left:0; height:81px}
#slider img {cursor:pointer; border:1px solid #666; padding:2px}
  </style>
   <ul id="slideshow">
      <li>
         <h3>Converse com a galera</h3>
         <span>http://i.imgur.com/ktyUm.png</span>
         <p>Una-se agora ao nosso Chatbox e converse com os membros do fórum.</p>
         <a href="javascript:open('/#bottom');"><img src="http://i.imgur.com/2v6bh.png"></a>
      </li>
      <li>
         <h3>Design</h3>
         <span>http://i.imgur.com/zmmeW.jpg</span>
         <p>Veja agora como aprender a ser um Designer e muito mais...</p>
         <a href="javascript:open('/c4-area-grafica');"><img src="http://i.imgur.com/ZIesa.png"></a>
      </li>
   <li>
         <h3>Habbo</h3>
         <span>http://i.imgur.com/ie8xD.png</span>
         <p>Você joga Habbo ou tem um servidor privado? Veja mais.</p>
         <a href="javascript:open('/f2-area-habbo-hotel');"><img src="http://i.imgur.com/GDHWq.png"></a>
      </li>
      <li>
         <h3>Minecraft</h3>
         <span>http://i.imgur.com/VhJ8N.jpg</span>
         <p>Jogue agora o melhor game de construção de todos os tempos.</p>
         <a href="javascript:open('/f7-zone-minecraft');"><img src="http://i.imgur.com/eX3Pw.png"></a>
      </li>
      <li>
         <h3>Transformice</h3>
         <span>http://i.imgur.com/EmvJp.png</span>
         <p>Você é um ratinho comilão? Se joga Transformice tenha o melhor acervo aqui.</p>
         <a href="javascript:open('/f6-zone-transformice');"><img src="http://i.imgur.com/Ny1rF.png"></a>
      </li>
      <li>
         <h3>GTA</h3>
         <span>http://i.imgur.com/XyOhO.jpg</span>
         <p>Você joga GTA? Então está no lugar certo, clique e veja mais.</p>
         <a href="javascript:open('/f9-zone-gta');"><img src="http://i.imgur.com/JO0Rj.png"></a>
      </li>
      <li>
         <h3>Entretenimento</h3>
         <span>http://i.imgur.com/e0NxJ.png</span>
         <p>Está entediado, quer mais diversão? Então clique e veja o que temos de melhor</p>
         <a href="javascript:open('/c7-entretenimento');"><img src="http://i.imgur.com/9DS61.png"></a>
      </li>
   </ul>
   <div id="wrapper">
      <div id="fullsize">
         <div id="imgprev" class="imgnav" title="Voltar"></div>
         <div id="imglink"></div>
         <div id="imgnext" class="imgnav" title="Próxima"></div>
         <div id="image"></div>
         <div id="information">
            <h3></h3>
            <p></p>
         </div>
      </div>
      <div id="thumbnails">
         <div id="slideleft" title="Primeiros"></div>
         <div id="slidearea">
            <div id="slider"></div>
         </div>
         <div id="slideright" title="Últimos"></div>
      </div>
   </div>
<script type="text/javascript" src="http://pproxy.webs.com/css/compressed.js"></script>
<script type="text/javascript">
   $('slideshow').style.display='none';
   $('wrapper').style.display='block';
   var slideshow=new TINY.slideshow("slideshow");
   window.onload=function(){
      slideshow.auto=true;
      slideshow.speed=5;
      slideshow.link="linkhover";
      slideshow.info="information";
      slideshow.thumbs="slider";
      slideshow.left="slideleft";
      slideshow.right="slideright";
      slideshow.scrollSpeed=4;
      slideshow.spacing=5;
      slideshow.active="#fff";
      slideshow.init("slideshow","image","imgprev","imgnext","imglink");
   }
</script></html></center>
<br><br><div id="secondary_navigation" class="clearfix" style="background-color: rgb(60, 69, 71); ">
<ol class="breadcrumb top ipsList_inline left" id="breadcrumb">
<li itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb" class="first">
<a href="/forum" itemprop="url">
<span itemprop="title">Pixeleiros</span>
</a>
</li>

</ol>
<ul id="secondary_links" class="ipsList_inline right">




</ul>
</div><div class="guestMessage">
<strong>Bem Vindo ao Pixeleiros</strong><br>
Bem vindo {USERNAME} , Obrigado por Acessar Nosso Fórum ! Caso seja Convidado Registre-se e Faça Parte da Nossa Familia
Se ja for "da casa" Continue a Postar !
 <a href="http://pixeleiros.forumeiros.com/login">login aqui</a> - ou <a href="http://pixeleiros.forumeiros.com/register">registre-se</a> grátis!
</div>

Algum Erro Contate-me

Olá,

Aqui está, não é igual mais é legal de uma olhada:

Código:

<!-- /////////////////////// INICIO IMAGENS TROCANDO /////////////////////// -->

<script type="text/javascript" src="http://steeph.vilabol.uol.com.br/slidedenovidades/slide3_script1.js"></script>
<script type="text/javascript" src="http://steeph.vilabol.uol.com.br/slidedenovidades/slide3_script2.js"></script>

<script>
var simpleGallery_navpanel={
    panel: {height:'45px', opacity:0.5, paddingTop:'5px', fontStyle:'bold 11px Verdana'}, //customize nav panel container
    images: [    'http://img801.imageshack.us/img801/833/left.gif', 'http://img185.imageshack.us/img185/4655/playf.gif', 'http://img824.imageshack.us/img824/9263/right.gif', 'http://img291.imageshack.us/img291/3786/paused.gif'    ], //nav panel images (in that order)
    imageSpacing: {offsetTop:[-4, 0, -4], spacing:10}, //top offset of left, play, and right images, PLUS spacing between the 3 images
    slideduration: 500 //duration of slide up animation to reveal panel
}
</script>

<script type="text/javascript">

var mygallery=new simpleGallery({
    wrapperid: "simplegallery1", //ID of main gallery container,
    dimensions: [477, 245], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
    imagearray: [
        ["http://i57.photobucket.com/albums/g218/tettyvox/sotw-16.png", "http://www.kromusdesign.com/t5037-35-sotw-resultados", "_new", ""],
        ["http://i57.photobucket.com/albums/g218/tettyvox/dotm-7.png", "http://www.kromusdesign.com/t5114-dotm-15-resultados#55600", "_new", ""],
        ["http://i57.photobucket.com/albums/g218/tettyvox/votf-1.png", "_new", "http://www.kromusdesign.com/t4882-1-vector-of-the-fortnight-resultados", ""],
        ["http://i57.photobucket.com/albums/g218/tettyvox/melhordomes-1.png", "http://www.kromusdesign.com/t5118-melhor-trabalho-do-mes-abril", "_new", ""],
        ["http://i57.photobucket.com/albums/g218/tettyvox/aotm-8.png", "_new", " ", ""]
    ],
    autoplay: [true, 2500, 50], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
    persist: false, //remember last viewed slide and recall within same session?
    fadeduration: 500, //transition duration (milliseconds)
    oninit:function(){ //event that fires when gallery has initialized/ ready to run
        //Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
    },
    onslide:function(curslide, i){ //event that fires after each slide is shown
        //Keyword "this": references current gallery instance
        //curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
        //i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
    }
})

</script><div class="slideshowborda" id="simplegallery1" style="z-index:1;">
</div>

<!-- /////////////////////// FIM IMAGENS TROCANDO /////////////////////// -->

Até mais!

As imagens do Meu é Igual !
Como você Pediu 1

Olá, tente com este codigo

Código:


<style type="text/css">
#slideshow {list-style:none; color:#fff}
#slideshow span {display:none}
#wrapper {width:506px; display:none}
#wrapper * {margin:0; padding:0}
#information {position:absolute; bottom:0; width:500px; height:0; background:#000; color:#fff; overflow:hidden; z-index:200; opacity:.7; filter:alpha(opacity=70)}
#fullsize {position:relative; width:500px; height:300px; padding:2px; border:1px solid #ccc; background:#000}
#information h3 {padding:4px 8px 3px; font-size:14px}
#information p {padding:0 8px 8px}
#image {width:500px}
#image img {position:absolute; z-index:25; width:auto}
.imgnav {position:absolute; width:25%; height:306px; cursor:pointer; z-index:150}
#imgprev {left:0; background:url(http://i.imgur.com/2swMA.gif) left center no-repeat}
#imgnext {right:0; background:url(http://i.imgur.com/gpQMw.gif) right center no-repeat}
#imglink {position:absolute; height:306px; width:100%; z-index:100; opacity:.4; filter:alpha(opacity=40)}
.linkhover {background:url(http://i.imgur.com/S3DyJ.gif) center center no-repeat}
#thumbnails {margin-top:15px}
#slideleft {float:left; width:20px; height:81px; background:url(http://i.imgur.com/VIMIj.gif) center center no-repeat; background-color:#222}
#slideleft:hover {background-color:#333}
#slideright {float:right; width:20px; height:81px; background:#222 url(http://i.imgur.com/RjDRW.gif) center center no-repeat}
#slideright:hover {background-color:#333}
#slidearea {float:left; position:relative; width:456px; margin-left:5px; height:81px; overflow:hidden}
#slider {position:absolute; left:0; height:81px}
#slider img {cursor:pointer; border:1px solid #666; padding:2px}
  </style>
   <ul id="slideshow">
      <li>
         <h3>Converse com a galera</h3>
         <span>http://i.imgur.com/ktyUm.png</span>
         <p>Una-se agora ao nosso Chatbox e converse com os membros do fórum.</p>
         <a href="javascript:open('/#bottom');"><img src="http://i.imgur.com/2v6bh.png"></a>
      </li>
      <li>
         <h3>Design</h3>
         <span>http://i.imgur.com/zmmeW.jpg</span>
         <p>Veja agora como aprender a ser um Designer e muito mais...</p>
         <a href="javascript:open('/c4-area-grafica');"><img src="http://i.imgur.com/ZIesa.png"></a>
      </li>
   <li>
         <h3>Habbo</h3>
         <span>http://i.imgur.com/ie8xD.png</span>
         <p>Você joga Habbo ou tem um servidor privado? Veja mais.</p>
         <a href="javascript:open('/f2-area-habbo-hotel');"><img src="http://i.imgur.com/GDHWq.png"></a>
      </li>
      <li>
         <h3>Minecraft</h3>
         <span>http://i.imgur.com/VhJ8N.jpg</span>
         <p>Jogue agora o melhor game de construção de todos os tempos.</p>
         <a href="javascript:open('/f7-zone-minecraft');"><img src="http://i.imgur.com/eX3Pw.png"></a>
      </li>
      <li>
         <h3>Transformice</h3>
         <span>http://i.imgur.com/EmvJp.png</span>
         <p>Você é um ratinho comilão? Se joga Transformice tenha o melhor acervo aqui.</p>
         <a href="javascript:open('/f6-zone-transformice');"><img src="http://i.imgur.com/Ny1rF.png"></a>
      </li>
      <li>
         <h3>GTA</h3>
         <span>http://i.imgur.com/XyOhO.jpg</span>
         <p>Você joga GTA? Então está no lugar certo, clique e veja mais.</p>
         <a href="javascript:open('/f9-zone-gta');"><img src="http://i.imgur.com/JO0Rj.png"></a>
      </li>
      <li>
         <h3>Entretenimento</h3>
         <span>http://i.imgur.com/e0NxJ.png</span>
         <p>Está entediado, quer mais diversão? Então clique e veja o que temos de melhor</p>
         <a href="javascript:open('/c7-entretenimento');"><img src="http://i.imgur.com/9DS61.png"></a>
      </li>
   </ul>
   <div id="wrapper">
      <div id="fullsize">
         <div id="imgprev" class="imgnav" title="Voltar"></div>
         <div id="imglink"></div>
         <div id="imgnext" class="imgnav" title="Próxima"></div>
         <div id="image"></div>
         <div id="information">
            <h3></h3>
            <p></p>
         </div>
      </div>
      <div id="thumbnails">
         <div id="slideleft" title="Primeiros"></div>
         <div id="slidearea">
            <div id="slider"></div>
         </div>
         <div id="slideright" title="Últimos"></div>
      </div>
   </div>
<script type="text/javascript" src="http://pproxy.webs.com/css/compressed.js"></script>
<script type="text/javascript">
   $('slideshow').style.display='none';
   $('wrapper').style.display='block';
   var slideshow=new TINY.slideshow("slideshow");
   window.onload=function(){
      slideshow.auto=true;
      slideshow.speed=5;
      slideshow.link="linkhover";
      slideshow.info="information";
      slideshow.thumbs="slider";
      slideshow.left="slideleft";
      slideshow.right="slideright";
      slideshow.scrollSpeed=4;
      slideshow.spacing=5;
      slideshow.active="#fff";
      slideshow.init("slideshow","image","imgprev","imgnext","imglink");
   }
</script>

Cordialmente.

Caio Estou Tentando Adicionar na pagina inicial porem não esta funcionado

ao invés de exibir o slide ele oculta a pagina .

Hard Nem Aparece Nada ;(

Não funcionou matheus

caiotenorioGPF, existe uma barra com fundo preto.
Poderia me dar apenas o CSS dela?