Question

我想改变身体上的背景颜色，以便在幻灯片更改时混合颜色，但面对问题可以帮助我。这是我对幻灯片更改的功能，但不知道我在做什么错。我的网站网址是http://krakenworldwide.com/destinations/`

    function imgbackground() {
        if (jQuery('.slide a').hasClass('a1')) {
            jQuery('body').css({
                'background-color': '#63bcf8',
                'background-image': 'none'
            });
        } else if (jQuery('.slide a').hasClass('a2')) {
            jQuery('body').css({
                'background-color': '#d7e5f2',
                'background-image': 'none'
            });
        } else if (jQuery('.slide a').hasClass('a3')) {
            jQuery('body').css({
                'background-color': '#a3cff4',
                'background-image': 'none'
            });
        } else if (jQuery('.slide a').hasClass('a4')) {
            jQuery('body').css({
                'background-color': '#fefefe',
                'background-image': 'none'
            });
        } else {
            jQuery('body').css({
                'background-color': '#fff',
                'background-image': 'none'
            });
        }
    }


    window.setInterval(function () {
        imgbackground()
    }, 1000);

Answer 1

不幸的是，我没有太多时间来筛选您的代码（它已经遍布整个地方）但我注意到了一些可能对您有所帮助的事情：

您正在链接到2个不同版本的JQuery，您有一个链接到版本＆＃34; ... 1.10.2＆＃34;在你的＆＃34; wp-includes＆＃34;文件夹及以下链接到版本＆＃34; ... 1.7.1.min.js＆＃34;在你的＆＃34; wp-content＆＃34;夹。订单中较低的一个将覆盖较高的一个。
您需要在所有其他插件之前加载主JQuery库，以便在所有其他脚本链接上移动您想要的任何版本。
您的幻灯片功能似乎正在更改display中每个锚标记的z-index，left和<div class="slides-control"...>属性，但每个人的类都会更改锚标记保持不变，因此上面写的函数不会起作用，因为'.slide a'总是有一个a1类，它总是有一个a2类，依此类推。 / p>
有很多方法可以完成您要查找的内容，但您可以尝试为<div class="slides-control"...>中的每个锚标记分配一个ID。然后根据哪个锚标记具有display:block;

所以你的代码看起来像这样：

function imgbackground() {
    if ($('#anchor1').css('display') == 'block') {
        $('body').css({
            'background-color': '#63bcf8',
            'background-image': 'none'
        });
    } else if ($('#anchor2').css('display') == 'block') {
        $('body').css({
            'background-color': '#d7e5f2',
            'background-image': 'none'
        });
    } else if ($('#anchor3').css('display') == 'block') {
        $('body').css({
            'background-color': '#a3cff4',
            'background-image': 'none'
        });
    } else if ($('#anchor4').css('display') == 'block') {
        $('body').css({
            'background-color': '#fefefe',
            'background-image': 'none'
        });
    } else {
        $('body').css({
            'background-color': '#fff',
            'background-image': 'none'
        });
    }
}

我也没有看到你在调用你的功能的任何地方。

你需要做身体：<body onload="imgbackground()">...</body>

或者使用JQuery .ready（）方法：

$(document).ready(function() {
    // your "imgbackground" function here
}

希望有所帮助。

在幻灯片更改时更改正文颜色

1 个答案: