作者:郑谊099_448 | 2023-08-25 11:24
我正在使用一些Javascript来显示"照片淡入淡出旋转器" .但是,如果没有启用JS,我会想要显示一个动画gif.我实际上已经使用此代码:
外部JS文件在它上面发挥了作用.id ="slideshow"上的类设置尺寸,填充,边距,定位等."hide-slideshow"css文件在#slideshow上执行"display:none",并且围绕动画gif的"adjust"类执行一些操作推动和拉动以获得它需要的位置(如果没有隐藏的话,幻灯片放映的位置).
我在FF3,IE7,IE8,Chrome和Safari(Win)中测试了这个.好消息是它就像一个魅力.坏消息是它没有通过W3C验证器.我得到一个错误,说"文档类型不允许元素"链接"这里".
即使我的方法有效,它是否过于笨拙?有没有更好的方法来展示一个如果启用JS而另一个是不同的,
如果它不是,以一种跨浏览器工作并通过验证的方式?
谢谢!
1> Dan Herbert..:
尝试这样的事情.它优雅地降级,不需要
标签.
为了简化示例,我使用了ID.使用类更合适.此外,大多数像样的入门框架(如HTML5 Boilerplate和Modernizr)都会使用HTML标记上的CSS类来执行此操作,因此您可以使用全局方式隐藏/显示CSS文件中的内容而不是使用JS.该
标签带有一个开始no-js
CSS类,它被用替代js
的JS类.这允许您只使用适当的类为任何依赖于JS存在的CSS规则添加前缀.这更具语义性,因为它将表达事物(应该在视觉上隐藏/显示的内容)与逻辑事物(无论页面是否运行JS)分开.
回答原始问题的另一个选择是默认情况下将链接添加到头文件中的CSS文档,并使用JavaScript将其删除.(免责声明)我没有对此进行测试,但它也适用于所有浏览器.
如果您使用的是jQuery,也可以缩短此脚本.
$("link[href='css/hide-slideshow.css']").remove();
推荐阅读
-
如何解决《如何清理不良的AzurePowerShell卸载?》经验,为你挑选了2个好方法。 ...
[详细]
-
如何解决《获取正确的名称值而不是Microsoft.SharePoint.Client.FieldUserValue》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《gitrebase-继续没有变化》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《为什么`.asInstanceOf`有时会抛出,有时不抛出?》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《何时检查C++模板实例化类型?》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《如何在glBufferData期间处理GL_OUT_OF_MEMORY错误?》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《运行Tensorflow单元测试》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《如何在tomcatdbcp池中跟踪/记录连接,并检测不返回池连接的代码》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《LaravelSQL选择查询,其中DateTimestamp包含此月份和年份》经验,为你挑选了0个好方法。 ...
[详细]
-
如何解决《{}之前没有任何关键字的目的是什么?》经验,为你挑选了3个好方法。 ...
[详细]
-
如何解决《在eclipse中管理H2连接池》经验,为你挑选了0个好方法。 ...
[详细]
-
如何解决《Bashfor循环与文件中的空格分隔字段》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《从C#SSH.NET的ShellStream获取完整的命令输出》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《强制netcat立即发送消息(不缓冲)》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《使用dateutil.parser解析不完整的日期时,如何将日期设置为1?》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《在数据库之间切换时,错误"网格索引超出范围"》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《将字符串转换为DateTime,小于7的十进制小数》经验,为你挑选了2个好方法。 ...
[详细]
-
如何解决《Thread.Sleep在Asp.netvNext中》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《不使用Observable.create创建Observable》经验,为你挑选了1个好方法。 ...
[详细]
-
如何解决《Sitecore8.1错误:"找不到会话ID管理器来管理当前请求的会话ID"》经验,为你挑选了1个好方法。 ...
[详细]