javascript wow.js 不工作
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/30855948/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
wow.js is not working
提问by Gusic industry
I have just tried to implement wow.js to my site but it wont work. I have linked everything but i don't know why it isn't working. I even added the wow.js and linked it to the html but there still seems to be nothing that is working. I also added the animate.css and still there is no effect.
我刚刚尝试在我的网站上实现 wow.js,但它不起作用。我已经链接了所有内容,但我不知道为什么它不起作用。我什至添加了 wow.js 并将其链接到 html 但似乎仍然没有任何工作。我还添加了 animate.css 仍然没有效果。
HTML
HTML
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="animate.css">
<script language="javascript" type="text/javascript"src="javascript.js"></script>
<script language="javascript" type="text/javascript" src="wow.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<title> Vids </title>
<a href="index.html"> <header> <img src="images/Logo.png" > </header></a>
</head>
<body>
<div class="vids-title">
<p>Vids</p>
</div>
<div class="video-1 wow slideInRight">
<h>Shia LaBeouf delivers the most intense motivational speech of all-time</h>
<iframe width="550" height="435"
src="https://www.youtube.com/embed/nuHfVn_cfHU">
</iframe>
</div>
<div class="video-2 wow slideInLeft">
<h>Truth or Drink (Exes)</h>
<iframe width="550" height="435"
src="https://www.youtube.com/embed/pxYpvNMbdXQ">
</iframe>
</div>
<div class="video-3 wow slideInRight">
<h>Walker broke his arm</h>
<iframe width="550" height="435"
src="https://www.youtube.com/embed/5-NXguyFFko">
</iframe>
</div>
javascript
javascript
$(function(){
new WOW().init();
});
回答by CraicerHyman
There is nothing wrong with your code - its working fine
https://jsfiddle.net/k3qaoyxe/
I included the directories as external resources and then
您的代码没有任何问题 - 它工作正常
https://jsfiddle.net/k3qaoyxe/
我将目录包含为外部资源,然后
$(function(){
new WOW().init();
});
worked fine.
工作正常。
Are you sure you have included all the libraries properly and they are loading correctly - check the network tab in your developer console.
Libraries included from cdn:
您确定您已正确包含所有库并且它们正在正确加载 - 检查开发者控制台中的网络选项卡。
cdn 中包含的库:
https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.3.0/animate.css
https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js
https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.js
https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.3.0/animate.css
https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js
https: //cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.js
回答by Skoua
<script language="javascript" type="text/javascript"src="javascript.js"></script>
<script language="javascript" type="text/javascript" src="wow.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
should probably be
应该是
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="wow.js"></script>
<script src="javascript.js"></script>
You can also get rid of language
and type
attributes, they're useless and not W3C compliant.
您还可以摆脱language
和type
属性,它们是无用的,并且不符合 W3C。
回答by Shadi Namrouti
For me, it worked well after calling WOW at the window load event in addition to document ready event:
对我来说,除了文档就绪事件之外,在窗口加载事件中调用 WOW 后它运行良好:
//At the document ready event
$(function(){
new WOW().init();
});
//also at the window load event
$(window).on('load', function(){
new WOW().init();
});