-2

我有一个随机选择新背景图像的 Javascript。

<script  type="text/javascript">
    function changeImg(imgNumber)   {
        var myImages = ["images/001.jpg", "images/002.jpg", "images/003.jpg",      "images/004.jpg"]; 
        var imgShown = document.body.style.backgroundImage;
        var newImgNumber =Math.floor(Math.random()*myImages.length);
        document.body.style.backgroundImage =      'url('+myImages[newImgNumber]+')';
    }
    window.onload=changeImg;
    </script>

我想知道如何调整该图像的大小。另外，我想知道如何使图像不固定在页面上，而是正常滚动页面。

4

2 回答 2

0

您可以尝试在 CSS3 中使用媒体查询或使用 jQuery 进行一些编码。 https://developer.mozilla.org/en-US/docs/CSS/Media_queries

希望这可以帮助你

于 2013-02-21T04:59:30.287 回答
0

据我所知，您无法使用 css 调整正文中背景图像的大小。但您可以在下面实现相同的 senario。

<html>
    <head>
        <style type="text/css">
            .bgimage{
                position:absolute;
                top:0;
                left:0;
                z-index:-1;
                width:500px;
                height:200px;
            }
            .content{
                position:relative;
                z-index:1;
            }
            p{
                color:#fff;
            }
        </style>
    </head>
    <body>
        <img class="bgimage" src="http://www.hdwallpapersarena.com/wp-content/uploads/2012/07/Download-Hulk-HD-Wallpaper-For-Computer.jpg" />
        <div class="content">
            <p>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis condimentum vestibulum elementum. Nunc cursus sem et odio porttitor bibendum. Nulla facilisi. Phasellus egestas sodales sapien, ut ullamcorper metus aliquam ac. Sed tellus ipsum, mattis nec vulputate non, ultrices vel mi. Etiam sodales porta nibh, dignissim porta eros viverra in. Nullam non augue lacus. Nullam et neque a arcu pellentesque mattis quis semper lectus. Ut a urna velit. Integer elementum, eros eu ullamcorper pretium, nisl est congue nibh, in aliquam risus massa nec lacus. Praesent blandit felis massa, ut suscipit lacus. Pellentesque sodales nulla at enim lobortis egestas ac ac urna. Pellentesque varius, erat ut mattis sodales, augue nisi luctus nibh, id ultrices lectus lectus feugiat mauris.
            </p>
        </div>
    </body>
</html>

如果您想了解更多详细信息，请告诉我...

于 2013-02-21T04:49:22.610 回答