Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa noite,
Meu nome é Caio, e venho através deste post solicitar ajuda a um código que não consigo achar a solução.
O objetivo desse meu script é fazer uma especie de "Revista", ond passa umas imagens como se fossem as paginas mesmo (é so um trabalho da escola, mas queira q ficasse legal =D)
O internet Explorer simplesmente não entra no setInterval(), não sei o motivo, mas digo que tentei resolver!
podem visualizar através deste link: Problema (funciona em todos menos no IE)
aqui esta o javascript da pagina:
var limite = 2; //Limite de paginas
window.onload = function(){
var src = document.getElementById("imagem").src;
var count = src.length;
var count2 = count - 5;
count = count2 + 1;
var source = src.substring(count2, count);
if(source == 0){
document.getElementById("Botao0").style.background = "url(white_60.png)";
var excecao = 0;
}else if(source == 1){
document.getElementById("Botao1").style.background = "url(white_60.png)";
var excecao = 1;
}
for (var aux=1; aux == limite; aux ++){
if(aux == excecao){
break;
}
document.getElementById("Botao" + aux).style.background = "url(black_60.png)";
}
}
function setAlpha(target, alpha) {
target.style.filter = "alpha(opacity="+ alpha +")";
target.style.opacity = alpha/100;
}
function fadeOut(id, time, imagem) {
target = document.getElementById(id);
alpha = 100;
timer = (time*1000)/50;
var i = setInterval(function() { //<<<<<<<<<<<<<<<<<---------- setInterval aqui!
if (alpha <= 0){
troca_image(imagem);
verifica_botao();
fadeIn("conteudo", 0.1);
clearInterval(i);}
setAlpha(target, alpha);
alpha -= 2;
}, timer);
}
function fadeIn(id, time) {
target = document.getElementById(id);
alpha = 0;
timer = (time*1000)/50;
var i = setInterval(function() { //<<<<<<<<<<<<<<<<<<<----------------- setInterval aqui!!
if (alpha >= 100)
clearInterval(i);
setAlpha(target, alpha);
alpha += 2;
}, timer);
}
//-----------
function bt_entra(botao){
document.getElementById(botao).style.border="1px solid white";
document.getElementById(botao).style.background = "url(white_60.png)";
}
function bt_sai(botao){
document.getElementById(botao).style.border="1px solid black";
document.getElementById(botao).style.background = "url(black_60.png)";
verifica_botao();
}
function troca(pagina){
var src = document.getElementById("imagem").src;
var count = src.length;
var count2 = count - 5;
var source = src.substring(count2, count);
var verifica = pagina +".jpg";
if(source != verifica){
fadeOut("conteudo", 0.01, pagina);
}
}
function troca_image(imagem){
document.getElementById("imagem").src=imagem+".jpg";
}
function verifica_botao(){
var src = document.getElementById("imagem").src;
var count = src.length;
var count2 = count - 5;
count = count2 + 1;
var source = src.substring(count2, count);
if(source == 0){
aux = 0;
document.getElementById("Botao0").style.background = "url(black_60.png)";
document.getElementById("Botao1").style.background = "url(black_60.png)";
document.getElementById("Botao0").style.background = "url(white_60.png)";
var excecao = 0;
}else if(source == 1){
aux=0;
document.getElementById("Botao0").style.background = "url(black_60.png)";
document.getElementById("Botao1").style.background = "url(black_60.png)";
document.getElementById("Botao1").style.background = "url(white_60.png)";
var excecao = 1;
}
}
function previous(){
var src = document.getElementById("imagem").src;
var count = src.length;
var count2 = count - 5;
count = count2 + 1;
var source = src.substring(count2, count);
if(source != 0){
source = source - 1;
troca(source);
}
}
function next(){
var src = document.getElementById("imagem").src;
var count = src.length;
var count2 = count - 5;
count = count2 + 1;
var source = src.substring(count2, count);
if(source != 1){
source++;
troca(source);
}
}<body>
<div class="body" align="center">
<div class="menu">
<a href="#">
<div class="botao" id="Botao0" onmouseover="bt_entra('Botao0')" onmouseout="bt_sai('Botao0')" onclick="troca(0)">
<h1>00</h1>Capa
</div>
<div class="botao" id="Botao1" onmouseover="bt_entra('Botao1')" onmouseout="bt_sai('Botao1')" onclick="troca(1)">
<h1>01</h1>Índice
</div>
</a>
</div>
<div class="Area_conteudo">
<div class="previous" id="previous" onmouseover="bt_entra('previous')" onmouseout="bt_sai('previous')" onclick="previous()">
<span style="color: black;">Anterior</span>
</div>
<div class="conteudo" id="conteudo">
<img src="0.jpg" border="1px" alt="" id="imagem" />
</div>
<div class="next" id="next" onmouseover="bt_entra('next')" onmouseout="bt_sai('next')" onclick="next()">
<span style="color: black;">Proximo</span>
</div>
</div>
</div>
</body>Desde já agradeço, e qualquer resposta/dica é bem vinda.
Grato
caio.
Carregando comentários...