[英]Notification bar not dismissing on click
尝试在页面的页脚创建一个隐私策略通知栏,仅向新访问者显示。 希望在接受通知时关闭通知。 现在,该栏固定显示在页面底部,但是我似乎无法在单击时关闭通知栏。
<span class="banner tracking-banner p-t-1">
<div class="container">
<div class="row">
<div class="col-sm-10 text-left m-b-1">
This website uses cookies and other 3rd party services to customize and provide you a more personalized experience. To find out more, see our <a href="/privacy/">Privacy Policy</a>.
</div>
<div class="col-sm-2 m-b-1">
<button class="dismiss btn btn-sm btn-block btn-invert">Accept</button>
</div>
</div>
</div>
</span>
JS
$(".banner").fadeIn("slow").append(".container");
$(".dismiss").click(function(){
$(".banner").fadeOut("slow");
});
将您的代码包装在文档准备功能中
$(document).ready(function(){ $(".banner").fadeIn("slow").append(".container"); $(".dismiss").click(function(){ $(".banner").fadeOut("slow"); }); })
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <span class="banner tracking-banner pt-1"> <div class="container"> <div class="row"> <div class="col-sm-10 text-left mb-1"> This website uses cookies and other 3rd party services to customize and provide you a more personalized experience. To find out more, see our <a href="/privacy/">Privacy Policy</a>. </div> <div class="col-sm-2 mb-1"> <button class="dismiss btn btn-sm btn-block btn-invert">Accept</button> </div> </div> </div> </span>
将您的跨度更改为div? 使您的淡出工作。
<div class="banner tracking-banner p-t-1">
<div class="container">
<div class="row">
<div class="col-sm-10 text-left m-b-1">
This website uses cookies and other 3rd party services to customize and provide you a more personalized experience. To find out more, see our <a href="/privacy/">Privacy Policy</a>.</div>
<div class="col-sm-2 m-b-1">
<button class="dismiss btn btn-sm btn-block btn-invert">Accept</button>
</div>
</div>
</div>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.