图像淡出到另一个，然后函数加载新的网页

Image Fades Into Another, then function loads new web page

本文关键字：加载 网页 函数 然后 淡出 另一个 图像      更新时间：2023-09-26

基本上我想要一个类似的效果。

我想让我的网站的第一页有一个图像褪色成另一个图像通过点击一个按钮，然后有一个功能打开一个不同的页面后约2秒，使用计时器。

我有切换图像的代码，这是基于上面的例子，我不太精通JavaScript，所以我的麻烦是编写一个JavaScript函数，将加载一个新的页面后约2秒从第二个图像出现

不像示例中那样使用css动画，而是使用jQuery来制作动画，并使用完整的函数来完成转发:

$("#cf_onclick").click(function() {
    $("#cf_onclick").animate(
        {"background-image": "img2.jpg"},
        2000,
        'linear',
        function() {
             window.location.href = "page2.html";
        }
    );
});

您还应该考虑将两个图像放在一个图像文件中并切换背景位置，或者覆盖两个img标记并淡出第一个图像，否则浏览器将需要在动画开始时加载第二个图像。

相关文章：