javascript - 我的 Javascript 似乎不起作用(部分)
问题描述
我正在尝试使用延迟和显示为我的欢迎文本提供一些动画。当我在本地测试时,一切正常。但是,当我尝试在实时服务器上运行它时,“延迟首次加载”和“首页的 jquery”中的代码根本不起作用,而“响应式操纵器”部分中的代码有效???如果整个脚本不起作用,那么我可能会想出一些东西,但奇怪的是其中一些正在起作用。
谁能告诉我发生了什么?
这是HTML
<div ng-controller="homeController" class="ng-scope">
<div class="flex-box welcome">
<h1 id="line1" class="hvr-pulse">Welcome to my basement</h1>
<h3 id="line2" class="hvr-pulse">I hope these will satisfy you</h3>
<button id="welcome-button" class="hvr-grow-rotate" ng-click="about()">Allow me to introduce myself</button>
</div>
听我的问候-->
这是 Javascripts 文件,站点 url 是https://namwin.herokuapp.com/
$(document).ready(function() {
// first load on delay
$('#line1').hide().delay(3000).show(2200);
$('#line2').hide().delay(5000).show(2200);
$('#welcome-button').hide().delay(10000).show(2200);
//responsive manipulator
$('.fa-bars').on('click',function () {
var x = document.getElementById("nav-bar");
if (x.className === 'nav-bar')
x.className += ' responsive';
else
x.className = 'nav-bar';
})
// jquery for front page
$('#greet').click(function() {
var audio = document.getElementById('audio');
if (audio.paused) {
audio.play();
}else{
audio.pause();
audio.currentTime = 0
}
})
});
解决方案
由于您使用角度放置此代码在您的模块中。您正在调用代码,而元素还没有。
推荐阅读
- azure-cosmosdb - 昂贵的 gremlin 查询 - 可以提高效率吗?
- python - 基于同一组内另一行和另一列中的某个值分配值的有效方法
- c++ - 使用 SFINAE 禁用模板类成员函数
- ms-access - 更新 SQL 在 vba 中不起作用,但在查询设计中起作用?
- python - Scrapy Spider - 如何获取起始 url 并增加页面 # 以抓取页面值结尾?
- android - 如何强制移动版本的页面 webview
- android - 屏幕关闭后 Firestore 不更新
- html - 如何将页脚与弹性框“卡片”的底部对齐?
- reactjs - 如何在 Apollo Client 中使用没有 JSX 组件的 client.query?
- flutter - Flutter SliverAppBar 与 Tabs 覆盖内容