https://github.com/vpusher/x-frame

Cross document communication with frame content made easy
https://github.com/vpusher/x-frame

Last synced: about 1 month ago
JSON representation

Cross document communication with frame content made easy

• Host: GitHub
• URL: https://github.com/vpusher/x-frame
• Owner: vpusher
• License: mit
• Created: 2016-11-12T13:00:40.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2016-11-14T00:08:48.000Z (about 8 years ago)
• Last Synced: 2024-10-05T12:57:01.885Z (about 2 months ago)
• Language: HTML
• Homepage:
• Size: 5.86 KB
• Stars: 8
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# \

[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg?style=flat-square)](https://beta.webcomponents.org/element/vpusher/x-frame)

Cross document communication with frame content made easy.

Example:

```html

  document.querySelector('x-frame').addEventListener('msg', function(e){

    alert(e.detail.data.message)

  });

```

## Installation

First, make sure you have [Bower](https://bower.io/) and the [Polymer CLI](https://www.npmjs.com/package/polymer-cli) installed.

Then,

```

bower install

polymer serve -o

```

## Usage

Add a `` element to your page and set the `src` attribute:

```html

[...]

```

The target page (here `frame.html`) needs to contain at least one `` element to enable the cross document communication:

```html

[...]

```

The frame document can also contain more than one `` element to allow multi-channels cross document communication:

```html

[...]

```

> This is helpful for the separation of concerns.

## Contributing

1. Fork it!

2. Create your feature branch: `git checkout -b my-new-feature`

3. Commit your changes: `git commit -am 'Add some feature'`

4. Push to the branch: `git push origin my-new-feature`

5. Submit a pull request :D

## History

* **1.0.0:** initial release.

## License

MIT license