1

好的，我正在整理我的网站，但我遇到了 FireFox 和 Chrome 的问题。两种浏览器的问题都是一样的，所以我猜这是一个简单的解决方法，我只是很愚蠢。

所以我正在使用来自 ajaxblender.com 的 bgStretcher。在 IE9 上一切正常，但是当我在 FireFox 和 Chrome 上加载网站时，bgStretcher 要么没有加载，要么没有正确加载。背景不能用作背景，并且 div 被推到底部并完全移动。HTML 代码如下：

<script type="text/javascript">
$(document).ready(function(){

    //  Initialize Backgound Stretcher     
    $('body').bgStretcher({
        images: ['images/gervais_street.jpg'],
        imageWidth: 1024, 
        imageHeight: 720, 
    });

});

当我将此部分注释掉时，div 正常运行，但显然没有背景。任何人都可以看到这有什么问题吗？

这是页面的代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>gg web design</title>

<link rel="stylesheet" type="text/css" href="css/bgstretcher.css" />
<link rel="stylesheet" type="text/css" href="css/gg.css" />
<script type="text/javascript" src="js/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="js/bgstretcher.js"></script>

</head>

<body>

<!-- from ajaxblender.com -->
<script type="text/javascript">
    $(document).ready(function(){

        //  Initialize Backgound Stretcher     
        $('body').bgStretcher({
            images: ['images/gervais_street.jpg'],
            imageWidth: 1024, 
            imageHeight: 720, 
        });

    });
</script>
<!-- end ajaxblender.com script -->

<script src="js/create_menu.js"></script>
<script>
    create_menu();
</script>

<div id="content">
    <center>
        welcome to G<span class="mirror">G</span> web design.
    </center>
</div>

<div id="picture_credit">
    gervais street bridge - photo by steve moore&nbsp;&nbsp;
</div>

<script src="js/create_footer.js"></script>
<script>
    create_footer();
</script>

</body>
</html>

我知道我可能在做一些愚蠢的事情，所以要温柔。感谢大家！

4

2 回答 2

0

尝试选择文档而不是正文

$('document').bgStretcher({
    images: ['images/gervais_street.jpg'],
    imageWidth: 1024, 
    imageHeight: 720
});
于 2013-05-13T02:10:47.910 回答
0

我要尝试的第一件事是交换您加载css的顺序。将 bgstretcher.css 调用放在最后而不是第一个。

要考虑的另一件事是在现代浏览器中使用 background-size:cover。您可以将 bgstretcher 调用（包括 js 和 css）放在 IE 条件语句中来处理 IE 的背景。

这是关于该主题的一个很好的链接...

于 2013-05-13T02:27:14.370 回答