rernanded
Erfahrenes Mitglied
Hi
brauche ein Idee wie ich es anstellen könnte mittels iframes Inhalte(von Webseiten) anzeigen zu lassen, aber nur wenn das jeweilige "anzeigende" iframe sich in der Mitte meiner Webseite befindet, so dass sich jedes weitere iframe nur beim Scrollen meiner Webseite öffnet, und sich das darüber befindliche wieder schliesst.
MONI
Hier mal mein Versuch:
brauche ein Idee wie ich es anstellen könnte mittels iframes Inhalte(von Webseiten) anzeigen zu lassen, aber nur wenn das jeweilige "anzeigende" iframe sich in der Mitte meiner Webseite befindet, so dass sich jedes weitere iframe nur beim Scrollen meiner Webseite öffnet, und sich das darüber befindliche wieder schliesst.
MONI
Hier mal mein Versuch:
HTML:
<!DOCTYPE html>
<html>
<head>
<style>
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
}
.modal-content {
background-color: #fff;
margin: 15% auto;
padding: 20px;
border: 1px solid #000;
width: 80%;
}
</style>
</head>
<body onscroll = "myFunction(e)">
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a id="link" href="http://www.spiegel.de">spiegel.de</a><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<!-- The Modal -->
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<iframe id="content" height="789px" width="100%"></iframe>
</div>
</div>
</body>
<script>
myFunction(e) {
modal.style.display = "block";
console.log(e);
document.getElementById("content").src = e.target.href;
});
</script>
</body>
</html>