问题标签 [graceful-degradation]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - Javascript 导致的 CSS 退化无法正常工作
我在网站上设置了一个典型的新闻自动收报机,并试图为不使用 Javascript 的人降级(这些人真的存在,我想知道吗?)。无论如何,我在我的<noscript></noscript>
标签中放置了一个简单的 CSS 修复,但是出了点问题。
jQuery 将代码功能添加到主 div ( .ticker
),降级的 CSS 会正确影响此主 div 内的所有子 div。但是,主 div 不受我的 CSS 的影响。
我正在使用 Chrome,因此我正在使用开发控制台检查在我的股票代码 div 上运行的最终 CSS,我编写的所有 CSS 似乎都在影响它——根本没有任何东西被划掉。尽管如此,边框,例如背景等,并不像它应该的那样存在。
让这个奇怪的是,这个边框和这个背景从一开始就是 CSS 元素。我的意思是,即使启用了 Java,这些也是由 CSS 样式表定义的。所以我不知道为什么我退化的 CSS 不起作用,更不用说为什么禁用 Java 会影响主 CSS 样式表定义的这些元素。
有没有人遇到过类似的事情?有谁知道可能发生了什么?
谢谢!
user-experience - 目标是否应该是为旧版浏览器提供相同的页面呈现?
就个人而言,我一直认为目标是为每个用户提供良好的用户体验,无论他们浏览器的功能和现代性如何。但是,这并不总是等同于相同的页面呈现和功能。
在工作中,我被要求确保页面在每个浏览器中呈现相同,这意味着要么简化设计以不使用最新功能,要么在旧版浏览器中加载大量 polyfill 以实现“浏览器透明度”,至于我明白了,这会伤害用户体验,因为它们对于不影响页面可用性的样式和功能的页面加载时间更长。
极端而言,这意味着设计应该迎合没有 JS 的最低公分母(有些人不使用 JS),并且应该以统一的名义排除任何超出此范围的功能。
我认为相同的用户体验不应该是一个目标,而应该是浏览器最佳功能的良好、一致的用户体验,我错了吗?
css - CSS 文字渐变,Opera 退化
我使用它,它在 webkit 浏览器上运行良好,在 firefox 上运行简单。但是 Opera 给出了奇怪的结果。
我正在使用的CSS:
关于我如何默认颜色的任何提示:@coreDarkBlue 也在歌剧上?我假设歌剧在快速搜索后不支持该效果。
javascript - 为什么在 IE8 的 IE7 兼容模式下 `'onhashchange' in window` 返回 `true`?
我想检查浏览器是否支持hashchange
事件,如果不支持,则使用setInterval
.
我努力了
但问题是,在 IE7 兼容模式下的 IE8 中,'onhashchange' in window
返回true
是因为window.onhashchange
is null
( jsfiddle )
为什么会这样?如果我使用'onclick2' in window
,它会返回false
!
我已阅读Detecting support for a given JavaScript event? ,但如果可能的话,我更愿意使用更简单的东西。
javascript - E 防止默认不工作
这是我正在使用的代码:http: //jsfiddle.net/qKyNL/12/
我正在尝试使用 Jquery 创建一个可降解的分页,但问题是“e prevent default”似乎没有触发,而是它仍然遵循链接。谁能告诉我如何让这个链接可降解,所以如果 Jquery 被禁用它仍然有效。
javascript - 检测地理 uri 支持
JavaScript 有没有办法检查客户端浏览器是否支持GEO-URI-scheme?
我想将不受支持的浏览器的坐标显示为地图的链接
对于受支持的浏览器(如智能手机),作为指向它们自己的本机应用程序的链接。
javascript - 如何优雅地将不受支持的 XMLHttpRequest 方法降级为受支持的方法(例如 POST)?
根据 jQuery 的文档$.ajax()
支持“其他 HTTP 请求方法,例如 PUT 和 DELETE,也可以在此处使用,但并非所有浏览器都[必然]支持。 ” [1]
我想知道是否有一种方法可以检查浏览器是否支持给定的方法,例如PATCH
, PUT
,DELETE
等,并在不支持的情况下优雅地降级为使用POST
方法$.ajaxPrefilter()
?或者,总是POST
从表单或 AJAX 调用并使用一些其他上下文(例如_method
,或服务器支持的 X-header)来指示预期的方法,而不是实际使用的方法是否更好?
更新:似乎测试是否支持特定请求类型的一种方法是实际发出请求,例如
但是,如果可能的话,我想在确定对特定请求类型的支持时避免发出任何请求。
javascript - Angular.js 的优雅改进(不是退化)?
我们正在重新启动我们公司的登录页面(包含信息、工作、团队和帮助部分),并决定不再仅为我们的这部分服务维护 Rails 项目,因此切换到静态 HTML。
由于我们想让我们的人力资源和支持团队有机会编辑文本(尤其是在工作和帮助部分)而不打扰开发团队,我们将在页面上运行一个 Angular.js 应用程序并使用修补内容一个 JSON APi(就像 Wordpress.com 提供的http://developer.wordpress.com/docs/api/或者我们甚至可以使用https://www.contentful.com/)。
然而,由于我们需要我们的着陆页加载速度非常快(转换为王),我们正在考虑将着陆页的初始部分作为静态 HTML 提供,并在用户访问最重要的信息后优雅地添加 Angular.js . 我们不在乎那些停用 JS 的人是否不能使用我们页面的其余部分,因此我们将这个过程称为优雅改进。
是否有任何最佳实践和/或 Angular.js 模块来实现我刚才描述的内容?这种效果的正确术语是什么?
PS:我们将通过使用 Phantom.js 渲染着陆页的其余部分(团队、工作等)来处理 SEO,因此 SEO 不是一个主题。这只是关于我们着陆页初始部分的加载速度。
css - 如何优雅地降级 CSS 视口单元?
CSS 视口单元 ( vw
, vh
, vmin
, vmax
) 很棒,我想开始将它们用于字体——但我注意到这里它们并没有得到广泛的支持。我试图用谷歌搜索在不受支持的浏览器中优雅降级的任何最佳实践,但找不到任何有用的东西。除了做类似的事情之外,还有没有更好的方法:
提前致谢!
html - CSS从右到下浮动降级
我试图在我的页面上浮动一个元素作为右侧边栏,但是为了降低屏幕尺寸,将元素放在内容下方和页脚上方。这是我到目前为止所拥有的:JSFiddle
我的问题是,当屏幕小于 500 像素时,侧边栏会转到顶部而不是底部。我似乎无法弄清楚如何让它“漂浮”到底部。在我尝试过的内容下面,float:bottom
但显然这不起作用。有什么想法或建议吗?