Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

AlessandraSantos

[Resolvido] Lightbox no IE

Recommended Posts

Olá,

 

Estou utilizando o http://www.lokeshdhakar.com/projects/lightbox2/#contact em um site e está funcionando bem no firefox e no chrome. Porém, no IE ocorrem erros:

 

Imagem Postada

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Patrícia Viera - Coleções</title>
<link href="estilo/estilo.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="estilo/lightbox.css" type="text/css" media="screen" />
<link href="estilo/bg.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.cycle.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.bssound.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.pngFix.pack.js"></script>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<script language="javascript" type="text/javascript" src="js/javascript.js"></script>
<script language="javascript" type="text/javascript" src="js/bg.js"></script>
</head>

<body class="interno">

<div id="corpo">
	<div id="topo">
    <a class="logo" href="index.html"><img src="imagens/logo-patricia.jpg" alt="Logo Patrícia Viera" /></a>
        <ul class="menu">
        	<li><a class="empresa" href="#TODO" title="A Empresa"><span>A Empresa</span></a></li>
            <li><a class="colecoes" href="colecoes.html" title="Coleções"><span>Coleções</span></a></li>
            <li><a class="imprensa" href="#TODO" title="Imprensa"><span>Imprensa</span></a></li>
            <li><a class="parceiros" href="#TODO" title="Parceiro"><span>Parceiro</span></a></li>
            <li><a class="contato" href="#TODO" title="Contato"><span>Contato</span></a></li>
        </ul>
        <ul class="lingua">        
        	<li><a class="portugues" href="#TODO" title="Português"><span>Português</span></a></li>
            <li><a class="ingles" href="#TODO" title="Inglês"><span>Inglês</span></a></li>              	
        </ul>
<!--        <div id="maincontainer">
            <a href="music/katy_perry.mp3" id="kp">[ Katy Perry ]</a>
            <hr id="spacer" />
            <a href="music/beyonce.mp3" id="be">[ Beyonce ]</a>
       </div>-->
    <div class="clear"></div>
    </div>
    <div id="conteudo">
    	<div class="texto-lateral">
        	<div class="primavera-verao">
                <h2><img src="imagens/primavera-tit.jpg" alt="Primavera / Verão 2011" /></h2>
                <ul>
                    <li><a href="primavera-colecoes.html" title="Coleções" class="colecao ativo"><span>Coleção</span></a></li>
                    <li><a href="primavera-bastidores-detalhes.html" title="Bastidores + Detalhes" class="bastidores"><span>Bastidores + Detalhes</span></a></li>
                    <li><a href="primavera-video.html" title="Vídeo" class="video"><span>Vídeo</span></a></li>
                </ul> 
            </div> 
        	<div class="outono-inverno">
                <h2><img src="imagens/outono-tit.jpg" alt="Outono / Inverno 2011" /></h2>
                <ul>
                    <li><a href="outono-colecoes.html" title="Coleções" class="colecao"><span>Coleção</span></a></li>
                    <li><a href="outono-bastidores-detalhes.html" title="Bastidores + Detalhes" class="bastidores"><span>Bastidores + Detalhes</span></a></li>
                </ul> 
            </div>                        
        </div>
    	<div class="colecao-fotos">
        	<div class="paginacao"><a href="" alt="">< Anterior</a> <a href="" alt="">1</a> <a href="" alt="">2 </a><a href="" alt="">3</a> <a href="" alt="">Próxima ></a></div>
        	<ul>
            	<li><a href="imagens/primavera-verao/001_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/001.jpg" alt="foto1" width="180"/></a></li>
                <li><a href="imagens/primavera-verao/002_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/002.jpg" alt="foto2" width="180"/></a></li>
                <li><a href="imagens/primavera-verao/003_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/003.jpg" alt="foto3" width="180"/></a></li>
            	<li><a href="imagens/primavera-verao/004_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/004.jpg" alt="foto4" width="180"/></a></li>
                <li><a href="imagens/primavera-verao/005_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/005.jpg" alt="foto5" width="180"/></a></li>
                <li><a href="imagens/primavera-verao/006_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/006.jpg" alt="foto6" width="180"/></a></li>
            	<li><a href="imagens/primavera-verao/007_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/007.jpg" alt="foto7" width="180"/></a></li>
                <li><a href="imagens/primavera-verao/008_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/008.jpg" alt="foto8" width="180"/></a></li>
                <li><a href="imagens/primavera-verao/009_2.jpg" rel="lightbox[roadtrip]"><img src="imagens/primavera-verao/009.jpg" alt="foto9" width="180"/></a></li>                                
            </ul> 
        	<div class="paginacao"><a href="" alt="">Anterior</a> <a href="" alt="">1</a> <a href="" alt="">2 </a><a href="" alt="">3</a> <a href="" alt="">Próxima</a></div>
        </div>        
    </div>

</div>    
</body>
</html>

Alguém pode me ajudar?

 

Ninguém sabe resolver esse problema?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Scriptaculous, prototype, jquery e JS crú?

Quanto desperdício!

 

Faça o seguinte: troque esse lightbox por um script que ofereça o que você precisa, em jQuery. Exemplo:

 

http://leandrovieira.com/projects/jquery/lightbox/

 

É a mesma coisa, mas provavelmente vai funcionar corretamente, pois dificilmente vai haver conflitos entre libs, e é um script muito mais recente.

 

Até mais.

Compartilhar este post


Link para o post
Compartilhar em outros sites

poste um link do teu site online

Compartilhar este post


Link para o post
Compartilhar em outros sites

