0

我正在与希望在其页面背景中使用微弱图像的客户合作,并且当用户将鼠标悬停在某个控件上时,背景图像变得清晰。我在 Firefox 中成功地做到了这一点。但是,Chrome 偶尔会给我带来麻烦。它似乎偶尔会切断背景图像的上半部分。不是每次,但有时。我不知道它是否有任何模式。这是它的样子(查看屏幕截图的左半部分)。

被切断:隔断 没有被切断:不切断 实际页面位于: https ://www.isupelive.com/isupe/web/main.php 只需使用谷歌浏览器在页面上刷新几次,问题应该复制品。

可以在页面上看到完整的 CSS 和 Javascript,但这里有一些摘录:

HTML 和 CSS:

<section id="thesection" style="background-image:url('../images/bg-95.png'); background-repeat:no-repeat; background-attachment:fixed; background-position: 0px 90px;">

Javascript/jQuery 在鼠标悬停时更改图像:

$(document).ready(function() { 
    // Preload Images 
    preload(['../images/bg-100.png', '../images/bg-95.png']);

    // Mouse over effect
    $("#logout").hover(
    function () {
        $("#thesection").css("background-image", "url('../images/bg-100.png')");
    }, 
    function () {
        $("#thesection").css("background-image", "url('../images/bg-95.png')");
    }
);

任何想法为什么会发生这种情况或如何解决它?解决方法?提前致谢...

4

0 回答 0