i am trying to load other domain page in my website .it is working perfectly . and on clicking on webpage which is open in iframe an alert appears . but all this is happening due to
overlay{top:0;left:0;width:100%;height:100%;position:absolute; }
but the problem is if i use above css,the web page get stuck ,it doesn't scroll and if i change position:relative alert doesn't open
<div class="container" style='position:fixed; left: 0; right: 0; bottom: 0; top: 0px; height: 100%;z-index: 1111111;'>
<iframe class='theiframe' width='100%' height='100%' src='http://www.cnbc.com/world/?region=world/'></iframe>
<div class="overlay"></div>
</div>
<script>
$(document).ready(function () {
$('.container').bind('click', function(event) { alert('test'); });
});// main function
</script>
<style>
.container{position:relative;float:left;}
.overlay{top:0;left:0;width:100%;height:100%;position:absolute; }
/*background-color: rgba(193, 179, 179, 0.52);margin-top: 5%;margin-left: 3%;*/
</style>
