Question

我试图创建一个对话框，使其在可见时可以阻止访问页面内容。如果我点击接受该对话框应该消失，在随后的访问中永远不会重新呈现。如果不同意它应该重定向到另一个站点，并在下次访问时不断代表对话，我有很多麻烦这个我已完成大纲但我很难实现其功能。这就是我所做的

    <!DOCTYPE html>
    <body>

    <div id= Cooky>

  <h2>Warning</h2>

   <p>site-usage requires the user’s acceptance of cookie usage before  progressing.</p>
<button id="button" onclick="toggleDiv('Cooky');">agree</button>
<button id="button" onclick="toggleDiv('Cooky');">diagree</button> 


</div>

<div>
 this is the rest of the wesbite<br>


this is the rest of the wesbite<br>

this is the rest of the wesbite<br>

</div>

</body>




<script type="text/javascript"           src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
 <script type="text/javascript">
    function toggleDiv(divId) {
        $("#"+divId).toggle();
    }
</script>

其余代码在jsfiddle上：https://jsfiddle.net/a02ma3x5/ 请看一看感谢您的帮助

Answer 1

您可以尝试使用叠加层，请参阅jsfiddle

<div class="overlay active">

.overlay.active { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.8; filter: alpha(opacity=80); z-index:1; }

 $('.overlay').toggleClass('active');

虽然可见如何使此对话框阻止访问其余页面内容？

1 个答案: