Css 背景图像在iphone和移动设备上移动和重叠，需要解决

我有一个包装器div，它包装我的页面的标题，如下所示：

<div id="wrapper">
  <div id="centered_slideshow">
     // Slideshow here, covering approx 75% of screen width...
  </div>
</div>

#wrapper{
    width:100%;
    min-width:980px;
    background:#000 url(../graphics/header_wrapper_bgr_left.jpg) no-repeat bottom left;
}
#centered_slideshow{
        margin:0 auto; //for centering the div inside the wrapper
}

//此处为幻灯片，约占屏幕宽度的75%。。。
#包装纸{
宽度：100%；
最小宽度：980px；
背景：#000 url（../graphics/header_wrapper_bgr_left.jpg）无重复左下角；
}
#幻灯片放映{
边距：0 auto；//用于将div置于包装内的中心
}

现在整个网站在移动设备上看起来很棒，除了这张背景图片。 移动设备的宽度要小得多。这导致背景图像被“移动”到移动屏幕的左下方，并且由于幻灯片在屏幕中间，它部分地与幻灯片重叠。ie背景图像与幻灯片重叠，这是我的问题

如何使图像在移动设备中不显示，并在屏幕宽度变小时（如在移动设备中）使背景图像完全不移动

---

如果您需要更多输入，请告诉我。

您可以使用媒体查询来检查屏幕大小，然后为移动设备提供不同的背景。大概是

@media screen and (max-width: 480px) {
    #wrapper{
        width:100%;
        background-image:none;
    }
}

有关媒体查询的更多信息，请点击此处：

您也可以使用jQuery来实现这一点，但我建议您只有在已经在为站点使用jQuery时才这样做。（最好不要用太多的脚本下载让用户过载。）在这种情况下

if (screen.width<480){
    $('#wrapper').css('background-image','none');
}

if（屏幕宽度