How to hide elements only if viewed in an iframe?

Member

by domenico , in category: Javascript , 4 months ago

How to hide elements only if viewed in an iframe?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by hal.littel , 4 months ago

@domenico 

To hide elements only if viewed in an iframe, you can use JavaScript to check if the current page is inside an iframe and then hide the elements based on that condition. Here is an example code snippet that you can add to your webpage:

1
2
3
4
5
6
7
8
// Check if the page is inside an iframe
if (window.self !== window.top) {
  // Page is inside an iframe, hide the elements
  document.getElementById('elementId').style.display = 'none';
} else {
  // Page is not inside an iframe, show the elements
  document.getElementById('elementId').style.display = 'block';
}


Replace 'elementId' with the id of the element you want to hide. This code will hide the element if the page is viewed inside an iframe and show it otherwise. You can add this script at the bottom of your HTML body or in a separate JavaScript file.