Jquery 在firefox和IE中单击时无法加载后台

我正在做一个风格变换器，它可以改变主题“身体”的背景模式。 我成功地实现了我的模板，但不幸的是。

我已经将jQuery中的属性改为css属性，作为“背景图像”，这在所有浏览器中都很好地工作。 在这里：

但当我将jQuery代码中的CSS属性类更改为“background”时，Firefox和IE中出现了错误，因为背景不可点击。 这个：

我尝试编辑css值，但没有一个成功。 所以我希望我能在这里找到一个人来解决我的问题

唯一的原因是我想重复的模式和更大的图像不重复时，点击

感谢您的帮助， 非常感谢。

---

考虑到使用jQuery函数

设置
background
。ccs（）

似乎是Firefox中的一个bug（请参阅），我建议您坚持使用

背景图像

正如您提到的，您打算重复模式图像，但不打算重复较大的图像，我建议您使用以下方法，我已经在Firefox和IE（以及Chrome）中测试过了：




HTML
将包装较大图像列表的
div
元素的类从
patterns
更改为
images

JS
添加附加逻辑以确定单击的图像是
中的图案还是封面图像。单击事件：

jQuery(document).ready(function($) {
$('.backgrounds li').click(function(){
        $colbgSrc = $(this).css('background-image');
        if ($(this).attr('class') == 'bgnone')
            $colbgSrc = "none";
        $('body').css('background-image',$colbgSrc);
        /* Additional logic starts here */
        if ($(this).parents("div.images").length) {
            $('body').css('background-repeat','no-repeat');
            $('body').css('background-size', '100%');
        } else {
            $('body').css('background-repeat','repeat');   
            $('body').css('background-size', '');
        }
        /* Additional logic ends here */
        $.cookie('background', $colbgSrc);
        $.cookie('backgroundclass', $(this).attr('class').replace('active',''));
        $(this).addClass('active').siblings().removeClass('active');
    });     
     $(function(){
        $colbgSrc = $.cookie('background');
        $('body').css('background-image',$colbgSrc);
        $('.backgrounds').find('li.' + $.cookie('backgroundclass')).addClass('active');
    });
}); 

这太棒了，工作起来真的很有魅力。谢谢你的帮助，伙计：）你好，伙计@chiwangc我有个小问题，在大背景下刷新页面时，额外的css属性没有被识别出来，比如背景附件、位置等。图像在重复，有什么解决办法吗。regards@EnviraPhani您可以使用
$.cookie（）
（就像您对
背景图像所做的那样）在cookie中存储
背景重复
值，然后在加载页面时恢复相应的值。这真的很管用，兄弟！！！再次感谢你的修复，嗯，我只是忽略了饼干lol。谢谢，它就像一个符咒。太好了@奇旺克问候
    jQuery(document).ready(function($) {
    $('.backgrounds li').click(function(){
    $colbgSrc = $(this).css('background');
    if ($(this).attr('class') == 'bgnone')
        $colbgSrc = "none";
    $('body').css('background',$colbgSrc);
    $.cookie('background', $colbgSrc);
    $.cookie('backgroundclass', $(this).attr('class').replace('active',''));
    $(this).addClass('active').siblings().removeClass('active');
});     
 $(function(){
    $colbgSrc = $.cookie('background');
    $('body').css('background',$colbgSrc);
    $('.backgrounds').find('li.' + $.cookie('backgroundclass')).addClass('active');
});
    }); 

jQuery(document).ready(function($) {
$('.backgrounds li').click(function(){
        $colbgSrc = $(this).css('background-image');
        if ($(this).attr('class') == 'bgnone')
            $colbgSrc = "none";
        $('body').css('background-image',$colbgSrc);
        /* Additional logic starts here */
        if ($(this).parents("div.images").length) {
            $('body').css('background-repeat','no-repeat');
            $('body').css('background-size', '100%');
        } else {
            $('body').css('background-repeat','repeat');   
            $('body').css('background-size', '');
        }
        /* Additional logic ends here */
        $.cookie('background', $colbgSrc);
        $.cookie('backgroundclass', $(this).attr('class').replace('active',''));
        $(this).addClass('active').siblings().removeClass('active');
    });     
     $(function(){
        $colbgSrc = $.cookie('background');
        $('body').css('background-image',$colbgSrc);
        $('.backgrounds').find('li.' + $.cookie('backgroundclass')).addClass('active');
    });
});