javascript - 动画背景图像到另一个 - CSS/JQuery

标签 javascript jquery css

<分区>

我的 HEADER 元素有一张背景图片,我需要在延迟 3 秒后将它换成另一张图片,我在互联网上找遍了,但找不到解决方案!我已经尝试过 CSS3 和 Jquery,但我就是无法让它工作。

由于网站的构建方式,更改的元素必须是背景图像,而不是 HEADER 元素中的嵌套 Div。


--- 已解决/解决方案 ---

JS

 $(document).ready(function() {
      $("header").delay(5000).queue(function() {
          $(this).css({
              "background-image": "url(<?php bloginfo('template_url') ?>/img/header-boy-hover.jpg)"
          });
      });
  });

CSS

header {
    -webkit-transition:all 1s ease-in;
    -moz-transition:all 1s ease-in;
    -o-transition:all 1s ease-in;
    -ms-transition:all 1s ease-in;
    transition:all 1s ease-in;
}

最佳答案

以前有人问过类似的问题 - 这应该会给你答案

Change CSS background-image with different intervals via jQuery

关于javascript - 动画背景图像到另一个 - CSS/JQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25403497/

上一篇:html - HTML 和 Photoshop 中的 RGB 颜色

下一篇:html - 如何在CSS中将图像隐藏在图像上

相关文章:

javascript - 原型(prototype)和 jQuery 同时加载时的错误

javascript - 使用 Javascript/Jquery 用图像替换单词

jQuery 将文本添加到标记并删除不起作用

javascript - 为多对多模型创建记录 EmberJS 2.6

javascript - 根据ajax中的另一个td名称设置td值

php - jQuery slider 值保存

html - 如何在 div 中定位图像和文本?

html - 如何使用CSS在外部div上绘制内部div?

javascript - 在下划线中连接两个数组的最佳方法

javascript - XHTML 中的 JavadScripting 最新更新