Buenas, estoy diseñando una página que tiene un slideshow. Bueno, el problema está que en Firefox funcionma perfecto, al igual que en google chrome y seguramente en otros navegadores buenos que no he probado aun. Cuando digo navegadores buenos en realidad me refiero a todos menos Internet Explorer, en este bendito navegador me pasa que al llegar a la última página del slideshow (por el momento tiene 2 nomas) puedo seguir avanzando de páginas mostrandome un vacío....me estoy dando cuenta que no se entiende mucho lo que estoy diciendo asi que mejor dejo la dirección de la página para que puedan ver en directo el problema que tiene. Pruebenló con el Internet Explorer porque con los demás como dije enteriormente funciona perfecto. La página es[URL="http://www.compreenvirreyes.com.ar"] www.compreenvirreyes.com.ar[/URL].
Les dejo el código para ver si alguien se puede dar cuenta cual es la parte que IE está leyendo mal.
Código:
<script type='text/javascript'>
//<![CDATA[
$(function() {
var totalPanels = $(".scrollContainer").children().size();
var regWidth = $(".panel").css("width");
var regImgWidth = $(".panel img").css("width");
var regTitleSize = $(".panel h2").css("font-size");
var regParSize = $(".panel p").css("font-size");
var movingDistance = 900;
var curWidth = 800;
var curImgWidth = 150;
var curTitleSize = "20px";
var curParSize = "15px";
var $panels = $('#slider .scrollContainer > div');
var $container = $('#slider .scrollContainer');
$panels.css({'float' : 'left','position' : 'relative'});
$("#slider").data("currentlyMoving", false);
$container
.css('width', ($panels[0].offsetWidth * $panels.length) + 100 )
.css('left', "38px");
var scroll = $('#slider .scroll').css('overflow', 'hidden');
function returnToNormal(element) {
$(element)
.animate({ width: regWidth })
.find("img")
.animate({ width: regImgWidth })
.end()
.find("h2")
.animate({ fontSize: regTitleSize })
.end()
.find("p")
.animate({ fontSize: regParSize });
};
function growBigger(element) {
$(element)
.animate({ width: curWidth })
.find("img")
.animate({ width: curImgWidth })
.end()
.find("h2")
.animate({ fontSize: curTitleSize })
.end()
.find("p")
.animate({ fontSize: curParSize });
}
//direction true = right, false = left
function change(direction) {
//if not at the first or last panel
if((direction && !(curPanel < totalPanels)) || (!direction && (curPanel <= 1))) { return false; }
//if not currently moving
if (($("#slider").data("currentlyMoving") == false)) {
$("#slider").data("currentlyMoving", true);
var next = direction ? curPanel + 1 : curPanel - 1;
var leftValue = $(".scrollContainer").css("left");
var movement = direction ? parseFloat(leftValue, 10) - movingDistance : parseFloat(leftValue, 10) + movingDistance;
$(".scrollContainer")
.stop()
.animate({
"left": movement
}, function() {
$("#slider").data("currentlyMoving", false);
});
returnToNormal("#panel_"+curPanel);
growBigger("#panel_"+next);
curPanel = next;
//remove all previous bound functions
$("#panel_"+(curPanel+1)).unbind();
//go forward
$("#panel_"+(curPanel+1)).click(function(){ change(true); });
//remove all previous bound functions
$("#panel_"+(curPanel-1)).unbind();
//go back
$("#panel_"+(curPanel-1)).click(function(){ change(false); });
//remove all previous bound functions
$("#panel_"+curPanel).unbind();
}
}
// Set up "Current" panel and next and prev
growBigger("#panel_1");
var curPanel = 1;
$("#panel_"+(curPanel+1)).click(function(){ change(true); });
$("#panel_"+(curPanel-1)).click(function(){ change(false); });
//when the left/right arrows are clicked
$(".right").click(function(){ change(true); });
$(".left").click(function(){ change(false); });
$(window).keydown(function(event){
switch (event.keyCode) {
case 13: //enter
$(".right").click();
break;
case 32: //space
$(".right").click();
break;
case 37: //left arrow
$(".left").click();
break;
case 39: //right arrow
$(".right").click();
break;
}
});
});
//]]>
</script>
<body>
<div id='outer-wrapper'><div id='wrap2'>
<!-- skip links for text browsers -->
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
</span>
<div id='header-wrapper'>
<b:section class='header' id='header'/>
<div id='search-wrapper'>
<!-- MENU -->
<ul class='main-nav' id='main-nav'>
<li><a expr:href='data:blog.homepageUrl + "2010/04/principal_16.html"'>INICIO</a></li>
<li><a expr:href='data:blog.homepageUrl + "2010/04/liquidaciones.html"'>LIQUIDACIONES</a></li>
<li><a expr:href='data:blog.homepageUrl + "2008/12/formulario-de-contacto.html"'>CONTACTO</a></li>
</ul>
</div>
</div>
<div id='content-wrapper'>
<div id='crosscol-wrapper' style='text-align:center'>
<div id='slideshow'>
<div id='slider'>
<img class='scrollButtons left' src='http://1.bp.blogspot.com/_0vKyxg80gxY/Sv3uVuFDvAI/AAAAAAAAAc4/KNAzFFfgLdA/s1600/left.png'/>
<div class='scroll' style='overflow: hidden;'>
<div class='scrollContainer'>
<div class='panel' id='panel_1'>
<div class='inside'>
<ul class='gallery'>
<li><a href='http://www.compreenvirreyes.com.ar/2010/04/1.html'><img alt='Image 1' src='http://ruizemanuel.vndv.com/imagenes/rubros/slideshow/MINIATURA1.jpg'/></a></li>
<li><a href='#2'><img alt='Image 2' src='http://img31.imageshack.us/img31/7320/negociosdestacados2.jpg'/></a></li>
<li><a href='#3'><img alt='Image 3' src='http://img176.imageshack.us/img176/9892/negociosdestacados3.jpg'/></a></li>
<li><a href='#4'><img alt='Image 4' src='http://img376.imageshack.us/img376/6237/negociosdestacados4.jpg'/></a></li>
</ul>
</div>
</div>
<div class='panel' id='panel_2'>
<div class='inside'>
<ul class='gallery'>
<li><a href='#5'><img alt='Image 5' src='http://img411.imageshack.us/img411/3922/negociosdestacados5.jpg'/></a></li>
<li><a href='#6'><img alt='Image 6' src='http://img18.imageshack.us/img18/6448/negociosdestacados6.jpg'/></a></li>
<li><a href='#7'><img alt='Image 7' src='http://img251.imageshack.us/img251/7505/negociosdestacados7.jpg'/></a></li>
<li><a href='#8'><img alt='Image 8' src='http://img28.imageshack.us/img28/64/negociosdestacados8.jpg'/></a></li>
</ul>
</div>
</div>
</div>
<div id='left-shadow'/>
<div id='right-shadow'/>
</div>
<img class='scrollButtons right' src='http://1.bp.blogspot.com/_0vKyxg80gxY/Sv3uWl5XQ-I/AAAAAAAAAdg/dA2wpvTXVoI/s1600/right.png'/>
</div> </div>
En caso que alguien descubra el error, le mando a mi hermana con un moñito y vestida de colegiala.
Saludos, y gracias por su atención.