标签: modernizr
Modernizr.load(yepnope.js)IE条件混乱
在下面的代码dd_belatedpng.js中加载尽管我使用的是Firefox 4.0.1.根据yepnope.js文档,ielt7!如果浏览器的IE低于版本7 ,前缀应该只导致脚本加载.这个功能是从Modernizr.load实现中删除的(我相信一个只是另一个的别名)或者是一个错误,或者,正如我怀疑的那样,我只是错过/误解了一些明显的东西？谢谢你的帮助.这是代码.
Modernizr.load([
{
load: '//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js',
complete: function() {
if(!window.jQuery) {
Modernizr.load('/inc/jquery-1.6.1.min.js');
}
}
},
{
load : 'ielt7!/inc/dd_belatedpng.js',
callback: function() {
$(function() {
DD_belatedPNG.fix("img, .png_bg");
});
}
}/*,
'jquery.plugins.js',
'my.scripts.js'*/
]);
推荐指数
解决办法
查看次数
modernizr 2.5.3媒体查询测试在IE和Opera中打破页面
我有一个使用媒体查询的HTML5文档.为了迎合旧浏览器的用户,我只是试图模仿JS中的行为,并使用modernizr 2.5.3(我昨天从HTML5 Boilerplate下载得到的文件)来进行mq测试.
我想做的另一件事是如果客户端使用简单的支持触摸事件,则稍微更改UI Modernizr.touch.
我这样做的方式如下:
//$window is $(window)
if ($window.width() < 575 || Modernizr.touch){
//change UI layout a little
}
if (Modernizr.touch){
//enable tap-navigation for touch devices
}
if (!Modernizr.mq('only all and (min-width: 575px)')){ //fix non-media query browsers
$window.resize(function(){
if ($window.width() < 575){
//add CSS
} else {
//remove CSS
}).trigger('resize');
}
这在Webkit(移动和桌面)和Firefox中运行良好,但是当我尝试在Opera(11.6)或Internet Explorer(7到9)中打开页面时,地狱就会松动.事件将随机播出一段时间,jQuery动画将中途停止,说实话我不知道可能发生什么(尽管没有控制台错误).当我删除页面顶部的modernizr脚本时,它工作得很好(当然除了功能检测......).
我正在做的是使用html5shiv(我在现代化之后加载它,但仍然在头部)像:
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
我怀疑这是IE崩溃的罪魁祸首,但由于这对Opera的行为没有任何影响,我有点无能为力.
我做错了什么,或者这是一种什么样的错误,我应该寻找另一种方法来进行我的功能检测？
编辑:
当我试图找出发生了什么时,我发现了以下内容:似乎是所有邪恶根源的只是媒体查询测试:Modernizr.mq('only all and (min-width: 575px)') …
推荐指数
解决办法
查看次数
使用Modernizr库,为什么要在html标记中添加类
任何人都可以解释(因为github页面没有)为什么Modernizr认为需要将所有这些类名添加到HTML标记中？加载Modernizr后,它看起来像这样:
<!doctype html>
<html class=" js flexbox canvas canvastext webgl ~~~~ etc etc
我完全没有解释为什么要这样做.Modernizr提供的属性让我知道是否支持canvas(Modernizr.canvas == true？).这些html类名是否为测试添加了更容易？
推荐指数
解决办法
查看次数
如何使用Modernizr检测是否支持SVG CSS背景？
问题是如何使用Modernizr来检测是否支持SVG CSS背景？
.svg #example{} 不是正确的方法,因为不同的浏览器对svg文件有不同的支持.
例如,Modernizr报告在firefox 3.5中支持SVG,但不支持SVG文件和CSS作为背景图像.
推荐指数
解决办法
查看次数
覆盖CSS Vs选择性地使用Modernizer加载CSS(YepNope)
不确定如何测试这个但是通过使用Modernizer.load的查询加载CSS样式表是否有任何性能提升,而不是仅在同一样式表中用CSS类名覆盖规则.
例如,如果设备具有触摸支持,那么我有一个不同的布局要加载,是否更快做...
{
test: Modernizr.touch,
yep : 'css/touch.css',
nope: 'css/base.css'
}
或者覆盖相同样式表中的样式......
.container { width: 50% }
.touch .container { width: 100% }
似乎差异归结为额外查询的速度和一个大CSS文件的重量？
推荐指数
解决办法
查看次数
将modernizr加载到head中,但在require.js中使用它
我想在头部同步加载modernizr以防止出现问题.我在before/body之前使用require.js来加载一些其他脚本,其中我想使用modernizr进行特征检测等等.
什么是正确的方法或甚至建议这样做？如果我在我的脚本中需要modernizr它会再次加载,如果我不这样做,它是未定义的.
提前致谢.:)
推荐指数
解决办法
查看次数
在Safari 5.1.7 for Windows中未检测到视频元素
我在Windows 7上运行Safari 5.1.7.
我的网站上播放了一个HTML 5视频元素,在运行视频脚本之前,我使用modernizr来测试是否支持视频.
据caniuse.com称,Safari 5支持视频.但是,在控制台中,Modernizr.video返回false.当此浏览器支持视频时,为什么返回false？
推荐指数
解决办法
查看次数
WebSocket与“ ws：//./”的连接失败：连接建立错误：net :: ERR_NAME_NOT_RESOLVED
我对websockets不了解，我在这里使用管理模板
https://github.com/onokumus/Bootstrap-Admin-Template
我不知道我做错了什么或它如何给这个问题，但是我在谷歌浏览器控制台中遇到了这个错误。
WebSocket connection to 'ws://./' failed: Error in connection establishment: net::ERR_NAME_NOT_RESOLVED
它引用此文件modernizr-build.min.js:2是错误的。
注意： 错误仅在Google Chrome中显示，但在Firebug中没有显示此错误？
谁知道我为什么会收到此错误，以及如何在不损害主题其他任何特征的情况下摆脱此错误？
推荐指数
解决办法
查看次数
Modernizr:未能在Firefox上的日期输入上执行datetime()
我正在使用Modernizr并且无法获取jquery UI日期选择器以在FireFox中原生显示html5日期输入.
这个小提示显示我的意思 - 在FireFox中打开它在Firefox中 打开时我只是得到一个文本输入 http://jsfiddle.net/Te2yL/
码:
<head>
//Include Modernizr - all items are included (full-fat version)
<script src="assets/js/vendor/modernizr.js"></script>
</head>
<body>
<input
type="date"
id="start-date"
ng-model="someVariable"
format-date
class="form-control date"
/>
<script>
Modernizr.load({
test: Modernizr.inputtypes.date,
nope: ['https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.22/jquery-ui.min.js',
'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.22/themes/smoothness/jquery-ui.css'
],
complete: function () {
$('input[type=date]').datepicker({
dateFormat: 'yy-mm-dd'
});
}
});
</script>
</body>
</html>
要确认,在FireFox中打开时,会下载Jquery-ui js&css.
我仍然在浏览器中显示文本输入 - 它的类型在检查DOM时仍然是'日期'.
我错过了什么吗？
非常感谢
推荐指数
解决办法
查看次数
使用modernizr检测iOS设备
所以我正在尝试下载一个图像,我使用window.location = data.url;哪个指向图像文件然而,在iOS中它将它发送到实际图像,您需要点击并按住以保存.
我知道没有办法解决这个问题,我觉得它打破了旅程,所以我想把它们引导到我创建的另一个页面,用图像和文字说"点击并按住",以便用户知道.
我查看了文档,但迷路了.如何检测是否有人在使用iOS设备？
推荐指数
解决办法
查看次数