javascript - CSS 动画到 javascript 幻灯片

标签 javascript html css

/* JavaScript */

var slides=0;
var array=new Array('back.jpg','banner.jpg','ana.jpg');
var length=array.length-1;

$(document).ready(
    function(){   
        setInterval(function(){
            slides++;
            if (slides<0)
            {
                slides=length;
            }
            if (slides>length)
            {
                 slides=0;
            } 
           document.slide.src=array[slides];
     },4000)
})

<!-- HTML -->

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
   
    <img src="ana.jpg" id="slidess" name="slide" width="200px" height="100px">
   
</body>
</html>

大家好!请帮我添加 css 动画到这张幻灯片!我尝试了很多可能性......但没有一个成功。我尝试添加一个动画开始类，并在函数末尾添加一个动画结束类来替换该类，但它不起作用!

最佳答案

正如@pirate所说，你正在使用js并且你想使用css来制作动画。您需要重构您的代码。看看这个 article 中的例子。以及作者使用的技术。

这很好article解释如何制作简单的 HTML、jQuery css slider 。

您想在代码中添加哪种动画？

关于javascript - CSS 动画到 javascript 幻灯片，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39931339/