Keep iFrames sized to their content.
Installations
npm install iframe-resizer
Score
98.6
Supply Chain
71.9
Quality
89.2
Maintenance
100
Vulnerability
79.3
License
Developer
Developer Guide
Module System
CommonJS
Min. Node Version
Typescript Support
No
Node Version
22.7.0
NPM Version
10.8.3
Statistics
6,699 Stars
2,211 Commits
982 Forks
144 Watching
12 Branches
99 Contributors
Updated on 27 Nov 2024
Bundle Size
49.77 kB
Minified
17.10 kB
Minified + Gzipped
Languages
JavaScript (62.22%)
HTML (33.74%)
TypeScript (1.74%)
Vue (1.32%)
CSS (0.49%)
Shell (0.48%)
Total Downloads
Cumulative downloads
Total Downloads
68,534,573
Last day
-3%
86,409
Compared to previous day
Last week
1%
448,352
Compared to previous week
Last month
12.8%
1,899,529
Compared to previous month
Last year
33.2%
21,405,248
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Introduction
The iframe-resizer library aims to take away the pain points with using iframes. It will resize your iframe to match the size of your content and then monitor the iframe to ensure that it is always the perfect size.
Reliable Resizing
As browsers don't provide a single consistently reliable method to calculate content size, iframe-resizer automatically inspects your page and selects the best value for your content every time it detects something changed.
High Performance
To ensure minimal impact on your site, iframe-resizer is highly optimised and utilizes Set Theory to ensure it only checks the page elements that effect the sizing of your iframes.
Even on the most complex pages, iframe-resizer can detect changes to both HTML and CSS, calculate the revised content dimensions and update the iframe in sub millisecond time.
Cross Domain
Supports both internal (same-domain) and external (cross-domain) iframes via a simple JS file that is designed to be a zero impact guest on the sites hosting it.
Extended API
Additionally iframe-resizer provides a range of missing browser API features, that allows you to securely integrate your iframe content with the parent page.
- Scroll the page, relative to the iframe or parent page’s position
- Get details of the position of the iframe, the scroll position and viewport of the parent page
- Fixes in page linking in the iframe and allows links to propagate to the parent page
- Adds
onMouseEnter
andonMouseLeave
events to the iframe element - Simplified message passing between the iframe and the parent page
- Automatic domain authentication
- Enhanced Accessibility
When combined with viewer.js it can even resize iframes containing PDF and ODF documents.
Setup and API guide
Please see the iframe-resizer website for setup guides and API documentation. This includes versions for:
Along with setup guides for:
Their is also an API to support the creation of additional custom components.
Version 5
This version of iframe-resizer has been extensively rewritten to use modern browser APIs, this has enabled significantly better performance and greater accuracy in the detection of content resizing events.
With this release, the opportunity has been taken to refresh and simplify the API, if you are coming from a previous version then their is an Upgrade Guide to explain the changes.
Main packages
For version 5 iframe-resizer is split into two main packages to make it simpler to deploy across different domains and better support tree shaking. These two packages can be installed from NPM, or downloaded as a zip file.
@iframe-resizer/parent
The parent page package sets up an iframe for automatic content resizing. Their are versions of this package for several popular libraries and frameworks (see below).
@iframe-resizer/child
This package needs loading into the iframe, where it will quietly wait for a message from the parent page before initialising. It is designed to be a good guest on someone else site.
Frameworks and Libraries
In addition to the two main packages, their are versions of the parent package for the following platforms.
@iframe-resizer/react
A React component for the parent page.
@iframe-resizer/vue
A Vue component for the parent page.
@iframe-resizer/jquery
A simple jQuery wrapper for the parent page.
API
@iframe-resizer/core
The core API for the parent page, used by @iframe-resizer/parent
, plus the framework and library component versions.
Copyright © 2013-24 David J. Bradshaw - Licensed under the GPL V3
No vulnerabilities found.
Reason
security policy file detected
Details
- Info: security policy file detected: SECURITY.md:1
- Info: Found linked content: SECURITY.md:1
- Info: Found disclosure, vulnerability, and/or timelines in security policy: SECURITY.md:1
- Info: Found text in security policy: SECURITY.md:1
Reason
30 commit(s) and 11 issue activity found in the last 90 days -- score normalized to 10
Reason
no dangerous workflow patterns detected
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Warn: project license file does not contain an FSF or OSI license.
Reason
SAST tool is not run on all commits -- score normalized to 9
Details
- Warn: 19 commits out of 20 are checked with a SAST tool
Reason
dependency not pinned by hash detected -- score normalized to 1
Details
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/eslint.yml:30: update your workflow using https://app.stepsecurity.io/secureworkflow/davidjbradshaw/iframe-resizer/eslint.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/eslint.yml:40: update your workflow using https://app.stepsecurity.io/secureworkflow/davidjbradshaw/iframe-resizer/eslint.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/node.js.yml:23: update your workflow using https://app.stepsecurity.io/secureworkflow/davidjbradshaw/iframe-resizer/node.js.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/node.js.yml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/davidjbradshaw/iframe-resizer/node.js.yml/master?enable=pin
- Warn: npmCommand not pinned by hash: .github/workflows/eslint.yml:34
- Info: 0 out of 4 GitHub-owned GitHubAction dependencies pinned
- Info: 1 out of 2 npmCommand dependencies pinned
Reason
Found 1/22 approved changesets -- score normalized to 0
Reason
detected GitHub workflow tokens with excessive permissions
Details
- Info: jobLevel 'contents' permission set to 'read': .github/workflows/eslint.yml:26
- Warn: no topLevel permission defined: .github/workflows/eslint.yml:1
- Warn: no topLevel permission defined: .github/workflows/node.js.yml:1
- Info: no jobLevel write permissions found
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Reason
50 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-pp7h-53gx-mx7r
- Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
- Warn: Project is vulnerable to: GHSA-p6mr-pxg4-68hx
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-73v8-v6g4-vrpm
- Warn: Project is vulnerable to: GHSA-hr2v-3952-633q
- Warn: Project is vulnerable to: GHSA-pfrx-2q88-qq97
- Warn: Project is vulnerable to: GHSA-q42p-pg8m-cqh6
- Warn: Project is vulnerable to: GHSA-2cf5-4w76-r9qv
- Warn: Project is vulnerable to: GHSA-3cqr-58rm-57f8
- Warn: Project is vulnerable to: GHSA-g9r4-xpmj-mj65
- Warn: Project is vulnerable to: GHSA-q2c6-c6pm-g3gh
- Warn: Project is vulnerable to: GHSA-w457-6q6x-cgp9
- Warn: Project is vulnerable to: GHSA-9prh-257w-9277
- Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44
- Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988
- Warn: Project is vulnerable to: GHSA-jcpv-g9rr-qxrc
- Warn: Project is vulnerable to: GHSA-44pw-h2cw-w3vq
- Warn: Project is vulnerable to: GHSA-jp4x-w63m-7wgm
- Warn: Project is vulnerable to: GHSA-c429-5p7v-vgjp
- Warn: Project is vulnerable to: GHSA-jf85-cpcp-j695
- Warn: Project is vulnerable to: GHSA-fvqr-27wr-82fm
- Warn: Project is vulnerable to: GHSA-4xc9-xhrj-v574
- Warn: Project is vulnerable to: GHSA-x5rq-j2xg-h7qm
- Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
- Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-wrvr-8mpx-r7pp
- Warn: Project is vulnerable to: GHSA-hxm2-r34f-qmc5
- Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
- Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m / GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-pc58-wgmc-hfjr
- Warn: Project is vulnerable to: GHSA-vvv8-xw5f-3f88
- Warn: Project is vulnerable to: GHSA-gqgv-6jq5-jjj9
- Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp
- Warn: Project is vulnerable to: GHSA-7xfp-9c55-5vqj
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-x6fg-f45m-jf5q
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-qg8p-v9q4-gh34
- Warn: Project is vulnerable to: GHSA-g4rg-993r-mgx7
- Warn: Project is vulnerable to: GHSA-x2mc-8fgj-3wmr
- Warn: Project is vulnerable to: GHSA-qhv9-728r-6jqg
- Warn: Project is vulnerable to: GHSA-g7q5-pjjr-gqvp
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-xc7v-wxcw-j472
- Warn: Project is vulnerable to: GHSA-34r7-q49f-h37c
- Warn: Project is vulnerable to: GHSA-c9f4-xj24-8jqx
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
Score
4.7
/10
Last Scanned on 2024-11-25
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More