1

I'm writing a small script that sets the Display property for an Iframe to none if the iframe URL matches the 404 url. For instance, the iframe displays a comment box if there is a .html file that matches the name. If there is no file for that link then it redirects to the sites 404 page, which i dont want it to display.

Example: Iframe src = ~~~ItemTitle~~~.html, If no file by that name exists, redirect to 404 page, <- In which case dont display iframe.

Heres my Javascript: 

// Comment Display Switch
if (document.getElementById("comment-frame").contentWindow.location.href == 'http://www.nemico.co/404') document.getElementById("comment-frame").style.display == "none";

Heres my markup:

<div align="center" id="commentbox" class="commentbox">
<iframe id="comment-frame" scrolling="no" style="overflow: auto; width: 100%; border:thick; border-color:#292F33; border-radius:5px; word-wrap: break-word;" src="~~~ItemTitle~~~.html"></iframe>
</div>

And the script is triggered via Body onload():

<BODY onload="dynamicFormat()">

Where am i going wrong here? It still displays the iframe with the 404 page. Any help would be greatly appreciated. I'm still new to stack etiquette so i apologize in advance for any errors on my part.

Here is the full dynamicFormat Script, What i included above is just the part for the comment box. 

<script>
function dynamicFormat() {
 var allImg = document.querySelectorAll('img')
  allImg.forEach(function(img) {
    const widthStr = img.style.width;
    const widthNum = Number(widthStr.slice(0, widthStr.length - 2));
    if (widthNum >= 35) img.style.width = '35px';
    // Comment Display Switch
    if (document.getElementById("comment-frame").contentWindow.location.href == 'http://www.nemico.co/404') document.getElementById("commentbox").style.display == "none"; 
  });
} 
</script>
JUSTAUSER
  • 13
  • 6
  • I'm a bit confused. The hiding of the iframe looks like it is inside a block that loops over `img` elements. Is the rest of the loop executing as expected? – WillardSolutions Dec 03 '18 at 18:53
  • Every thing is executing as expected in regards to the img formatting and the iframe displays properly if the .html file exits, but i am unable to get it to detect if the iframe is displaying the 404 page, in which case it should set the display to none for the div element that holds the iframe. – JUSTAUSER Dec 03 '18 at 18:57
  • Couple of thoughts - 1) since this happens in a loop, the iframe could be hidden/shown multiple times. I don't think that's what you want. 2) Is the if statement evaluating correctly? That is, is it failing to find the element matching your criteria, or is the styling statement failing? – WillardSolutions Dec 03 '18 at 19:01
  • Give this a read: https://stackoverflow.com/questions/28589387/hide-iframes-if-not-correctly-loaded – AndrewL64 Dec 03 '18 at 19:05
  • After reading through that stack question @AndrewL posted and after considering @WillardSolutions thoughts on the matter i decided to change my CSS to set display property of the iframe Div to none by default, then i changed my java script to: `if (document.getElementById("comment-frame").contentWindow.location.href = '~~~ItemTitle~~~.html') document.getElementById("commentbox").style.display = "block";` So far so good, will report back if it holds up on the live server. Much thanks to @AndrewL & @WillardSolutions – JUSTAUSER Dec 03 '18 at 19:53
  • And its working like a charm. Thanks again! – JUSTAUSER Dec 03 '18 at 19:56
  • Cheers mate!! Glad we could help. – AndrewL64 Dec 03 '18 at 20:01

0 Answers0