昨天的滑块建立在Input range这个基础上  这是IOS5.0及以后才支持的,而且在android2.3以下表现也不对

昨天的检测方式

var input = document.createElement('input');
input.setAttribute('type','range')
console.log(input.type == 'range')

不能完全检测出不支持。今天找到了modernizr http://modernizr.com/docs/#installing

看了人家的方式 ,感觉老外真是有耐心啊

inputElem.setAttribute('type', inputElemType = props[i]);
bool = inputElem.type !== 'text'; if ( bool ) { inputElem.value = smile;
inputElem.style.cssText = 'position:absolute;visibility:hidden;'; if ( /^range$/.test(inputElemType) && inputElem.style.WebkitAppearance !== undefined ) { docElement.appendChild(inputElem);
defaultView = document.defaultView; bool = defaultView.getComputedStyle &&
defaultView.getComputedStyle(inputElem, null).WebkitAppearance !== 'textfield' &&
(inputElem.offsetHeight !== 0); docElement.removeChild(inputElem); }
}

检测浏览器是否支持range的更多相关文章

  1. js检测浏览器是否支持某属性

    以检测浏览器是否支持 input 标签的 required 属性为例: var isSupport = 'required' in document.createElement('input');

  2. WebSocket API使用篇检测浏览器是否支持WebSocket(4)

    WebSocket API是下一代客户端-服务器的异步通信方法.前面有三篇文章已经对WebSocket有了一些介绍,这里我总结了一下.我在使用WebSockets API过程中遇到的问题. 1.检测浏 ...

  3. 检测浏览器是否支持cookie方法

    cookie 摘自: http://www.cnblogs.com/fish-li/archive/2011/07/03/2096903.html Cookie是什么? Cookie 是一小段文本信息 ...

  4. 检测浏览器是否支持某个css属性

    以浏览器是否支持translate3d 为例说明,当然现代浏览器已经支持该属性.如果浏览器实现了带有前缀的某个属性,比如说支持-webkit-transform,但是不支持直接写transform,可 ...

  5. HTML5 Canvas 代码检测浏览器是否支持

    在创建HTML5 Canvas元素之前,首先要检测浏览器是否能够拿支持他,如果不支持,就要用文字或图片替代,检测代码如下所示. <!DOCTYPE html> <html> & ...

  6. 检测浏览器是否支持AJAX

    <script type="text/javascript"> function ajaxFunction() { var xmlHttp; try { // Fire ...

  7. 检测浏览器是否支持cookie功能

    <script> if(navigator.cookieEnabled) { document.write("你的浏览器支持cookie功能!"); } else{ d ...

  8. 移动Web开发,4行代码检测浏览器是否支持position:fixed

    不废话,直接上代码 var div = document.createElement('div'); div.style.cssText = 'display:none;position:fixed; ...

  9. 检测浏览器是否支持ES6

    这是阮一峰老师写的一个工具 ES-Checker,用来检查各种运行环境对 ES6 的支持情况.访问ruanyf.github.io/es-checker,可以看到您的浏览器支持 ES6 的程度.运行下 ...

随机推荐

  1. 【【henuacm2016级暑期训练】动态规划专题 H】Greenhouse Effect

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 原题意等价于:给你一个序列(实数的位置没用!)..你可以改变其中某些元素的位置(插入到某些位置中间. 然后让他变成有序的. (有序的 ...

  2. 【codeforces 452D】Washer, Dryer, Folder

    [题目链接]:http://codeforces.com/problemset/problem/452/D [题意] 洗衣服有3个步骤,洗,干,叠; 有对应的3种洗衣机,分别有n1,n2,n3台,然后 ...

  3. 史上最全: svn与git的对照(二):svn与git的相关概念

    如图1是svnserver端数据的文件夹结构 以下是gitserver端的文件夹结构 纵观svn和git服务端的文件夹结构我们非常easy发现 1.有些目录还是蛮像的.甚至是一样的比方说svn中的co ...

  4. SQL语句将某字段查询出以逗号隔开

    MySQL的sql语句有好多能够省去server端的复杂处理 1.group_concat 这玩意儿能够实现  将一个字段如id查询出来   成为这种格式:121,122,123,124,125,12 ...

  5. 基于MySQL元数据的Hive的安装和简单測试

    引言: Hive是一种强大的数据仓库查询语言,类似SQL,本文将介绍怎样搭建Hive的开发測试环境. 1. 什么是Hive? hive是基于Hadoop的一个数据仓库工具,能够将结构化的数据文件映射为 ...

  6. emitter 增强 多条件触发

    ;(function(global ,undefined){ var evts = {} ,onceTag = '__event_once' function emit(event ){ ) if ( ...

  7. Bootstrap全局CSS样式之表单

    .form-control--将单独的表单控件赋予一些全局样式,如默认宽度width:100%. .form-group--包裹表单控件,获得最好的排列: .form-inline--将表单设置为内联 ...

  8. hdoj--2094--产生冠军(集合函数)

    产生冠军 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Submi ...

  9. angular4中日期格式的用法

    dateTime: Date; this.dataTime = new Date(); // 获取当前日期 // Wed Apr 18 2018 10:54:47 GMT+0800 (中国标准时间) ...

  10. Django(part4)

    一个简单的form表单: #polls/templates/polls/detail.html<h1>{{ question.question_text }}</h1> {% ...