how to have two popups on a page that show separately?

mmafj

Newbie
Joined
Jan 18, 2016
Messages
35
Reaction score
0
Hello guys
the question is: i have a webpage and two popups, i want them to show when someone click on specific elements on page, i mean popup1 shows when element1 (like image1) is clicked and popup2 shows when element2 (like image2) is clicked, how can i achieve that?
 
It can be done throught js and a pop-up script. jQuery makes things much easier, but don't let the two images stack together.
 
i'm noob in js but what do you think about this:

<body>
<div class="image-wrapper">
<div id="image1">IMAGE1 HERE</div>
<div id="image2">IMAGE2 HERE</div>
</div>
<style type="text/css">
.image-wrapper {
position: relative;
}
#image1 {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 99999999;
}
#image2 {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 300;
z-index: 99999999;
}
</style>
<script type="text/javascript">
$(function(){
$('#image1').click(function(){
POPUP1 SCRIPT HERE
$(this).hide();
});
});

$(function(){
$('#image2').click(function(){
POPUP2 SCRIPT HERE
$(this).hide();
});
});
</script>
</body>
 
Back
Top