FED实验室 - 专注WEB端开发和用户体验

 分类:前端开发

前端开发相关

用 CSS 隐藏页面元素的方式总结

今天看到篇文章"用 CSS 隐藏页面元素的5种方法",现加上自己的一点见解及常见应用归纳如下: 一、Display 将display设置为none,可以实现元素隐藏,并且不会生成盒模型。使用这个属性,被隐藏的元素不会占用任何空间。一旦给元素设置display:none,任何对该元素的交互操作都不会生...

煦涵 1年前 (2016-06-09) 2746℃ 0评论 6 喜欢

Safari :active伪类失效问题

:active伪类,参见CSS2.1 Selector Spec,如果在PC端开发中会经常遇到,当然在某些初级或入门级的面试中也会问到A锚链接元素的几种状态,也许你可能会弄混,:link,:visited,:hover,:active, 常用缩写"LVHA", 或者更好记忆为"LOVE HATE"即...

煦涵 2年前 (2016-02-21) 2055℃ 0评论 5 喜欢

jQuery 3.0 Beta Released

jQuery blog: jQuery 3.0 Beta Released 2016-01-14 1. 优化.show()和.hide()方法 2. 改进.data()方法实现,为更好匹配HTML5 dataset specification <div data-name="张三" data...

煦涵 2年前 (2016-02-20) 1653℃ 1评论 1 喜欢

HTML5 Element.dataset 初探

一. 我是谁 HTMLElement.dataset 属性允许我们访问所有在元素上自定义的data属性 (这种属性一般以data-开头). 它的结构是一个DOMString映射表,对每一个自定义的数据属性都有一个实体与之对应。 自定义的数据属性名称是以 data- 开头的。 它必须要遵循 the p...

煦涵 2年前 (2016-02-14) 1656℃ 0评论 0 喜欢

再聊CSS伪元素

之前写过一篇“CSS伪类和伪元素的异同”的文章,里面详细描述了伪类与伪元素的区别以及一些常见应用。由于最近项目开发中,IE8浏览器下遇到一个bug,再聊伪元素。 我们知道随着CSS规范进一步完善,新增的CSS伪元素越来越多,但是在日常开发中,我们常用的及浏览器支持情况比较乐观的当数before和af...

煦涵 2年前 (2015-09-25) 2993℃ 0评论 3 喜欢

移动Web开发系列——软键盘及常见问题

移动端软件和PC端不同,Android和iOS两个系统的处理方式各异,其中Andriod中各个厂商对软键盘的处理方式也不同.本文将从以下几个方面阐述移动端软键盘的各异. 一. 不同系统中软键盘的特点 1) iOS系统 a.如果控件在键盘高度上方的话,键盘是以一个浮层的方式弹出,并且将那个触发的控件推...

煦涵 2年前 (2015-09-10) 8961℃ 1评论 5 喜欢

移动端点击穿透知多少

在移动端click事件会有300ms的延迟, 用肉眼可以明显感觉到, 因此在开发中常常会遇到点击穿透的问题, 令不少初学者头疼,本篇文章将从由来, 常见问题, 解决方案几个方面来阐述点击穿透现象, 给予初学者以参考. 一. 300ms延迟的由来 这要追溯至2007年初, 苹果公司在发布首款iphon...

煦涵 2年前 (2015-09-09) 3325℃ 0评论 2 喜欢

移动端模拟弹窗二三事

移动端模拟弹窗时,遇到一些问题,现总结如下,以加深记忆。 情况一: 当body高度大于viewport高度时,在弹窗上滑动时,会遇到body也跟着滑动的现象。 解决思路: 禁止touchmove,及overflow:hidden来实现,参考下面代码: /** * 初始化弹窗 */ var ...

煦涵 2年前 (2015-09-09) 3899℃ 1评论 1 喜欢

聊聊Base64

做为一名FE,你肯定用到过base64,谈到base64,你可能会想到以下几点,base64是什么,浏览器如何解析,现有技术如何把图片转换为base64,base64应用场景有哪些,base64如何解码等等,下面就这些问题一一讲述. base64是什么 Base64是网络上最常见的用于传输8Bit字...

煦涵 2年前 (2015-08-06) 2109℃ 0评论 1 喜欢

iframe使用总结

以前在CSDN上写的文章,在此备忘。 iframe使用总结 下面是「FED实验室」的微信公众号二维码,欢迎扫描关注:转载声明:本文标题:iframe使用总结本文链接:http://www.zuojj.com/archives/1498.html,转载请注明转自FED实验室-专注WEB端开发和用户体...

煦涵 2年前 (2015-07-31) 3850℃ 0评论 2 喜欢

placeholder属性多浏览器支持兼容性方案

最近项目开发中遇到不少蛋疼的问题,每一个问题都可单独拿出来探讨,前端领域就是这样,浏览器对标准支持不一,国内IE市场仍有相当的占有率,无端的提高了开发和维护成本。 在本篇文章将来探讨placeholder这个属性,该属性是HTML5提出的一个属性, 占位符的属性值在用户录入数据时用来作为一个简短的提...

煦涵 2年前 (2015-07-19) 7250℃ 1评论 8 喜欢

实时监听输入框值变化的兼容性方案

最近在项目中需要实时监听输入框的值的变化,首先想到的是onchange,onblur,onkeydown,onkeyup,onpress等一系列常见事件,但是使用这些往往达不到实时监听的效果。 onchange事件: 只在键盘或者鼠标操作改变对象属性,且失去焦点时触发,js脚本触发无效。 onkey...

煦涵 2年前 (2015-06-23) 5771℃ 1评论 2 喜欢

Flexbox#1:基本属性的使用

Flexbox是一个CSS布局系统,使用它可以很容易的实现动态布局。使用flexbox,平常开发中遇到的垂直居中布局,等高布局,重排,方向不可知等布局都是小菜一碟。 可能你会说现在还不是使用flexbox的最佳时间,但是据统计93%的人都在运行支持flexbox的浏览器,它比对HTML5 元素的支持...

煦涵 2年前 (2015-06-18) 3573℃ 0评论 0 喜欢