前言:
当前你们对“jquery判断是否chrome”大体比较关心,我们都想要分析一些“jquery判断是否chrome”的相关知识。那么小编在网上网罗了一些关于“jquery判断是否chrome””的相关文章,希望兄弟们能喜欢,大家快快来了解一下吧!做前端的基本都知道 chrome谷歌浏览器下字号一旦小于12px的时候,都会显示12px,这是一个很早就存在的问题了,原因是谷歌是一家很注重用户体验的公司,旗下浏览器chrome也不例外。
在他们看来,中文字体一旦小于12px就会影响阅读,所以我们终于知道这不是谷歌的bug,是他们特意为之的。
那么有些个别的情况,一定要小于12px,该怎么办呢?
有一个方法就是给当前样式添加谷歌私有属性:-webkit-text-size-adjust:none;
但是随着chrome的更新,这个已经不能有效了,于是又有了下面的针对chrome的css hack。
@medias creen and(-webkit-min-device-pixel-ratio:0){
-webkit-transform:scale(0.8);
}
随着版本的更新,这个又用不了了。
无奈
最后用了1个小时写了终极方案,不管在如何升级它都是有效的,经过反复测试有效,基于jquery。
//判断是否chrome
var isChrome = window.chrome == undefined ? false : true;
//方法
$(function(){
if(isChrome){
$('.chrome').each(function(){
var obj = $(this);
var fs = obj.data('fs');
obj.css({'font-size':'12px', '-webkit-transform':'scale('+ fs/12 +')'});
})
}
})
使用
<h1 class="chrome" data-fs="8">切图网是专门做h5前端的公司</h1>
data-fs="8" 是字号为8px的意思。
---
切图网 原创,专注psd转html5等前端开发。
标签: #jquery判断是否chrome