PopUp (модальное окно)
Здравствуйте. Нашел в интернете как сделать модальное окно. Код рабочий, только есть один нюанс, модальное окно срабатывает когда пользователь заходит на сайт, а как сделать чтобы оно срабатывало только по нажатию мыши?
<div class="b-container"> Sample Text <a href="javascript:PopUpShow()">Show popup</a> </div> <div class="b-popup" id="popup1"> <div class="b-popup-content"> Text in Popup <a href="javascript:PopUpHide()">Hide popup</a> </div> </div> $(document).ready(function(){ PopUpHide(); }); function PopUpShow(){ $("#popup1").show(); } function PopUpHide(){ $("#popup1").hide(); } |
Так оно вроде и работает, как вам надо
<style> .b-popup { position:fixed; top:20px; left:20px; border:1px solid black; background-color:white; opasity:0; } .back { background-color:grey; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> $(document).ready(function(){ PopUpHide(); }); function PopUpShow(){ $("#popup1").show(); $(".b-container").toggle("back"); } function PopUpHide(){ $("#popup1").hide(); // $(".b-container").toggle("back"); } </script> <div class="b-container"> Sample Text <a href="javascript:PopUpShow()">Show popup</a> </div> <div class="b-popup" id="popup1"> <div class="b-popup-content"> Text in Popup <a href="javascript:PopUpHide()">Hide popup</a> </div> </div> |
Часовой пояс GMT +3, время: 19:15. |