[英]Materialized Parallax isn't working
我在頁面上添加了視差代碼,但是圖像沒有出現,當我從圖像容器中刪除“視差”類時,圖像出現了,但是沒有視差效果,
<div class="parallax-container">
<div class="parallax"><img src="content/img/wood.jpg"></div>
</div>
<div class="section white">
<div class="row container">
<h2 class="header">Parallax</h2>
<p class="grey-text text-darken-3 lighten-3">Parallax is an effect where the background content or image in this case, is moved at a different speed than the foreground content while scrolling.</p>
</div>
</div>
<div class="parallax-container">
<div class="parallax"><img src="content/img/wood.jpg"></div>
</div>
<script type="text/javascript">
var elem = document.querySelector('.parallax');
var instance = M.Parallax.init(elem, options);
// Or with jQuery
$(document).ready(function(){
$('.parallax').parallax();
});
</script>
這些是我添加的庫
<script src="app\lib\angular.min.js"></script>
<script src="app\lib\angular-route.min.js"></script>
<script src="app\lib\angular-aria.min.js"></script>
<script src="app\lib\angular-messages.min.js"></script>
<script src="app\lib\angular-animate.min.js"></script>
<link rel="stylesheet" href="app\lib\angular-material.min.css">
<script src="app\lib\angular-material.min.js"></script>
<link rel="stylesheet" href="content/css/styles.css">
<!--Materialize-->
<link href="materialize\css\icon.css" rel="stylesheet">
<link rel="stylesheet" href="materialize/css/materialize.min.css">
<link rel="stylesheet" href="app\lib\Roboto.css">
<script src="app\app.js"></script>
<script type="text/javascript" src="materialize\js\jquery.3.2.1.min.js"></script>
<script src="materialize\js\materialize.min.js"></script>
您的錯誤在於嘗試在Javascript代碼中兩次初始化該函數。 同樣(至少在我看來是這樣),我偶爾會在初始化組件實現時使用香草JS接收錯誤。 您可以執行的操作:(刪除原始JS代碼並將其添加到文件末尾,最好在body標簽末尾下方)
<script>
$(document).ready(function(){
$('.parallax').parallax();
});
</script>
確保在實現腳本之前調用jquery,如下所示:
<script type="text/javascript" src="materialize\js\jquery.3.2.1.min.js">
</script>
<script src="materialize\js\materialize.min.js"></script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.