javascript - JQuery - Chrome 中的背景图像旋转问题(仅在 F5 刷新后有效)。在 FF、Safari、IE 中没有问题-6ren

javascript - JQuery - Chrome 中的背景图像旋转问题(仅在 F5 刷新后有效)。在 FF、Safari、IE 中没有问题

转载作者：行者123 更新时间：2023-11-30 13:30:12

25

4

这是我遇到的问题的描述:

以下脚本将每 10 秒轮换五个背景图像；它在 IE、FF 和 Safari 中完美运行 - 但在 Chrome 中，背景图像只会旋转一次，并且不会旋转更多图像，除非我通过 F5 刷新浏览器。然后所有图像都按预期的间隔旋转，宇宙就一切正常了。

我一直在为这个问题绞尽脑汁:对于旋转功能，我在 setTimeout/setInterval 之间切换，对于图像预加载的好措施，我已经在 $(window).load(function()/$(document).ready(function() 之间进行了交换，但似乎没有任何效果 - 我总是需要刷新 Chrome 以便发生多个图像旋转。重申一下，Chrome 将在页面加载后的最初 10 秒后翻转到第一张图像，但在那之后， radio 静默- 除非刷新页面，否则不会旋转其他图像。

我使用的是 JQuery v1.6.2 和 Chrome 13.0.782.112

这是代码，我已经包含了 javascript、加载它的 HTML 以及相关的 CSS 以备不时之需。

任何见解将不胜感激!

rotateBg.js(首先创建图像路径数组，然后预加载，然后旋转)

    $(window).load(function(){ 

    var imgArr = new Array( // relative paths of images
    './images/bg_neon.jpg',
    './images/bg_trees.jpg',
    './images/bg_dancing.jpg',
    './images/bg.jpg'
    );

    var preloadArr = new Array();
    var i;

    /* preload images */
    for(i=0; i < imgArr.length; i++){
    preloadArr[i] = new Image();
    preloadArr[i].src = imgArr[i];
    }

    var currImg = 1;
    var intID = setTimeout(changeImg, 10000);

    /* image rotator */
    function changeImg(){
        $('.bg_image').animate({opacity: 0}, 1000, function(){
        $(".bg_image").attr('src',preloadArr[currImg++%preloadArr.length].src);
        }).animate({opacity: 1}, 1000);
    }
});

index.html

    <head>
        <link rel="stylesheet" media="screen" type="text/css" href="./styles/home.css">
        <script type="text/javascript" src="./scripts/jquery.js"></script>
        <script type="text/javascript" src="./scripts/rotateBg.js"></script>

    </head>
    <body>

        <img class="bg_image" src="./images/bg.jpg"/>

    </body>

home.css(这只是用来在给定屏幕大小调整的情况下保持背景成比例)

img.bg_image {
    /* Set rules to fill background */
    min-height: 100%;
    min-width: 1024px;
    z-index:-1;

    /* Set up proportionate scaling */
    width: 100%;
    height: auto;

    /* Set up positioning */
    position: fixed;
    top: 0;
    left: 0;
}

@media screen and (max-width: 1024px){
    img.bg_image {
    left: 50%;
    margin-left: -512px; }
}

最佳答案

我在 IE8、Safari 和 Chrome 中试过你的脚本。它在任何浏览器中都不适合我。如果我添加 setTimeout(changeImg, 10000); 我可以让它工作作为 changeImg() 函数的最后一行:

function changeImg(){
    $('.bg_image').animate({opacity: 0}, 500, function(){
    $(".bg_image").attr('src',preloadArr[currImg++%preloadArr.length].src);
    }).animate({opacity: 1}, 500);
    setTimeout(changeImg, 3000);
}

干杯!

关于javascript - JQuery - Chrome 中的背景图像旋转问题(仅在 F5 刷新后有效)。在 FF、Safari、IE 中没有问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7058829/

25

4

0

文章推荐： c# - Krypton Toolkit 控件未显示在窗体中

文章推荐： ios - 如何防止用户输入密码时文本移动？

文章推荐： php - 表单验证

文章推荐： c# - 使用 WPF C# 中的多个控件组合创建自定义控件

typescript - let f :F = f` and `let f = f` 有什么区别
我有以下代码: interface F { (): string; a(): number; } function f() { return '3'; } f['a'] = f
c++ - 交替排序数组的最简单方法是什么(例如 :T, T,F,F,F,T,F,T,F,F,F 到 T,F,T,F,T,F,T,F,T,T ,T)?
比如我有一个 vector vector > v={{true,1},{true,2},{false,3},{false,4},{false,5},{true,6},{false,7},{true,8
Haskell - 如何写 (.) f f = (\x -> f (f x))
我需要编写一个要在 GHCi 上运行的模块，并将函数组合为相同的函数。这个(经典的fog(x) = f(g(x)))运行: (.) f g = (\x -> f (g x)). 当我尝试这样写时出现问
c - 如何使其在动态规划中适用于 f[i] = max(f[i], f[i - 1] + f[i]) ？
动态规划这里有一个问题大写字母AZ对应于整数[-13,12]，因此一个字符串对应于一整列。我们将对应的整列的总和称为字符串的特征值。例如:字符串ACM对应的总体列为{-13,-11,-1}，则ACM
f# - F-Sharp (F#) 无类型无穷大
我想知道为什么 F-Sharp 不支持无穷大。这适用于 Ruby(但不适用于 f#): let numbers n = [1 .. 1/0] |> Seq.take(n) -> System.Div
f# - 如何在已编译的 F# 程序中执行在字符串中找到的 F# 代码？
如何从已编译的 F# 程序中的字符串执行 F# 代码？最佳答案这是一个小脚本，它使用 FSharp CodeDom 将字符串编译为程序集，并将其动态加载到脚本 session 中。它使用类型扩展
f# - 如何在 F# 列表和 F# 元组之间进行转换？
有什么方法可以在 F# List 和 F# Tuple 之间转换？例如: [1;2;3] -> (1,2,3) (1,2,3,4) -> [1;2;3;4] 我需要两个函数来做到这一点: le
f# - 如何加载外部 F# 脚本文件并在 F# 交互中使用它？
我想将一个或多个 .fsx 文件加载到 F# 交互中，并将 .fsx 文件中定义的所有函数都包含在作用域中，以便我可以直接使用控制台中的功能。 #load 指令执行指定的 .fsx 文件，但随后我无法
scala - 将 F-Algebra[F, A] 组合成 F-Algebra[F, Seq[A]]
我正在尝试像 this page 中那样编写 F 代数.不同之处在于，不是用元组组合，而是像这样: type FAlgebra[F[_], A] = F[A] => A def algebraZip[
f# - F# Quotations 能否用于创建适用于任意 F# 记录类型的函数？
给定一个 F# 记录: type R = { X : string ; Y : string } 和两个对象: let a = { X = null ; Y = "##" } let b = {
c++ - 有一个只有文件名(a、f/a、f/b、f/f/c 等)的 std::set 如何通过给定的 f/列出目录？
所以我们有一组文件名\url，如file、folder/file、folder/file2、folder/file3、folder/folder2/fileN等。我们得到一个字符串，如文件夹/。我们想
f# - F# 中的字符值
假设我有一个字符串“COLIN”。这个字符串的数值是: 3 + 15 + 12 + 9 + 14 = 53. 所以 A = 1, B = 2, C = 3, and so on. 为此，我什至不知道
f# - F# 可以同时使用构造函数参数和属性初始值设定项吗？
在 C# 中，我有以下代码来创建一个对象实例。 var myObject = new MyClass("paramvalue") { Property1 = "value1" Proper
f# - F#标准库中是否有生成常量函数的函数？
即，标准库中有这样的函数吗？ let ret x _ = x 为了保持代码可读性，我想尽量减少自制基本构建功能构建块的数量，并使用现有的东西。最佳答案不。你可能想看看 FSharpX。关于f#
f# - 对列表列表中的索引进行排序 - F#
目前，我有一个函数可以将列表中每个列表的第一个元素( float )返回到单独的列表。 let firstElements list = match list with | head:
f# - F#中不可变集合和映射的样式是什么
我刚刚解决了problem23在 Project Euler 中，我需要一个 set 来存储所有丰富的数字。 F# 有一个不可变集合，我可以使用 Set.empty.Add(i) 创建一个包含数字 i
f# - F#中以2为底的对数
F＃语言具有计算自然对数的函数log和计算以10为底的对数的log10。在F＃中以2为底的对数的最佳计算方法是什么？最佳答案您可以简单地使用以下事实：“ b的a对数” = ln（b）/ ln（a
f# - F# 中的并行存在函数
动机我有一个长时间运行的 bool 函数，它应该在数组中执行，如果数组中的元素满足条件，我想立即返回。我想并行搜索并在第一个完整线程返回正确答案时终止其他线程。问题在 F# 中实现并行存在函数的
f# - F# 中的上下文敏感数据处理
我最近完成了一个生成字符串列表的项目，我想知道执行此操作的最佳方法。字符串生成是上下文敏感的，以确定它是否可以接受(这是游戏中的一系列游戏，所以你必须知道最后一次游戏是什么) 我这样做的方法是使用一
f# - F# 引用有什么用吗？
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the he

首页

博学

6Ren·AI

商城

javascript - JQuery - Chrome 中的背景图像旋转问题(仅在 F5 刷新后有效)。在 FF、Safari、IE 中没有问题