Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Ola!
Eu tenho um slideshow aki mas ele não funciona o link por causa do efeito fade.
Eu achei a resposta do motivo, mas ainda não encontrei a solução. Certa vez um usuario ele postou esta mesma duvida, mas comigo não funciona.
Ele explicou que o motivo é que o comando do fade está fazendo com que se tivesse um vidro "protegendo" o código que está por baixo.
Obrigado por enquanto
O codigo que faz o erro:
<div id="fade"></div><div id="left" onMouseOver="fade('left');" onMouseOut="fade('left');" onClick="rollerSlide(0)"></div><div id="right" onMouseOver="fade('right');" onMouseOut="fade('right');" onClick="rollerSlide(1)"></div>
Codigo html inteiro
<html><head>
<head><link href="../css/destaque.css" rel="stylesheet" type="text/css" />
<script src="../css/destaque.js" type="text/javascript"></script></head></head><body onLoad="fade('fade');fade('left');fade('right');">
<div id="slideshow" name="slideshow" >
<div id="links" name="links">
<ul>
<li id="link1" name="link1" class="ativo"><b style="width:100%;height:100%;cursor:pointer;">1</b></li>
<li id="link2" name="link2" class="inativo"><b style="width:100%;height:100%;cursor:pointer;">2</b></li>
<li id="link3" name="link3" class="inativo"><b style="width:100%;height:100%;cursor:pointer;">3</b></li>
<li id="link4" name="link4" class="inativo"><b style="width:100%;height:100%;cursor:pointer;">4</b></li>
<li id="link5" name="link5" class="inativo"><b style="width:100%;height:100%;cursor:pointer;">5</b></li>
</ul></div>
<div id="slides" name="slides">
<div id="slide1" name="slide1" class="visible">
<span class="titulo"></span>
<span class="conteudo">Lorem Ipsum is simply dummy text of the printing and typesetting industry.
</span>
<span class="link">
<a href="link_1">Leia mais</a> sobre <label><a href="link_5">Título 1</a></label>
</span>
</div>
<div id="slide2" name="slide2" class="hidden">
<span class="titulo"> Título 2 </span>
<span class="conteudo">
Lorem Ipsum <a href="pilotos/resta.php">is simply dummy text of the printing and t</a>ypesetting industry.he 1960s with the release of Letraset sheets containing Lorem Ipsum passages. </span>
<span class="link">
<a href="link_2">Leia mais</a> sobre
<label><a href="link_5">Título 2</a></label>
</span>
</div>
<div id="slide3" name="slide3" class="hidden">
<span class="titulo"></span>
<span class="conteudo">
<img src="logo3.jpg" align="left" class="imagem"></span>
<span class="link">
<a href="link_3">Leia mais</a> sobre <label><a href="link_5">Título 3</a></label>
</span>
</div>
<div id="slide4" name="slide4" class="hidden">
<span class="titulo"></span>
<span class="conteudo">
<img src="logo4.jpg" align="left" class="imagem"></span>
<span class="link">
<a href="link_4">Leia mais</a> sobre <label><a href="link_5">Ataque terrorista aos Estados.</a></label>
</span>
</div>
<div id="slide5" name="slide5" class="hidden">
<span class="titulo"></span>
<span class="conteudo">
<img src="logo5.jpg" align="left" class="imagem"></span>
<span class="link">
<a href="link_5">Leia mais</a> sobre <label><a href="link_5">Título 5</a></label>
</span>
</div>
</div>
<div id="fade"></div><div id="left" onMouseOver="fade('left');" onMouseOut="fade('left');" onClick="rollerSlide(0)"></div><div id="right" onMouseOver="fade('right');" onMouseOut="fade('right');" onClick="rollerSlide(1)"></div>
</div>
</body>
</html>CSS
* {
margin: 0;
padding: 0;
list-style: none;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, Sans-Serif;
}height: 255px;
width: 638px;
border: 1px solid black;
z-index:2;
}float: right;
clear: both;
width: 10%;
text-align: center;
}font-size: 12px;
border-top: 1px solid white;
line-height: 49px;
}background: #66FF99 url(../imagens/fundo-n.gif);
}background: #339900 url(../imagens/fundo-n2.gif);
z-index:3;
}background: #BBBBBB;
height: 100%;
color: white;
font-size: 14px;
}display: block;
background-color: #BBBBBB;
width:100%;
height:100%;
}display: none;
}display: block;
}background:url(../imagens/fundo-titulo-destaque.png);
font-weight: bold;
font-size: 16px;
color: #FFFFCC;
text-align:center;
padding: 5px;
height: 50px;
}width:200px;
height:170px;
}font-size: 13px;
color: #FFFFFF;
padding: 10px;
width:100%;
padding-top: 100px;
}font-size: 13px;
color: #FFFFFF;
padding: 5px;
}position: relative;
z-index:1;
}div#fade {
width:444px;
height:220px;
background-color: #BBBBBB;
position: absolute;
margin-left:0;
margin-top:-250px;
}div#slides #left{
position: relative;
}position: relative;
}width:222px;
height:220px;
position: absolute;
margin-left:0;
margin-top:-250px;
background:url(../esq.png) no-repeat center left;
}width:222px;
height:220px;
position: absolute;
margin-left:222px;
margin-top:-250px;
background:url(../dir.png) no-repeat center right;
}color:#FFFFFF;
}color:#FFFFFF;
font-weight:bold;
}color:#FFFFFF;
text-decoration:underline;
}
.numeros{
width:100%;height:100%;
cursor:pointer; display:block;
color:#FFFFFF;
}Carregando comentários...