前言
毛玻璃模糊效果，即PS中高斯模糊效果，这种效果在设计中能展现出优质的界面，IOS应用中也多出应用。那如何实现呢？
手机端取消文字选中、取消图片长按下载
企业号有一种消息类型叫保密消息，该类型消息有全屏水印、图片水印、禁止分享至朋友圈、禁止选中文字等功能。
但是对于图片，手机端默认长按时会触发下载保存交互。
首先想到的方案是通过JS实现，对touch实践做处理。
|
1 |
window.ontouchstart = function(e) { e.preventDefault(); }; |
但是这个对于长的文章，滚动事件就失效了。所以此方案无效，但是如果只是某个div有需求，可以这样处理。
其实这个可以通过CSS3的属性去除。
|
1 |
img { pointer-events: none; } |
如果只是对图片禁止选中，长按图片的时候不会有问题，但是如果是先选择旁边的文字，再覆盖选取图片，那图片照样会被copy出来。
禁止选中
|
1 2 3 |
-webkit-user-select: none;/*禁用手机浏览器的用户选择功能 */ -moz-user-select: none; |
这时候对文字禁止选中就没有问题了，整篇文章不可以复制或保存。截屏的时候会带有水印。
还有一招更甚，直接
|
1 |
*{ pointer-events: none; } |
完美实现以上需求，完成。
2015/01
29 周四
响应式网页设计- 移动、ipad端开发总结
前言
响应式Web设计(Responsive Web design)的理念是： 页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。具体的实践方式由多方面组成，包括弹性网格和布局、图片、CSS media query的使用等。
1、特殊的meta 标签
现在我们用的智能手机（iOS，Android）的浏览器都是基于webkit内核，由于webkit的浏览器对于html5的支持比较好，所以我们在声明头部的时候最好用html5的声明方式。标签中可以设置具体的宽度（如像素值）或者缩放比例如2.0（设备实际尺寸的两倍）。 查看全文
2014/11
05 周三
CSS3实现的炫酷Loading效果
简介
一组CSS3实现的Loading加载图标，很简单漂亮，对于不支持的浏览器也可以方便的Fallback
效果预览
在线预览
http://xuanfengge.com/demo/201409/SpinKit-master/
图片效果
2014/09
20 周六
jQuery方向感知动画-图片聚焦框
前言
分享一段创意相册交互：透明层聚焦框跟随鼠标在相册的图片上移动，聚焦框跟随图片大小改变形状，利用CSS3实现渐变透明效果，大方美观。
效果预览
2014/09
20 周六