Question

我正在尝试将视差效果添加到this link

的html页面中

我能够在不使用角度js的情况下实现它。但是，如果我使用angularjs库图像不显示。即使我无法看到任何图像。

我的示例代码如下所示

    <link rel="stylesheet" type="text/css" href="/node_modules/bootstrap/dist/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="/assets/js/lib/parallax.min.js"></script>
<script type="text/javascript"  src="/node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/node_modules/angular/angular.min.js"></script>
<script type="text/javascript" src="/node_modules/angular-route/angular-route.min.js"></script>

代码是

      <div class="parallax-window" data-parallax="scroll" data-image-src="https://pixelcog.github.io/parallax.js/img/stellar-spire-eagle-nebula-1400x900.jpg">test</div>

Answer 1

我遇到了你的问题...我用一个指令解决了......但也许对你来说并不是真的有必要......你是否只是试图通过js初始化视差？

$('#your-div').parallax({ imageSrc: 'your_path_img' });

让我知道它是否有效......否则我让你看看如何创建一个指令

Answer 2

我从视差显示的页面控制器激活了视差：

  app.controller('HomeController', function (){
    $('.parallax').parallax();
  });

效果很好

角js中的视差效果不起作用

2 个答案: