Buenas a todos:
Tengo una web con un slide que funcionaba perfectamente, pero me puse a meterle un formulario en el sidebar que apareciera con un efecto jquery y que manda un presupuesto por email.
Desde que empecé con el formulario ya no se ejecuta el slide, pero no sé exactamente desde cuándo ha dejado de funcionar.
HEADER:
Código HTML:
<!--[if lt IE 7]>
<script type="text/javascript" src="js/jquery/jquery.js"></script>
<script type="text/javascript" src="js/jquery/jquery.dropdown.js"></script>
<![endif]-->
<script type="text/javascript" src="lightbox/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="lightbox/js/lightbox.js"></script>
<!--GALERÍA DINAMICA LIGHTBOX-->
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
var pre = jQuery.noConflict();
pre(document).ready(function(){
pre("#boton_presupuestos").click(function(){
pre("#boton_presupuestos").fadeOut(350, function(){
pre("#foto3").fadeOut(350, function(){
pre("#foto2").fadeOut(350, function(){
pre("#foto1").fadeOut(350, function(){
document.getElementById("presupuesto").className = "presupuesto";
pre("#presupuesto").slideDown("slow");
});
});
});
});
});
});
</script>
<script type="text/javascript">
function validarPresupuesto() {
// Revisar los datos obligatorios
var mensaje = "";
if (document.getElementById("nombre").value.length == 0)
{
mensaje = "Debe indicar su nombre";
document.getElementById("nombre").style.backgroundColor = "#FFFF99";
}
if (document.getElementById("email").value.length == 0)
{
document.getElementById("email").style.backgroundColor = "#FFFF99";
if (mensaje == "")
{
mensaje = "Debe indicar su e-mail";
}
else
{
mensaje += " y su e-mail";
}
}
if (mensaje != "")
{
alert(mensaje);
}
else
{
document.getElementById("presupuesto").submit();
}
}
</script>
<?php
if ($current == "inicio")
{
?>
<script>
$(function() {
$("#slide > div:gt(0)").hide();
setInterval(function() {
$('#slide > div:first')
.fadeOut(1000)
.next()
.fadeIn(1000)
.end()
.appendTo('#slide');
}, 3000);
});
</script>
<?php
}
?>
<?php
if ($current == "colores")
{
?>
<?php
include("inc/config.php");
$i = 1;
$j = 1;
$sql = "SELECT `ID`, `Referencia`, `ColorHex` FROM `Color` WHERE `Paleta` = 'Interior'";
$result = mysql_query($sql,$link);
$numColors = mysql_num_rows($result);
$numRelleno = 10 - $numColors%10;
print".wp$i {\n";
print "\theight: 48px;\n";
print "}\n";
print "\n";
print "\t.wp$i div {\n";
print "\t\twidth: 100%;\n";
print "\t\tmargin-bottom: 10px; }\n";
while (list($id, $referencia, $color) = mysql_fetch_row($result)) {
if ($j == 11) {
$i++;
$j = 1;
print".wp$i {\n";
print "\theight: 48px; }\n";
print "\n";
print "\t.wp$i div {\n";
print "\t\twidth: 100%;\n";
print "\t\tmargin-bottom: 10px; }\n";
}
print ".g$i$j {\n";
print "\twidth: 48px;\n";
print "\tbackground-color: #$color;\n";
print "\tline-height: 0px;\n";
print "\tfont-size: 0;\n";
print "\tfont-weight: bold;\n";
print "\tfont-family: \"HelveticaNeue-Light\", \"Helvetica Neue Light\", \"Helvetica Neue\", Helvetica, Arial, sans-serif; }\n";
print "\n";
print "\t.g$i$j:hover {\n";
print "\t\twidth: 46px;\n";
print "\t\tbackground-color: #FFF;\n";
print "\t\tline-width: 48px;\n";
print "\t\tborder-style: dashed;\n";
print "\t\tborder-width: thin;\n";
print "\t\tborder-color: #999;\n";
print "\t\ttext-align: center;\n";
print "\t\tcolor: #999;\n";
print "\t\tfont-size: 13px; }\n";
$j++;
}
for ($counter = 1;$counter <= $numRelleno;$counter++) {
print ".g$i$j { width: 48px; }\n";
$j++;
}
?>
<?php } ?>
</style>
</head>
SLIDE:
Código HTML:
<div id="slide">
<div><img src="images/slide/photos/0.jpg" width="551" height="235" alt="Azulejos artesanos" /></div>
<div><img src="images/slide/photos/1.jpg" width="551" height="235" alt="Azulejos artesanos" /></div>
<div><img src="images/slide/photos/2.jpg" width="551" height="235" alt="Azulejos artesanos" /></div>
<div><img src="images/slide/photos/3.jpg" width="551" height="235" alt="Azulejos artesanos" /></div>
<div><img src="images/slide/photos/4.jpg" width="551" height="235" alt="Azulejos artesanos" /></div>
</div>
Lo que ocurre es que el slide no hace las transiciones, sólo se ve la última imagen (que está sobre el resto de las imágenes del slide).
Gracias a todos por vuestro tiempo.