salve a tutti, sto tentando di dare un effetto fade ad una slide che ho fatto ma purtroppo non riesco.. so che la spiegazione non è un granchè ma non so cos'altro scrivere xD
sotto copio i codici
HTML
codice:
<!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>slide</title>
<link rel="stylesheet" type="text/css" href="main.css" />
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.14.custom.css" rel="Stylesheet" />
<script type="text/javascript" src="jquery-1.6.1.js"></script>
<script type="text/javascript" src="script2.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.14.custom.min.js"></script>
</head>
<body>
<div id="container">
<div id="photos">
[img]1.png[/img]
[img]2.png[/img]
[img]3.png[/img]
[img]4.png[/img]
[img]5.png[/img]
</div>
<div id="slide_button"></div>
</div>
</body>
</html>
JS
codice:
// JavaScript Document
$(document).ready(function() {
var img = $("#photos img");
img.eq(0).addClass("activeimg", 1000);
i=0;
while(i[img]offbutton.png[/img]').appendTo("div#slide_button");
i++;
}
var current = $("#slide_button img");
current.eq(0).addClass("active");
$("#slide_button img.active").attr("src","onbutton.png");
function slide() {
alt = eval($("#slide_button img.active").attr('alt'))
if (alt == img.length-1) {
alt = 0;
$(img).eq(alt).addClass("activeimg");
$(img).last().removeAttr("class");
$(current).eq(alt).addClass("active").attr("src","onbutton.png");
$(current).last().attr("src","offbutton.png").removeAttr("class");
alt+1;
clearTimeout(timer);
timer = setTimeout(slide, 5000);
} else {
var alt = $("#slide_button img.active").attr('alt');
alt = eval(alt)
$(img).eq(alt).removeAttr("class");
$(img).eq(alt+1).addClass("activeimg");
$(current).eq(alt+1).addClass("active").attr("src","onbutton.png");
$(current).eq(alt).attr("src","offbutton.png").removeAttr("class");
alt = alt+1;
clearTimeout(timer);
timer = setTimeout(slide, 5000);
}
}
timer = setTimeout(slide, 5000);
$("#slide_button img").click(function() {
alt = $(this).attr('alt');
alt = eval(alt);
$("#photos img.activeimg").removeAttr("class");
$(img).eq(alt).addClass("activeimg");
$("#slide_button img.active").attr("src","offbutton.png").removeAttr("class");
$(this).addClass("active").attr("src","onbutton.png");
clearTimeout(timer);
timer = setTimeout(slide, 5000);
});
});
l'anteprima è qua
http://cactua.altervista.org/slide/