Async live-stream platform: How to remove elements from embeded web-page(livechannels.pages.dev) |
Async live-stream platform: How to remove elements from embeded web-page(livechannels.pages.dev) |
After searching online, most people just said it goes against CORS to modify the elements in the iFrame, so here was my solution:
```<div style="position: relative;overflow: hidden;"> <div style="margin-top:-80px;"> <iframe src="https://livechannels.pages.dev/(ChannelName)" width="1300px" height="820px" frameborder="0" allowfullscreen> </iframe> </div> </div>```
Basically, you just need to use two divs, one to set the overflow as hidden, and another to cut the portion of the page. In my case, I wanted to cut the nav bar, which was the first 80px at the top of the website. The end result was pretty much perfect.
Proof of concept websites:
https://animaxreboot.pages.dev/ https://cartoonnetworkhq.github.io/CartoonNetwork/