<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
var conteudo = [
{img:"imagens/1.jpg",titulo:"teste Miler",href:"http://www.google.com.br"},
{img:"imagens/2.jpg",titulo:"teste Ronaldo",href:"http://www.uol.com.br"},
{img:"imagens/3.jpg",titulo:"teste Jose",href:"http://www.terra.com.br"},
{img:"imagens/4.jpg",titulo:"teste Rafael",href:"http://www.ig.com.br"},
{img:"imagens/5.jpg",titulo:"teste Tiago",href:"http://www.claretianas.br"}
];
var indice = 0;
var intervalo = null;
function rotativo(){
var el = document.getElementById('rotativo');
var img = el.getElementsByTagName('img')[0];
var desc = el.getElementsByTagName('div')[1];
var ativo = el.getElementsByTagName('a')[indice];
for (i = 0; i < conteudo.length;i++){
el.getElementsByTagName('a')[i].className = '';
}
ativo.className = 'ativo';
img.onclick = function(){
clearTimeout(intervalo);
location.href = conteudo[indice].href;
};
setTimeout(function(){ img.src = conteudo[indice].img; },100);
desc.innerHTML = conteudo[indice].titulo;
img.onload = function(){
intervalo = setTimeout(function(){
indice++;
if (indice == conteudo.length) indice = 0;
rotativo();
},5000);
};
}
function muda(i){
clearTimeout(intervalo);
indice = i;
rotativo();
}
</script>
<style type="text/css">
#rotativo{
float:left;
width:288px;
height:192px;
background-color:#CCCCCC;
position:relative;
}
#rotativo div#links{
position:absolute;
right:10px;
top:5px;
}
#rotativo div#links a{
display:block;
color:#000033;
background-color:#FFFFFF;
text-decoration:none;
width:25px;
padding:4px 0 4px 0;
text-align:center;
margin-bottom:4px;
}
#rotativo div#links a:hover,#rotativo div#links a.ativo{
background-color:#000066;
color:#FFFFFF;
}
#rotativo div#descricao{
position:absolute;
bottom:0;
left:0;
width:100%;
background-color:#CCCCCC;
}
</style>
</head>
<body onLoad="rotativo()">
<div id="rotativo">
<img src="">
<div id="links">
<a href="#" onClick="muda(0)">1</a>
<a href="#" onClick="muda(1)">2</a>
<a href="#" onClick="muda(2)">3</a>
<a href="#" onClick="muda(3)">4</a>
<a href="#" onClick="muda(4)">5</a>
</div>
<div id="descricao"></div>
</div>
</body>
</html>
Problema Com Target Blank
Started By Chaparro, 31/08/2010, 17:27
2 replies to this topic
#1
Posted 31/08/2010, 17:27
Boa tarde pessoal.. Estou me matando para fazer esse banner rotativo que ao clicar na imagem abre uma nova janela... Ele só abre na mesma janela e eu não quero... Quero que abra uma nova janela... alguem pode me ajudar?
#2
Posted 01/09/2010, 00:24
Em vez de:
location.href = conteudo[indice].href;Faça:
window.open(conteudo[indice].href);
#3
Posted 01/09/2010, 08:08
Pooo cara... muito obrigado... Funcionou... Eu pensei em fazer isso.. Mais de outro jeito...
Estava colocando window.open = conteudo[indice].href;
Mas do seu jeito funcionou perfeito...
Muito Obrigado...
Estava colocando window.open = conteudo[indice].href;
Mas do seu jeito funcionou perfeito...
Muito Obrigado...
1 user(s) are reading this topic
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)










