Hola compañeros. Pues como vi que el compa tiene un problema como el mio y el ni hizo caso, no me queda mas remedio que exponer el mio a ver si alguien me puede ayudar.
El problema es igual, al mostrar en firefox se muestra un margen y en explorer se ve como quiero que se vea. Tengo el codigo html y mando llamar un archivo que contiene la imagen que se va a mostrar. el archivo que se incluye tiene un css y a su vez manda llamar codigo javascritp el cual no creo que sea el problema.
Bueno, aqui voy a poner el código html de la parte donde mando llamar el archivo que muestra la imagen:
Código HTML:
<tr>
<td width="823" height="161" align="left"><? include("includes/slideshow.php");?></td>
</tr> Este es el código que se manda llamar:
Código HTML:
<!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>s3Slider jQuery plugin</title>
<!-- CSS -->
<style type="text/css" media="screen">
#slider {
width: 823px; /* important to be same as image width */
height: 161px; /* important to be same as image height */
position: relative; /*important */
overflow: hidden; /*important */
}
#sliderContent {
width: 823px; /* important to be same as image width or wider */
height: 161px;
position: relative;
top: 0;
margin-left: 0;
}
.sliderImage {
height: 161px;
position: absolute;
display: none;
}
.sliderImage span {
position:absolute;
font: 10px/15px Arial, Helvetica, sans-serif;
/*padding: 20px 40px;*/
padding: 0px 0px 0px 0px;
width: 823px;
/* height: 30px; */
background-color: #000;
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
color: #fff;
display: none;
}
.clear {
clear: both;
}
.sliderImage span strong {
font-size: 14px;
}
.top {
top: 0;
left: 0;
text-align:right;
right: 0;
}
.bottom {
bottom: 0;
left: 0;
}
ul { list-style-type: none;}
</style>
<!-- JavaScripts-->
<script type="text/javascript" src="includes/js/jquery.js"></script>
<script type="text/javascript" src="includes/js/s3Slider.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#slider').s3Slider({
timeOut: 5000
});
});
</script>
</head>
<body>
<div id="slider" align="left">
<ul id="sliderContent">
<li class="sliderImage">
<img src="imagenes/banner1.jpg"/>
<span class="top"><strong>Cerro de la cruz.</strong><br />Imagen tomada desde la toma de agua</span>
</li>
<li class="sliderImage">
<img src="imagenes/banner2.jpg" />
<span class="top"><strong>Ruiz Nayarit</strong><br />Imagen panorámica de Ruiz Nayarit</span>
</li>
<li class="sliderImage">
<img src="imagenes/banner3.jpg" />
<span class="top"><strong>Puente del ferrocarril</strong><br />Sobre rio San Pedro</span>
</li>
<li class="sliderImage">
<img src="imagenes/banner4.jpg" />
<span class="top"><strong>Plaza principal</strong><br />Situada en el centro de Ruiz Nayarit</span>
</li>
<li class="sliderImage">
<img src="imagenes/banner5.jpg" />
<span class="top"><strong>Rio San Pedro</strong><br />Imagen panorámica del cauce del rio</span>
</li>
<li class="sliderImage">
<img src="imagenes/banner6.jpg" />
<span class="top"><strong>Paso del ferrocarril</strong><br />sobre el puente del rio San Pedro</span>
</li>
<li class="sliderImage">
<img src="imagenes/banner7.jpg" />
<span class="top"><strong>Arco de la entrada de Ruiz Nayarit</strong><br />Dando la bienvenida a todos los visitantes</span>
</li>
<div class="clear sliderImage"></div>
</ul>
</div>
</body>
</html> Como ven ahi dentro va el código CSS y es el que pienso que me da el problema.
Bueno, me despido esperando una pronta respuesta.
Gracias...