- 博客(5)
- 资源 (1)
- 收藏
- 关注
RSS订阅转载 浏览器的重绘与重排
转自前端社区。在项目的交互或视觉评审中，前端同学常常会对一些交互效果质疑，提出这样做不好那样做不好。主要原因是这些效果通常会产生一系列的浏览器重绘(redraw)和重排(reflow)，需要付出高昂的性能代价。那么，什么是浏览器的重绘和重排呢？二者何时发生以及如何权衡？如何在具体的开发过程中将重绘和重排引发的性能问题考虑进去？本文期待可以部分解释以上三个问题。浏览器从下载文档到
2014-03-12 15:12:08
486
原创 关于响应式设计
响应式设计就两个关键点，一是不修改DOM结构调整布局。二是根据不同的屏幕应用不同的CSS。不修改DOM结构调整页面布局的关键是 流式布局。宽度用百分比（也有人用em）； 根据不同屏幕应用不同的CSS 需要用到的是HTML5提供的一种新的CSS语法——@media；@media only screen and (max-width: 640px) { }上面这段
2014-03-03 10:03:28
668
原创 js兼容问题，鼠标相对于事件源的位置，offsetX，layerX
前几天在工作中遇见一个问题。就是要判断鼠标点击后 相对于事件源（event.target）的位置。当然可以用event.offsetX,event.offsetY,来获取到。 但是到了FF里面就挂了。 event.layerX 也不获取不到。干脆就自己写了个方法，function getOffsetXY(evt) { if (evt.offsetX && evt.o
2014-02-28 11:24:40
2198
翻译 HTML5 桌面通知
第1步：检查通知API的支持if (window.webkitNotifications) { console.log("浏览器支持桌面通知");}else { console.log("浏览器不支持桌面通知 建议使用Chrome");}第2步：获取权限document.querySelector('#show_button').addEventListener('c
2014-02-26 10:10:23
469
原创 利用Chrome32+ 模拟移动设备
F12打开控制台进入设置找到overrides这个选项，勾选Show 'Emulation' view in console drawer关闭控制台设置窗口。进入Show Drawer选择Emulation 选项。下拉列表里面可以选择各种移动设备，点击Emulation,就可以 。点击rest可以还原。
2014-02-24 09:46:39
772
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人