ainda não está online

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Patrícia Viera - Coleções</title>
<link href="estilo/estilo.css" rel="stylesheet" type="text/css" />
<!--<link rel="stylesheet" href="estilo/lightbox.css" type="text/css" media="screen" />-->
<link rel="stylesheet" type="text/css" href="estilo/jquery.lightbox-0.5.css" media="screen" />
<link href="estilo/bg.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
<!--<script language="javascript" type="text/javascript" src="js/jquery.bssound.js"></script>-->
<!--<script language="javascript" type="text/javascript" src="js/bg.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.pngFix.pack.js"></script>-->
<script language="javascript" type="text/javascript" src="js/jquery.lightbox-0.5.js"></script>
<script language="javascript" type="text/javascript" src="js/primavera.js"></script>
<!--<script language="javascript" type="text/javascript" src="js/lightbox.js"></script>
--><script language="javascript" type="text/javascript" src="js/javascript.js"></script>

</head>

<body class="interno">

<div id="corpo">
	<div id="topo">
    <a class="logo" href="index.html"><img src="imagens/logo-patricia.jpg" alt="Logo Patrícia Viera" /></a>
        <ul class="menu">
        	<li><a class="empresa" href="#TODO" title="A Empresa"><span>A Empresa</span></a></li>
            <li><a class="colecoes" href="colecoes.html" title="Coleções"><span>Coleções</span></a></li>
            <li><a class="imprensa" href="#TODO" title="Imprensa"><span>Imprensa</span></a></li>
            <li><a class="parceiros" href="#TODO" title="Parceiro"><span>Parceiro</span></a></li>
            <li><a class="contato" href="#TODO" title="Contato"><span>Contato</span></a></li>
        </ul>
        <ul class="lingua">        
        	<li><a class="portugues ativo" href="#TODO" title="Português"><span>Português</span></a></li>
            <li><a class="ingles" href="#TODO" title="Inglês"><span>Inglês</span></a></li>              	
        </ul>
<!--        <div id="maincontainer">
            <a href="music/katy_perry.mp3" id="kp">[ Katy Perry ]</a>
            <hr id="spacer" />
            <a href="music/beyonce.mp3" id="be">[ Beyonce ]</a>
       </div>-->
    <div class="clear"></div>
    </div>
    <div id="conteudo">
    	<div class="texto-lateral">
        	<div class="primavera-verao">
                <h2><a class="tit-primavera-ativo" href="#todo"><span>Primavera Verão 2011</span></a></h2>
                <ul id="menu-primavera-ativo">
                    <li><a href="primavera-colecoes.html" title="Coleções" class="colecao ativo"><span>Coleção</span></a></li>
                    <li><a href="primavera-bastidores1.html" title="Bastidores + Detalhes" class="bastidores"><span>Bastidores + Detalhes</span></a></li>
                    <li><a href="primavera-video.html" title="Vídeo" class="video"><span>Vídeo</span></a></li>
                </ul> 
            </div> 
        	<div class="outono-inverno">
                <h2><a class="tit-outono" href="#todo"><span>Outono Inverno 2010</span></a></h2>
                <ul id="menu-outono" style="display:none;">
                    <li><a href="outono-colecoes.html" title="Coleções" class="colecao"><span>Coleção</span></a></li>
                    <li><a href="outono-bastidores-detalhes.html" title="Bastidores + Detalhes" class="bastidores"><span>Bastidores + Detalhes</span></a></li>
                </ul> 
            </div>                          
        </div>
    	<div class="conteudo-fotos">
        	<div class="paginacao"><a href="" title=""> < Anterior</a> <a href="" title="">1</a> <a href="" title="">2 </a><a href="" title="">3</a> <a href="" title="">Próxima > </a></div>
        	<ul id="lighttbox">
            	<li><a rel="lightbox" class="lightbox" href="imagens/primavera-verao/001_2.jpg"><img src="imagens/primavera-verao/001.jpg" alt="foto1" width="206"/></a></li>
                <li><a rel="lightbox" class="lightbox" href="imagens/primavera-verao/002_2.jpg"><img src="imagens/primavera-verao/002.jpg" alt="foto2" width="206"/></a></li>
                <li><a class="lightbox" href="imagens/primavera-verao/003_2.jpg"><img src="imagens/primavera-verao/003.jpg" alt="foto3" width="206"/></a></li>
            	<li><a class="lightbox" href="imagens/primavera-verao/004_2.jpg"><img src="imagens/primavera-verao/004.jpg" alt="foto4" width="206"/></a></li>
                <li><a class="lightbox" href="imagens/primavera-verao/005_2.jpg"><img src="imagens/primavera-verao/005.jpg" alt="foto5" width="206"/></a></li>
                <li><a class="lightbox" href="imagens/primavera-verao/006_2.jpg"><img src="imagens/primavera-verao/006.jpg" alt="foto6" width="206"/></a></li>
            	<li><a class="lightbox" href="imagens/primavera-verao/007_2.jpg"><img src="imagens/primavera-verao/007.jpg" alt="foto7" width="206"/></a></li>
                <li><a class="lightbox" href="imagens/primavera-verao/008_2.jpg"><img src="imagens/primavera-verao/008.jpg" alt="foto8" width="206"/></a></li>
                <li><a class="lightbox" href="imagens/primavera-verao/009_2.jpg"><img src="imagens/primavera-verao/009.jpg" alt="foto9" width="206"/></a></li>                                
            </ul> 
        	<div class="paginacao"><a href="" title=""> < Anterior</a> <a href="" title="">1</a> <a href="" title="">2 </a><a href="" title="">3</a> <a href="" title="">Próxima > </a></div>
        </div>        
    </div>

</div>    
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Resolvi o problema assim: Em jquery.lightbox-0.5.js (sim mexi no javascript do próprio lightbox), em $('#jquery-overlay').css({... tirei a linha width: arrPageSizes[0],

Pronto, não tive mais problemas. Obrigada, o tópico finalmente está resolvido.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.