Google雲與網頁設計
一、下載套件:
https://raw.githubusercontent.com/srobbin/jquery-backstretch/master/jquery.backstretch.min.js
將上列存至 class/backstretch/
二、引入套件:
<script src="class/backstretch/jquery.backstretch.min.js"></script>三、設定
- 若無圖片可至這裡下載合法使用的圖片:https://pixabay.com/
-
<script type="text/javascript">
$(document).ready(function(){
$('.top-content').backstretch([
"img/3.jpg"
, "img/2.jpg"
, "img/1.jpg"
], {duration: 3000, fade: 750});
});
</script>
四、HTML
<div class="top-content" style="height:560px;"> </div>五、修正與導航的內距
style="margin-bottom:0px;"