I have a simple responsive iFrame that work fine offline. But when I add an Inline Frame to my wbs project, I don't get responsiveness in auto height adjustment.
I have read the thread "viewtopic.php?t=98316&hilit=inline+fram ... d40f52c718" and procedure is bit complex there.
How can I add my code piece in the .wbs project page to make it work.
My HTML code is:
==============================
<!DOCTYPE html>
<html>
<head>
<link rel ="stylesheet" href ="quiz.css">
</head>
<body>
<div class="container">
<iframe id="dynamic-iframe" src="My External Link that I will insert"></iframe>
</div>
<script>
window.addEventListener('message', (event) => {
// Check if the message is from the authorized origin
if(event.origin === 'My External Link that I will insert') {
if (event.data === 'Unauthorized access') {
alert('You are not authorized to access the quiz');
}
}
});
</script>
<!-- <script src="script.js"></script> -->
</body>
</html>
======================
My CSS
======================
.container {
width: 800px;
margin: 0 auto;
display: block;
}
.link-container a {
display: block;
margin-bottom: 10px;
padding: 10px;
background-color: #2529f7;
text-decoration: none;
color: #333;
}
#dynamic-iframe {
width: 100%;
height: 550px;
border: 1px solid #2529f7;
}
Responsive Inline Frame
Re: Responsive Inline Frame
You will need to remove the page structure tags (html, body, head) from the code and then you can paste it between the head tags in Page HTML.
You can use the build-in inline frame as a place holder. So, there is no need for the 'iframe' code.
See also:
https://wysiwygwebbuilder.com/add_html.html
You can use the build-in inline frame as a place holder. So, there is no need for the 'iframe' code.
See also:
https://wysiwygwebbuilder.com/add_html.html
-
girija.mahapatra
-
- Posts: 26
- Joined: Tue Sep 26, 2017 10:22 am
Re: Responsive Inline Frame
Genius 
Thanks Pablo
Thanks Pablo