簡體   English   中英

谷歌瀏覽器中未出現視差圖像

[英]Parallax image not appearing in google chrome

我在 xampp 中嘗試了這個代碼筆,但它不起作用。

在此處輸入圖片說明

我的html代碼:

<html>
<head>
<link type="text/css" href="./Products/style.css" rel="stylesheet" /></link>


</head>
<body>
<div class="container">
  <section>
    <div class="image" data-type="background" data-speed="2"></div>
    <div class="stuff" data-type="content"><h1>Simple Parallax scroll</h1><h2>Reoptimized</h2></div>
  </section>

  <section>
    <div class="image" data-type="background" data-speed="7"></div>
    <div class="stuff" data-type="content"><h2>Made to be fast</h2><p>Lorem Deserunt maiores minima ipsa. Adipisci, corrupti, voluptatibus! Similique quidem necessitatibus provident.</p></div>
  </section>

  <section>
    <div class="image" data-type="background" data-speed="6"></div>
    <div class="stuff" data-type="content">Accusamus at ex amet perferendis atque fuga, ad earum, ipsa perspiciatis, dolore neque, accusantium consectetur quis voluptatibus culpa architecto animi natus facere expedita sed. Voluptatem odit explicabo amet neque aut.</div>
  </section>

  <section>
    <div class="image" data-type="background" data-speed="5"></div>
    <div class="stuff" data-type="content">Accusamus at ex amet perferendis atque fuga, ad earum, ipsa perspiciatis, dolore neque, accusantium consectetur quis voluptatibus culpa architecto animi natus facere expedita sed. Voluptatem odit explicabo amet neque aut.</div>
  </section>

  <section>
    <div class="image" data-type="background" data-speed="3"></div>
    <div class="stuff" data-type="content">Accusamus at ex amet perferendis atque fuga, ad earum, ipsa perspiciatis, dolore neque, accusantium consectetur quis voluptatibus culpa architecto animi natus facere expedita sed. Voluptatem odit explicabo amet neque aut.</div>
  </section>

  <section>
    <div class="image" data-type="background" data-speed="3"></div>
    <div class="stuff" data-type="content">Accusamus at ex amet perferendis atque fuga, ad earum, ipsa perspiciatis, dolore neque, accusantium consectetur quis voluptatibus culpa architecto animi natus facere expedita sed. Voluptatem odit explicabo amet neque aut.</div>
  </section>
</div>


<script src="./Products/js.js"></script>
</body>
<html>

有導出代碼 zip 文件的選項,可以正常工作。

在此處輸入圖片說明

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM