[英]Jquery - EaseOutBounce effect
I have a problem with my code.我的代码有问题。 When i click on button, nothing happen, just reload the page.
当我单击按钮时,什么也没有发生,只需重新加载页面。
#click{
position: absolute;
right: 50px;
top: 30px;
}
.media{
width: 100px;
height: 300px;
background: #ccc;
position: absolute;
right: 20px;
top: 80px;
display: none;
}
<script src="http://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<button id="click">Button</button>
<div class="media"></div>
$(document).ready(function(){
$("#click").click(function () {
$('.media').toggle('slide', {
duration: 1000,
easing: 'easeOutBounce',
direction: 'up'
});
});
});
Please help to solve this, i dont have more idea.请帮助解决这个问题,我没有更多的想法。
Thanks.谢谢。
First off, make sure you have referenced JQuery:首先,确保你已经引用了 JQuery:
Example:例子:
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256 FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
After the click event, you can return false.点击事件后,可以返回false。
$("#click").click(function () {
$('.media').toggle('slide', {
duration: 1000,
easing: 'easeOutBounce',
direction: 'up'
});
});
return false;
or make the following change:或进行以下更改:
$("#click").click(function (event) {
event.preventDefault();
$('.media').toggle('slide', {
duration: 1000,
easing: 'easeOutBounce',
direction: 'up'
});
});
Reference: https://api.jquery.com/event.preventdefault/参考: https : //api.jquery.com/event.preventdefault/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.