昨天的滑块建立在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. JavaScript push(),join() 函数

    定义和用法 push方法 可向数组的末尾添加一个或多个元素,并返回一个新的长度. join方法 用于把数组中所有元素添加到一个指定的字符串,元素是通过指定的分隔符进行分割的. 语法 arrayObje ...

  2. HDU 4331 Contest 4

    一个很直观的想法是,求出每个点上下左右能到达的最大长度.然后枚举其斜边...没想到过了.... 当然,题解有一个很巧妙的优化,利用树状数组,那个太巧妙了. #include<iostream&g ...

  3. Hibernate关系映射中的注解

    一.@Entity 写在映射表的类上面,表示这是映射来的实体 二.@Id @Column(name = "fid", nullable = false) @Basic @Colum ...

  4. m_Orchestrate learning system---十八、mo项目的启示是什么

    m_Orchestrate learning system---十八.mo项目的启示是什么 一.总结 一句话总结:多看教程,体统看教程的学, 完全不懂的话百度的作用也不大 多学点,可以节约后面的超多时 ...

  5. linux 内存不足时候 应该及时回收page cache

    另一起问题是24G内存的系统,空闲内存已经不到50M 1. 确认该系统的版本是64位 # uname -a Linux gxgd-nms-app 2.6.18-194.el5xen #1 SMP Tu ...

  6. javascript系列-class7.Date对象

    1.对象   什么是对象?       对象的类型是Object.   JavaScript 中的所有事物都是对象:字符串.数值.数组.函数...   javaScript中万事万物皆对象   用官方 ...

  7. lucene简单使用demo

    测试结构目录: 1.索引库.分词器 Configuration.java package com.test.www.web.lucene; import java.io.File; import or ...

  8. linux批处理笔记

    最近不得不用到Linux批处理,于是把要用到的程序反复研究了一下. #!/bin/bash是指此脚本使用/bin/bash来解释执行. -le -ge分别是小于和大于,这个倒是和latex里面的命令很 ...

  9. vue+Element实现tree树形数据展示

    组件: Element(地址:http://element.eleme.io/#/zh-CN/component/tree):Tree树形控件 <el-tree ref="expand ...

  10. Vue.js Ajax动态参数与列表显示

    一.动态参数显示 1.引入js <script type="text/javascript" src="/js/vue.min.js"></s ...