User:wbamberg

####

####

all-css-pages

all-api-pages

all-web

all-apis

all-html-pages

all-mozilla-tech

all-mozilla-projects

all-js-ctypes

features with them. They were called "template strings" in prior editions of the ES2015 specification.

const addParaButton = document.querySelector('.add-para');

addParaButton.addEventListener('click', () => {
  const para = document.createElement('p');
  para.textContent = 'All work and no play makes Jack a dull boy.';
  document.body.appendChild(para);
});
  

Examples

Live example

HTML

<h1>fullscreenchange event example</h1>
 <div id="fullscreen-div">
   <button id="toggle-fullscreen">Toggle Fullscreen Mode</button>
 </div>

JS

document.getElementById('fullscreen-div').addEventListener('fullscreenchange', (event) => {
  // document.fullscreenElement will point to the element that
  // is in fullscreen mode if there is one. If not, the value
  // of the property is null.
  if (document.fullscreenElement) {
    console.log(`Element: ${document.fullscreenElement.id} entered fullscreen mode.`);
  } else {
    console.log('Leaving full-screen mode.');
  }
});

document.getElementById('toggle-fullscreen').addEventListener('click', (event) => {

  if(document.fullscreenElement) {
    // exitFullscreen is only available on the Document object.
    document.exitFullscreen();
  } else {
    try {
      document.getElementById('fullscreen-div').requestFullscreen();
    } catch (e) {
      console.log(e)
   }
 }
});

Result