PopUp (модальное окно)

[vladislav_zp]

Здравствуйте. Нашел в интернете как сделать модальное окно. Код рабочий, только есть один нюанс, модальное окно срабатывает когда пользователь заходит на сайт, а как сделать чтобы оно срабатывало только по нажатию мыши?

<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();
}

[Dilettante_Pro]

Так оно вроде и работает, как вам надо

<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>