js調整大小圖像

<script type="text/javascript"> 
function carousel_bg(id) { 
    var bgimgs = ['1920x625_Sonata_homepage_image.jpg', '1920x625_Equus_homepage_image.jpg', '5_home_hero_1920x625_CF_background.jpg']; // add images here..    
    var img = bgimgs[id]; 
    var cnt = 3; // change this number when adding images..     
    $('#body').css("background-image", "url(http://www.pitstopmotors.com.ph/images/" + img + ")"); 
    id = id + 1; 
    if (id == cnt) id = 0; 
    setTimeout("carousel_bg(" + id + ")", 10000); 
} 
$(document).ready(function() { 
    carousel_bg(0); 
}); 
</script> 
</head> 
    <body id="body">

我使用上面的代碼有我的背景作爲旋轉木馬，但圖像並不完美。任何人都可以幫助我添加一個函數的腳本，這將允許我添加這些樣式寬度：100％; position：absolute; top：0; left：0;謝謝js調整大小圖像

來源

2011-08-19 jay

試試這個。而不是硬編碼cnt=3你可以得到數組的長度。您不能將背景圖像的位置設置爲絕對。

function carousel_bg(id) { 
    var bgimgs = ['bg_img1.jpg']; // add images here.. 
    var img = bgimgs[id]; 
    var cnt =  bgimgs.length; // made it dynamic 
    $('#main').css({ 
     "background-image": "url(http://www.pitstopmotors.com.ph/images/" + img + ")", 
     "position": "absolute", 
     "top": "0px", 
     "left": "0px"}); 

    id = id + 1; 
    if (id==cnt) 
     id = 0; 

    setTimeout("carousel_bg("+id+")", 10000); 
} 

$(document).ready(function() { carousel_bg(0); });

來源

2011-08-19 02:22:01 ShankarSangoli

我想他可能要到位置的CSS添加到'＃body'元素。你會注意到'＃'，這意味着它不是實際的身體，但可能是一個ID爲「body」的div。 –

@彼得 - 我看到了，我一直在想它的身體標記沒有看＃:) – ShankarSangoli

感謝您的幫助，但它不起作用：[礦體上的身體div是真實的#main我只是複製粘貼該代碼直接來自另一個網站。 – jay

只是延長這條線，你的CSS添加到#body元素：

$('#body').css({ 
"background-image": "url(http://www.pitstopmotors.com.ph/images/" + img + ")", 
"position": "absolute", 
"top": 0, 
"left": 0});

來源

2011-08-19 02:26:19

好吧背景圖片工作正常但現在它實際上使情況變得更糟。其餘的我的divs不合適。我也使用960的CSS框架將不得不做一些機智呢？ – jay

@jay我真的不能告訴你爲什麼，除非我看到其他divs的css –

以及我很確定它的960 css框架，導致其他divs不合適，但背景圖像仍然沒有'正確調整大小。我製作了1600像素×1000像素的所有bg圖像。在Photoshop中調整大小不會是一個問題，但是我希望bg圖像對所有分辨率都是通用的。 – jay

js調整大小圖像

回答

相關問題