4

因此,我有一个标题图像,单击该图像后,它会随着传输进行动画处理,然后淡出,然后以新图像淡入。然后我可以点击新图像,它也会动画并淡出到空白区域。如何在一系列有序图像中连续设置动画/淡入淡出 - 每次点击一个新图像,无限次?

这是我到目前为止所得到的......

$(document).ready(function(){
    $("#headuh").click(function(){
        $("#headimg").transition({ skewY: '30deg' },1000);
        $("#headimg").fadeOut(function() {      
        $(this).transition({ skewY: '00deg' }) .load(function() { $(this).fadeIn(); }); 
        $(this).attr("src", "/imgurl.jpg");
4

2 回答 2

0

您可以使用名为setInterval() 的 javascript 函数;像这样:

setInterval(function(){
   //this code will keep on executing on every 2 seconds.
},2000)
于 2012-06-25T10:45:02.137 回答
0

下面的代码片段并不能完全解决您的问题,但它可能会让您走上正确的轨道,因为它会随机循环播放一组 28 张带有淡入和淡出的图像。你可以在http://moodle.hsbkob.de上看到它:

<script src="jquery-1.4.2.min.js" type="text/javascript"></script> 
<script type="text/javascript">
//<![CDATA[
var g_first_call = true;
var g_pic_old;

$(document).ready(function() {      
    pickPic();
    setInterval("pickPic()", 7500);
});

function randomPic() {
    do {
        var pic = parseInt(28*Math.random()+1);
    } while (pic == g_pic_old);  // Don't want same pic twice 

    g_pic_old = pic;

    document.getElementById("_image_").src = "./picfolder/picno" + pic + ".jpg";
}

function pickPic() {
    if (g_first_call) {
        randomPic();
        g_first_call = false;
    }

    $("#_fadee_").fadeIn(750, function() {
        $("#_fadee_").delay(6000).fadeOut(750, randomPic);
    }); 
}
//]]>
</script>
<div id="_fadee_"><img id="_image_" alt="Image" /></div>
于 2012-08-02T19:59:41.687 回答