Good morning,
i have a web page that will be displayed throughout the whole day as a "media TV". A video on top of the page will be on loop showcasing the company updates but at the bottom i want to put a weather widget with updated information, i have managed to get the widget, but it doesn't update throughout the day. I can't refresh the whole page, because then the video will stop, so I would need to refresh only the embedded content
<a class="weatherwidget-io" href="https://forecast7.com/en/51d51n0d13/london/" data-label_1="LONDON" data-label_2="WEATHER" data-icons="Climacons Animated" data-days="3" data-theme="pure" >LONDON WEATHER</a>
<script>
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src='https://weatherwidget.io/js/widget.min.js';fjs.parentNode.insertBefore(js,fjs);}}(document,'script','weatherwidget-io-js');
</script>
At the bottom I have added the following:
<script>
function reloadIFrame() {
document.Name1.location.reload();
}
window.setInterval(reloadIFrame, 0001);
</script>
But I'm not sure that it will help or do anything. Any ideas? If we could refresh just this embedded code from let's say 5 in 5 minutes would be perfect.
It can't be refreshed with the location.reload method, because the iframe is pointing to a different domain and CORS policy would block your attempt, but you can use this nice trick:
document.getElementById('weatherwidget-io-0').src = document.getElementById('weatherwidget-io-0').src;