Non-standard
This feature is not on a current W3C standards track, but it is supported on the Firefox OS platform. Although implementations may change in the future and it is not supported widely across browsers, it is suitable for use in code dedicated to Firefox OS apps.

The mozbrowserloadend event is fired when the browser <iframe> has finished loading all its assets, or has failed to load.

This can be used when the embedder wants to stop spinning a loading indicator, or update the UI in some other way to indicate loading is complete.

General info

Specification
Non standard
Interface
CustomEvent
Bubbles
Yes
Cancelable
Yes
Target
<iframe>
Default Action
None

Properties

Property Type Description
target Read only EventTarget The browser iframe
type Read only DOMString The type of event.
bubbles Read only Boolean Whether the event normally bubbles or not.
cancelable Read only Boolean Whether the event is cancellable or not.
details Read only Object A custom object.

detail

The detail property returns an anonymous JavaScript object with the following properties:

backgroundColor
A DOMString representing the main background color of the browser <iframe> content, expressed as an RGB value. Can be used to make the theme of the surrounding UI complement the theme of the currently loaded content, for example.

Example

In this example the mozbrowserloadstart and mozbrowserloadend events are used to change the icon shown on the stop/reload button between stop (x) and reload (R), as appropriate. In addition, the background of the controls UI bar is changed to the background color of the site that has just loaded, to provide a more integrated experience. When the front page of https://developer.mozilla.org is loaded, for example, the e.detail.backgroundColor value reported is rgb(0, 83, 159).

var browser = document.querySelector("iframe");

browser.addEventListener('mozbrowserloadend',function(e) {
  stopReload.textContent = 'R';
  console.log(e.detail.backgroundColor);
  controls.style.background = e.detail.backgroundColor;
});

browser.addEventListener('mozbrowserloadend',function() {
  stopReload.textContent = 'R';
});

See also