Query Query - 3 months ago 10
HTML Question

Why are the hidden links throughout my page still appearing in the noscript tags?

I have been working on a simple web site (one page at the moment) to display some basic information. This site also contains several links that refer the user to downloadable content (2 links to a PDF and one link to a zip file).

These links, like most of my page, are hidden using the

display:none
CSS attribute if the user cannot run JavaScript, which several features of the site require. A message is then displayed in the
<noscript>
tag to inform the user of why they aren't seeing the scripted content. This was all working perfectly when I previewed the files on my personal computer without hosting them.

My problem came after hosting on the site on GoDaddy.com. Now, whenever
<noscript>
is called upon (regardless of browser), every link from my site is pulled out and shoved in the upper-left corner where the user can see it. CSS styling does not appear to affect these links and I cannot figure out how to get rid of them.

How can I solve this? Most importantly, how to make the links go away unless I set them to visible again?

This is my
<noscript>
tag, at the bottom of the page:

<noscript>
<div class="scriptError">
<h1>Javascript is disabled!</h1>
<div id="noScriptNotice">
<p>This site works best with Javascript enabled. A 'noscript-friendly' version is currently in progress, but for now please enable Javascript to view the contents.</p>
</div>
</div>
</noscript>


Everything else (including links) is inside this div:

<div class="scriptedContent" style="display: none;">
<script>
//If scripting is enabled, display the site.
$(".scriptedContent").css("display", "block");
</script>

Answer

If it's working on your own localhost, but not Godaddy.com , you should first and foremost try to submit a support ticket to see if that provides any help.

The links that are re-appearing, see if you can apply this CSS style to the links that you are trying to hide:

font-size: 0;
text-decoration: none;

That should do the trick of hiding the links, that is, if your CSS is affecting them at all. If not, try to "right click > view source" of the page, and then view and compare the source with your own.

Alternative if that does not work: Try making your links (in the HTML code) something along the lines of:

<a href="#" style="display:none;"> Text </a>

and seeing if that stops them from overriding your Styling.

Comments