CODEWITHSUNDEEP
javascriptjquerypopupwindow
user3415646
user3415646

Reputation: 1

javascript 2 popup windows in one document

i try to use This code. It works good with 1 window, but i need 2 popup window.

i try to modified it like this

 $(document).ready(function(){
    PopUpHide();
});
function PopUpShow(){
    $("#popup1").show();
    $("#popup2").show();
}
function PopUpHide(){
    $("#popup1").hide();
    $("#popup2").hide();
}

And HTML

<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>
<div class="b-container">
    Sample Text
    <a href="javascript:PopUpShow()">Show popup</a>
</div>
<div class="b-popup" id="popup2">
    <div class="b-popup-content">
        Text in Popup
    <a href="javascript:PopUpHide()">Hide popup</a>
    </div>
</div>

Where i make mistake?

Upvotes: 0

Views: 232

Answers (3)

user3415646
user3415646

Reputation: 1

 $(document).ready(function(){
    PopUpHide();
});
function PopUpShow1(){
    $("#popup1").show();
function PopUpShow2(){
    $("#popup2").show();
}
function PopUpHide(){
    $("#popup1").hide();
    $("#popup2").hide();
}

In the end i make like this

Upvotes: 0

Ali A. Ibrahim
Ali A. Ibrahim

Reputation: 54

You're most probably showing two popups above each others, give one of them different position and class and use different Javascript function to show each, or send a variable to the function to decide which one to view.

Would be something like that:

function popupshow(whichOne)
{
    if(whichOne == 'first'){
        $("#popup1").show();
        $("#popup2").hide();
    }
    else{
        $("#popup1").hide();
        $("#popup2").show();
    }
}

UPDATE: here's the fiddle code as you requested. http://jsfiddle.net/jBf2y/2/

Upvotes: 1

mongopusher666
mongopusher666

Reputation: 15

Your code above is working. You just need to set a margin to #popup2 div. They bot appear together, but as they are in the same position, you only see one of them.

Upvotes: 0

Related Questions