JS / CSS - 为JS禁用的用户在网页上显示半透明层

Question

我的说明

---

我有一个很大程度上依赖于Javascript和JQuery的网站应用程序。如果用户在其浏览器设置中禁用了JS，则该网站的功能不尽如人意，尽管它仍然有效。

我想阻止人们看到我的网站禁用了JS，但没有将它们重定向到非JavaScript页面。我想提醒我的用户，应该在一个很好的CSS方法中启用JS。

如果JS被禁用，我想显示一个半透明/白色的CSS图层，显示在我的网页顶部，宽度为100％，高度为100％，并用一些简单的词语来描述问题我的用户，以及启用JS的说明。

我的计划

---

• 有一个100％x 100％的半透明CSS图层来覆盖我的网页 每一页。
• 有一个有载的Javascript函数，当页面加载时，它 删除图层。因此，如果没有找到Javascript，它就不会 删除图层。

我的问题

---

这是实现这一目标的最佳方法吗？如果是，你能帮助我使用Javascript函数来关闭CSS层，进行加载，或者向我解释一下这个函数应包含哪些功能才能使它工作？我的Javascript糟透了......

Answer 1

在noscript标记中添加图层，并设置noscript标记的样式，在noscript标记中添加文本。

#noscript {top:0; left:0; height:100%; width:100%; opacity: 0.5; background: white;}

Answer 2

这听起来像是一个可行的解决方案。

隐藏图层非常简单。

$(function () {
    $("#layerId").hide();
});

设置图层使其看起来正确是工作的真正所在。

Answer 3

将已删除警告的HTML标记放在<noscript>标记中，然后根据需要设置样式。

W3Schools

Answer 4

这种事情的常用技术（Modernizr使用这种方法）是做类似以下的事情。

从CSS开始......

#my-warning-message {display:block; width:...}
.js #my-warning-message {display:none;}

然后，在你的JS ......

$('html').addClass('js');