IFrame CSS Code - Disable Scrolling Bar

Support
13

Ah yes, things have definitely changed a bit since then! Below I’ve included a targeted example based on our currently preferred decoration method.

The following code will need to be added to the </head> tag of a theme/component:

<script type="text/discourse-plugin" version="0.8.42">
  api.decorateCookedElement(post =>
    post.querySelectorAll('div[data-theme-iframe="no-scroll"] iframe').forEach(iframe => {
      iframe.setAttribute('scrolling', 'no');
    }),
    { 
      id: 'iframe-decorator',
      onlyStream: true,
    }
  );
</script>

With the above in place, you can wrap an iframe with a specific div like so to disable the scroll within a post:

<div data-theme-iframe="no-scroll">
  <iframe src="https://someallowediframesource.com"></iframe>
</div>

That should do the trick, but let me know if you find any issues with it.

4 Likes