頁面背景圖片的拉伸實(shí)現(xiàn)代碼

字號(hào)： 小 中 大


    代碼如下:
    <span><strong><span>1.用js插入一張圖片并控制圖片寬高</span></strong></span>
    代碼如下:
    <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
    <script type="text/javascript">
    $(function(){
    $(".bd").append("<div id='mainbg'/>");
    $("#mainbg").append("<img id='im' src='a82a2e72e7af59296db0d63e3d2ecc5e!n1200.jpg' />");
    recover();
    $(window).resize(function(e) {
    recover();
    });
    });
    function recover(){
    var winw = $(window).width();
    var winh = $(window).height();
    $("#im").attr({width:winw, height:winh});
    }
    </script>
    利用CSS按比例縮放背景圖片
    代碼如下:
    <style type="text/css">
    .bd{
    background-image:url(a82a2e72e7af59296db0d63e3d2ecc5e!n1200.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    }
    </style>
    <body>
    </body>