我正在尝试使用modernizr测试:nth-child浏览器支持,但我不知道该怎么做,我发现这个http://jsfiddle.net/laustdeleuran/3rEVe/测试:last-child但我不知道如何改变它以检测:nth-child(我也在考虑使用它,因为我相信不支持的浏览器:last-child也不支持:nth-child,但我不确定)
你们能帮助我吗？提前致谢!
我想检查运行我的页面的浏览器是否能够处理'html 5 placeholder'
我知道我可以添加以下javascript检查:
!Modernizr.input.placeholder
但是为一次检查导入图书馆是否值得？
现代化者如何为我做这件事(我的意思是如何在封面下实施)？
我正在使用RequireJs来构建我的JavaScript代码.另外,我使用了很多CSS3,我使用了"Modernizr w/YepNope"+ x个css3 polyfill.
我理解"Modernizr w/YepNope"和RequireJs都是资源加载器.既然它们都是资源加载器,那么在同一个项目中同时使用它们是一个坏主意吗？
所以,基本上我问,使用是不是一个坏主意:
在同一页面？
有点奇怪.我有一个我正在努力的网站.但是,在我的笔记本电脑(华硕Zenbook)上,一些功能不起作用.我们花了很多时间使用Firebug尝试让它工作/解决它的问题,没有快乐!
然后我注意到这些功能实际上是在CSS中使用:hover类创建的,但也通过包含".no-touch"类来禁用触摸设备.
然后我查看了Modernizr添加到HTML标记的类,并添加了".touch"和标准.
看来,Modernizr正在将我的笔记本电脑(在Firefox和Chrome中)用作触控设备.
显然,这可能是一个问题,当网站上线时,某些功能对于使用Zenbook的任何人以及以相同方式起作用的任何其他设备都不起作用.
以前有人见过这样的事吗？也许与其他"非触摸"设备？
我正在使用<input type="date"/>根据caniuse.com android浏览器不支持这个.虽然我看一下HTC One 4.1.x上的页面,它有自己的输入字段本机渲染.三星Galaxy S3 4.1.2也具有该组件的渲染风格.然而caniuse.com表示不支持.HTC和三星已明确将此功能添加到他们的Android浏览器版本中.S3 4.1.2上的日期选择器会在多个S3上崩溃浏览器？
复制的步骤在首次访问页面时似乎更常见:
我正在使用Modernizr,Modernizr测试浏览器以查看其功能.在HTCOne和S3 modernizr上没有引入我正在使用的polyfill,这是正确的.
所以IOS工作正常,Android没有.如果没有现代化的"测试:"属性中的讨厌的黑客,我怎么能解决这个问题呢？
谢谢,很长一段时间阅读,但充其量只是一个有趣的错误.
麦克风
当我在触摸设备上下来时,我不想要悬停行为.是否可以立即禁用整个网站的所有悬停效果？
鉴于您使用Modernizr来检测触摸并设置类.
这是我想出来的,但它给出了很多不一致性:
html.touch *:hover {
color: inherit !important;
background: inherit !important;
}
有没有办法用纯CSS做到这一点？如果没有,如何用javascript完成？
我一直在使用超大jQuery作为我网站的幻灯片背景.我正在使网站响应并使用css媒体查询.
我希望能够在低于480px时禁用该脚本.
这是实际滑块背景的脚本
$(document).ready(function(){
jQuery(function($){
$.supersized({
// Functionality
slideshow : 1, // Slideshow on/off
autoplay : 0, // Slideshow starts playing automatically
start_slide : 1, // Start slide (0 is random)
stop_loop : 0, // Pauses slideshow on last slide
random : 0, // Randomize slide order (Ignores start slide)
slide_interval : 3000, // Length between transitions
transition : 6, // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
transition_speed : 1000, // Speed …我很困惑为什么
Modernizr.getusermedia
是未定义的,但是当我输入时
!!navigator.webkitGetUserMedia
它返回true.我正在使用Chrome,我知道支持webrtc ...所以为什么Modernizr说它未定义.
我用bower下载的Modernizr中包含了getusermedia.js文件:
Modernizr.addTest('getusermedia', !!Modernizr.prefixed('getUserMedia', navigator));
使用响应式布局和大量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
}
但在阅读了很多关于该主题的帖子后,我意识到不是检测浏览器,而是许多人建议使用功能检测.那么有没有办法找出浏览器如何处理滚动条？他们是否会成为页面布局的一部分,或者他们只会徘徊在Safari之类的所有内容之上？
谢谢你的帮助!
我想使用CSS的属性:
mix-blend-mode: soft-light;
And I will test by Modernizr for fallback bla bla...
Tested :
Modernizr.mixblendmode //undefined
Modernizr.testProp('mixblendmode'); //false
Modernizr.addTest('mixblendmode'); // no-mixblendmode
What am I missing ?
Tested on Firefox, CSS its work, but how to test with Modernizr ?