jQuery Backstretch固定高度

我已經在互聯網上看到了一些這方面的話題，但是沒有一個在解決我的問題上是相關的。我目前使用jQuery插件Backstretch，並已成功實現它作爲整個頁面的背景。但是，我想在固定高度的div內使用它。所以不是佔用整個頁面，而是作爲圖像滑塊。jQuery Backstretch固定高度

我使用Backstretch的Github的文檔來嘗試和實現它，但沒有運氣。 div本身被分割（應該是一個很大的空白區域），但沒有圖像。

感謝您的幫助！

<!DOCTYPE html> 
<head> 
    <meta charset="utf-8" /> 
    <title>Home</title> 
    <link type="text/css" rel="stylesheet" href="stylesheet.css"/> 
    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Roboto"> 
    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Crimson+Text"> 
    <script src="jquery.js"></script> 
    <script src="jquery.backstretch.js"></script> 
</head> 
<body> 
    <div class="backstretch"> 
    <script> 
     $(".foo").backstretch("test1.jpg"); 
    </script> 
    </div> 

    <div class="container"> 

     <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. </p> 
     <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. </p> 
     <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. </p> 
     <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. </p> 

    </div> 
    </body> 
</html>

隨着風格：

.backstretch{ 
width: 100%; 
height: 500px; 
}

來源

2014-03-05 NegativeX3R0

哪裏是類'foo'元素？ – showdev

看來，你選擇與直道使用一個不存在的元素（.foo）。

取而代之的是：

$(".foo").backstretch("test1.jpg");

試試這個：

$(".backstretch").backstretch("test1.jpg");

http://jsfiddle.net/89V38/

來源

2014-03-05 00:59:24 showdev

不能相信我逃脫了..非常感謝您的幫助。 – NegativeX3R0

jQuery Backstretch固定高度

回答

相關問題