higher level api for creating and removing iframes in browsers
use with browserify
npm install iframe
var iframe = require('iframe')
// creates a new iframe and appends it to the container
frame = iframe({ container: document.querySelector('#container') , body: "hi" })
// completely removes previous iframe from container and generates a new one
frame.setHTML({ body: "bye" })
you can pass this into the constructor or setHTML
{
body: string contents for `<body>`
head: string contents for `<head>`
html: string contents for entire iframe
container: (constructor only) dom element to append iframe to, default = document.body
sandboxAttributes: array of capability flag strings, default = ['allow-scripts']
scrollingDisabled: (constructor only) boolean for the iframe scrolling attr
}
you can also just pass in a string and it will be used as {html: 'yourstring'}
by default the sandbox attribute is set with 'allow-scripts' enabled. pass in an array of capability flag strings. Available flags:
allow-forms allows form submission.
allow-popups allows (shock!) popups.
allow-pointer-lock allows (surprise!) pointer lock.
allow-same-origin allows the document to maintain its origin; pages loaded from https://example.com/ will retain access to that origin’s data.
allow-scripts allows JavaScript execution, and also allows features to trigger automatically (as they’d be trivial to implement via JavaScript).
allow-top-navigation allows the document to break out of the frame by navigating the top-level window.
iframes are weird. here are some things I use to fix weirdness:
// setTimeout is because iframes report inaccurate window.innerWidth/innerHeight, even after DOMContentLoaded!
var body = '<script type="text/javascript"> setTimeout(function(){' + javascriptCodeHere + '}, 0)</script>'
var head = "<style type='text/css'> html, body { margin: 0; padding: 0; border: 0; } </style>"
BSD
FAQs
higher level api for creating and using iframes in browsers
The npm package iframe receives a total of 185 weekly downloads. As such, iframe popularity was classified as not popular.
We found that iframe demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
A malicious npm package disguised as a WhatsApp client is exploiting authentication flows with a remote kill switch to exfiltrate data and destroy files.
Security News
PyPI now supports digital attestations, enhancing security and trust by allowing package maintainers to verify the authenticity of Python packages.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.