Question

我想使用this动画，但我做不到。here解释了如何使用。

 <!-- third section - Services --> 
  <div id="services" class="pad-section"> 
    <div class="container"> 
      <h2 class="text-center">Our Services</h2> <hr /> 
      <div class="row text-center"> 
        <div class="col-sm-3 col-xs-6 data-aos="fade-up""> 
          <i class="glyphicon glyphicon-cloud"> </i> 
          <h4>Service 1</h4> 
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in sem cras amet. Donec in sem cras amet.</p> 
        </div> 
        <div class="col-sm-3 col-xs-6"> 
          <i class="glyphicon glyphicon-leaf"> </i>

我想引起人们注意，单词lorem ips ...具有渐隐效果

Answer 1

    <!-- third section - Services --> 
<div id="services" class="pad-section"> 
    <div class="container"> 
    <h2 class="text-center">Our Services</h2> <hr /> 
        <div class="row text-center"> 
            <div class="col-sm-3 col-xs-6" data-aos="fade-up"> 
                <i class="glyphicon glyphicon-cloud"> </i> 
                <h4>Service 1</h4> 
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in sem cras amet. Donec in sem cras amet.</p> 
            </div> 
            <div class="col-sm-3 col-xs-6"> 
                <i class="glyphicon glyphicon-leaf"> </i> 
            </div>
        </div>
    </div>
</div>

我希望您正确地使用引号和跳水结构，如上所示。之后，您还必须链接aos，Bootstrap脚本和CSS。那么您必须初始化aos。

像这样

<script>   
       AOS.init(); 
    </script>

然后它将起作用。

谢谢

滚动动画不起作用

1 个答案: