掏点东西

js cancelAnimationFrame兼容低版本浏览器（支持IE9）

与 requestAnimationFrame() 方法一样，javascript window对象的 cancelAnimationFrame() 方法同样不支持IE9及其它低版本浏览器，毕竟 cancelAnimationFrame() 方法就是用来取消 requestAnimationFrame() 动画帧的。因此兼容IE9及其它低版本浏览器的方法也差不多。 代码如下： window.cancelAni...

Web前端开发 / 2021-01-09 / 2922次阅读

javascript利用canvas lineTo结合参数方程绘制椭圆（支持IE）

目前使用canvas画布绘制椭圆形的方法有 ellipse()、 scale()、贝塞尔曲线以及 lineTo()，其中比较推荐 ellipse()，但是该方法尚未纳入标准，IE全系列浏览器都不支持，其它浏览器目前比较好。 如果想兼容IE浏览器，可以考虑使用 lineTo() 方法，但是如果要绘制的椭圆像素较大，会存在很大的效率问题，甚至浏览器崩溃，但是小又少的椭圆影响不大。 HTML代码...

Web前端开发 / 2021-01-08 / 2480次阅读

js requestAnimationFrame方法兼容IE9和其它低版本浏览器的写法

IE9以下浏览器或其它低版本浏览器不支持js window对象的方法 requestAnimationFrame()，但是可以结合 setTimeout 以及各自浏览器的专属前缀实现低版本浏览器的兼容。 支持 requestAnimationFrame() 方法的浏览器 代码： window.requestAnimationFrame = window.requestAnimation...

Web前端开发 / 2021-01-08 / 3558次阅读

实现IE10/IE11支持object-fit属性的插件bideo.js

在响应式网页开发中 object-fit 属性是极为常用的一个css属性，遗憾的是IE浏览器全系列都不支持 object-fit 属性，但是可以借助bideo.js插件实现 IE10 和 IE11 对 object-fit 的支持。 PS：不支持 IE9 和 Edge 插件下载：https://github.com/rishabhp/bideo.js 插件使用 HTM...

Web前端开发 / 2021-01-07 / 3677次阅读

javascript navigator.language所有语言的列表

javascript Web API接口navigator.language（只读属性）可以返回一个表示用户偏好语言的字符串，通常指浏览器UI的语言（即在浏览器设置中选择的语言），换个思路，使用navigator.language可以在一定程度上判断浏览访客来自哪个国家，至少能判断浏览器使用的是哪国语言（根据浏览器语言的选择）。 navigator.language语言列表： 来自stackoverflow...

Web前端开发 / 2020-12-19 / 9000次阅读

PSD字符字重Light、Regular对应CSS font-weight的属性值参考

css属性font-weight提供的属性值有normal、bold、bolder、lighter、100~900、inherit，而设计师提供的设计稿字符面板通常是这样的： 而且设计师用字体的字重通常不只有一种，如Thin、UltraLight、Light、Regular、Medium、Semibold、bold、Extra Bold、Heavy等，如下图： 那么如果在网页...

Web前端开发 / 2020-12-17 / 6342次阅读

实现fullpage.js插件横向滑块slide自动轮播效果

fullpage插件的slide横向滑块不能设置自动轮播，如果要使slide自动轮播可以使用fullpage插件的moveSlideRight()方法或moveSlideLeft()配合js的setInterval()实现。 代码 setInterval(function(){ $.fn.fullpage.moveSlideRight(); },5000); 或 setInt...

Web前端开发 / 2020-12-10 / 5045次阅读

针对IE9不支持placeholder的兼容处理方法代码

IE9及IE9以下浏览器不支持placeholder属性，对IE9的placeholder兼容性处理方法通常是把placeholder的属性值放在value属性中，但这样不利于判断值是否为空，兼容性比较好一个方法是用一个元素覆盖在输入框上面代替placeholder，点击时再隐藏。 HTML代码 <div class="input"> <label class="placeh...

Web前端开发 / 2020-12-09 / 2435次阅读

jquery实现淘宝APP收货地址地区联动选择效果(优化版)

使用jQuery模仿淘宝移动端APP中，添加收货地址时选择所在地区的省、市、区、县街道四级联动的选择效果。 效果如下图： 原插件：https://www.jq22.com/jquery-info21567 下面是把代码优化过后的版本。 1、把下面代码保存为areaSelect.js文件： var first_char; var listArr = []; v...

Web前端开发 / 2020-11-03 / 2966次阅读

原生javascript实现禁止浏览器滚动,滚动条不消失代码

使用css代码可以禁止网页滚动，但是会使浏览器窗口的滚动条消失。而js代码则可以让页面禁止滚动的同时，保留滚动条的显示状态，而且滚动条的位置不变。 javascript代码 var keys = { 37: 1, 38: 1, 39: 1, 40: 1 }; function preventDefault(e) { e = e || window.event; if (e.preventDe...

Web前端开发 / 2020-11-02 / 4126次阅读

javascript实现定位当前城市返回城市名称的代码

在网页上定位当前城市，并返回当前城市名称，最简单的实现方法就是利用现成的城市定位接口，如百度普通IP定位接口、搜狐的城市定位api、腾讯地图IP定位接口等。 百度普通IP定位接口 https://api.map.baidu.com/location/ip?ak=申请的百度地图密钥&coor=bd09ll 官方主页：http://lbsyun.baidu.com/index.php?tit...

Web前端开发 / 2020-10-29 / 3251次阅读

原生javascript删除html标签属性的方法removeAttribute()

jquery使用removeAttr()方法删除标签属性，原生javascript使用removeAttribute()方法删除标签属性。两个方法的名称差不多。 HTML代码： <div class="one" style="padding:50px"></div> <h2 style="padding:50px"></h2> <div id="two"...

Web前端开发 / 2020-10-23 / 5346次阅读