有没有办法可以使用CSS3'Dackground-Size'属性,然后使用像Modernizr这样的东西来确保它在旧版浏览器中得到支持(特别是我想使用'background-size:cover'选项)?
我看了一下在Modernizr网站上提到的cssFx,但这似乎只为需要它们使用属性的浏览器添加了供应商前缀,而不是允许IE8等浏览器支持后台大小属性.
还看了CSS3Pie,但目前似乎不支持background-size属性.
[11/10/2011 - 旧版浏览器我主要考虑IE7/8,但理想情况下我想覆盖FF3.6等]
我认为这个问题的答案几乎肯定是"不",因为我已经做了一些测试和周围进行搜索,但没有任何窍门,以检测是否window.print()甚至可能从一个工作页面内(即,从JavaScript)?我知道,即使在桌面/笔记本电脑上,也不可能知道系统上是否配置了打印机,但至少浏览器会打开一个打印对话框.
我的Android手机有一个window.print()功能,但它(不出所料)没有做任何事情.
我再一次问,所以在SO上有一个关于这个主题的好问题:-)
Internet Explorer不支持该multiple属性<input type="file" />.然而,它不仅缺乏这种支持的IE ......某些移动浏览器也不支持该multiple属性.因此,简单地检测浏览器是IE不是理想的解决方案.
那么我如何检测JavaScript multiple是否支持该属性<input type="file" />?
似乎Modernizr支持新的HTML5输入元素属性:
http://modernizr.com/docs/#input
然而,接受的解决方案似乎有效,因为我已经在使用Modernizr,我的解决方案如下:
/**
* Determines if the given attribute is supported for <input /> elements.
*
* @param attribute - the attribute to test for (ex. "multiple")
*/
function isInputAttributeSupported(attribute) {
return (Modernizr.input[attribute]) ? true : false;
};
Run Code Online (Sandbox Code Playgroud) 使用响应式布局和大量CSS来创建网页,我遇到了隐藏或显示滚动条并将布局更改为17px的问题.
主要问题是在OSX上滚动条悬停在整个布局上而不影响它,但在Windows上的任何浏览器中,例如滚动条是布局的一部分,因此将其移动到左侧宽度为17px.
为了解决这个问题,我开始检测以下浏览器:
if($.browser.chrome) {
// adapt layout by 17px
} else if ($.browser.mozilla) {
// adapt layout by 17px
} else if ($.browser.safari) {
// dont adapt layout by 17px
}
Run Code Online (Sandbox Code Playgroud)
但在阅读了很多关于该主题的帖子后,我意识到不是检测浏览器,而是许多人建议使用功能检测.那么有没有办法找出浏览器如何处理滚动条?他们是否会成为页面布局的一部分,或者他们只会徘徊在Safari之类的所有内容之上?
谢谢你的帮助!
clip-path:shape()似乎不适用于IE(毫不奇怪)和Firefox(有点惊讶).有没有办法测试剪辑路径支持?我用的是modernizr.(顺便说一句,我知道我可以使用SVG来实现这一点-webkit-clip-path:url(#mySVG))
我想使用CSS的属性:
mix-blend-mode: soft-light;
Run Code Online (Sandbox Code Playgroud)
And I will test by Modernizr for fallback bla bla...
Tested :
Modernizr.mixblendmode //undefined
Modernizr.testProp('mixblendmode'); //false
Modernizr.addTest('mixblendmode'); // no-mixblendmode
Run Code Online (Sandbox Code Playgroud)
What am I missing ?
Tested on Firefox, CSS its work, but how to test with Modernizr ?
我正在尝试使用Modernizer.load.
我有这个:
Modernizr.load([
{
load : ['/js/jquery-1.6.1.js', '/js/jquery.tools.min.js', '/js/myscript.js']
}
]);
Run Code Online (Sandbox Code Playgroud)
如果我理解正确,我可以使用这样的代码异步加载脚本.但是,我可以按顺序执行它们吗?如果myscript.js需要首先加载jquery对象怎么办?
在modernizr文档的示例中,load([])可以采用'complete'属性,其参数可以是一个可以在其他所有操作完成时加载另一个脚本的函数.但是,如果我在这里使用一个函数来加载我的post-dependancy脚本,那么它将以串行方式加载.文档明确指出,这可能会损害性能.
但是,如果我异步加载所有内容,我对它们的运行顺序一无所知.当然,我需要先依靠我的依赖.
我是响应式设计界的新手.
我在我的设计中使用http://www.responsivegridsystem.com/.它告诉我添加以下标记
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements and feature detects -->
<script src="vendors/responsive/js/modernizr-2.5.3-min.js"></script>
Run Code Online (Sandbox Code Playgroud)
由于媒体查询在IE8中不起作用,根据IE7的这个问题,IE8支持css3媒体查询我也使用以下标记
<!--[if lt IE 9]>
<script src="//css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
Run Code Online (Sandbox Code Playgroud)
这些都需要吗?什么是html5shim,modernizr和css3mediaqueiries之间的区别?
我需要使用modernizr吗?因为我在js文件中没有做任何事情,比如jQuery.
现在使用modernizr加载条件javascript文件有哪些好的做法,因为在最新版本的modernizr中不推荐使用yepnope和.load.
以前能够使用.load函数. http://modernizr.com/docs/#load
Modernizr.load({
test: Modernizr.geolocation,
yep : 'geo.js',
nope: 'geo-polyfill.js'
});
Run Code Online (Sandbox Code Playgroud)
现在.load与yepnope一起被弃用. https://github.com/SlexAxton/yepnope.js/
在yepnope被弃用之前参考答案 使用Modernizr加载脚本...不工作