UI交互中常用的动态特效分析

2015年大小企业最注重的就是用户体验,手机也已成为大家使用最多的工具,如何让用户在手机上也拥有好的体验,是前端和设计师努力的目标,下边为大家收集了几种最实用和体验最好的UI交互特效。提示性控件提示控件让用户关注于上下文控制。他们在需要时出现,不需要时消失。当用户切换到一个特定的模式,提示控件可以通过动效进行一些新式的交互。滑动和淡入淡出就属于实现这个目标的最常用的动效。提示...

2409 2 2015-07-19 经验分享

Lazyr.js – 延迟加载图片(Lazy Loading)

Lazyr.js 是一个小的、快速的、现代的、相互间无依赖的图片延迟加载库。通过延迟加载图片,让图片出现在(或接近))视窗才加载来提高页面打开速度。这个库通过保持最少选项并最大化速度。

1917 2 2015-07-19 经验分享

jquery获取页面宽度,滚动条高度,元素高度

jquery 获取滚动条高度获取浏览器显示区域的高度 :$(window).height();获取浏览器显示区域的宽度 :$(window).width();获取页面的文档高度 :$(document).height();获取页面的文档宽度 :$(document).width();获取滚动条到顶部的垂直高度 :$(document).scrollTop();获取滚动条到左边的垂直宽度 :$(document).scrollLeft();计算元素位置和偏移量:$(id).offset();offset方法是一个很有用的方法,它返回...

1838 2 2015-07-18 经验分享

input文字获取焦点消失 离开焦点显示

input文字获取焦点消失 离开焦点显示html<input type="text" value="请输入数据APPID" data-empty="请输入数据APPID" class="form-input-text">js/** * input文字获取焦点消失离开显示 */ var inputTextVal = ''; $('body').on('focusin', '[data-empty]', function() { var fieldEl = $(this); var val = $.trim(fieldEl.val()), emptyTip = fieldEl.data('empty'); if (val == ...

2402 2 2015-07-18 经验分享

js点击页面空白隐藏层

最近发现我之前做这个效果的时候思路是错误的,今天修改了一下方法,因为之前的方法会在按钮上阻止事件冒泡,从而导致一个页面同时存在多个此功能的按钮出现点其他按钮不能隐藏层的bug。下面的方法才是正确的:HTML<span class="search">我是按钮1</span><span><a class="clickme" href="#">我是按钮2</a></span> <div class="div_d" style="display: none;">我是1那个弹出层</div> <div class=...

1885 2 2015-07-18 经验分享

js鼠标滚轮控制页面滚动 滚屏动画实例

最近发现这种效果很流行,自己也写一个,以后应该能用上。技术重点应该就是鼠标滚轮的兼容性写法那里,因为jquery没有封装鼠标滚轮事件,用原生JS写的话每个浏览器的标准都不一样,很麻烦。右侧边栏按钮点击滚动页面的效果就是普通的图片滚动展示效果而已,没什么难度。下面是代码,我都放在一个页面里面。<!doctype html> <html> <head> <meta charset="utf-8"> <title>js鼠标滚轮控制页面滚动 滚...

4326 2 2015-07-18 经验分享

JS数字金额大写转换

JS数字金额大写转换 /** 数字金额大写转换(可以处理整数,小数,负数) */ var digitUppercase = function(n) { var fraction = ['角', '分']; var digit = [ '零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖' ]; var unit = [ ['元', '万', '亿'], ['', '拾', '佰', '仟'] ]; var head = n < 0 ? '欠' : ''; n = Math.abs(n); var s = ''; for (var i = 0; i < f...

1762 2 2015-07-18 经验分享

复制内容时自动加本文来自链接地址

这段代码在开发过程中经常用到,就是当复制别人的内容的时候,往往内容的最后都有一段链接地址,比如:这种效果是通过js来实现的,代码如下:<script type="text/javascript"> ///复制网站内容自动加上网址 document.body.oncopy = function () { setTimeout( function () { var text = clipboardData.getData("text"); if (text) { text = text + "\r\n 本文来自:"+location.href; clipboardDat...

2202 2 2015-07-01 经验分享

js获取来路url和当前url地址

js获取来路url地址,相当于php的$_SERVER[‘HTTP_REFERER’]。方法:利用js获取来路url地址可以准确地判断网页的真实来路。 目前百度统计,google ads统计,CNZZ统计,都是用的这个方法。防盗链也很简单了,js里判断来路url如果不是本站不显示图片,嘿嘿。document.referrer注:js中的referer是referrer不是referer,即:document.referrer,不要写错了,要注意了,呵呵,我也写错过额。顺便把js获取当前url的方法也说...

1492 2 2015-07-01 经验分享

简单的JS获取当前日期,星期代码

简单的JS获取当前日期,星期代码 [cc lang="js"] var week; var year=new Date().getYear(); year = (year < 1900) ? (1900 + year) : year; if(new Date().getDay()==0) week="星期日" if(new Date().getDay()==1) week="星期一" if(new Date().getDay()==2) week="星期二" if(new Date().getDay()==3) week="星期三" if(new Date().getDay()==4) week="星期四" if(new Dat...

1710 2 2015-03-03 站长杂谈

js获得当前日期的函数写法

js获得当前日期的函数写法 [cc lang="js"] [/cc]

2112 2 2015-01-05 经验分享

360度旋转图片展示jquery插件UIMIX.fullview

360度旋转图片展示jquery插件UIMIX.fullview是一款功能非常强大的图片360度旋转特效,是浏览VIVO智能手机官方网站时整理出来的,使用的时候只要准备好要展示的图片和设置好参数就好,image_count是图片的数量,除了360度旋转功能外还有图片带进度条加载特效。。。 jquery插件参数配置如下: [cc lang="php"] data: { ready: false, dragging: false, pointerStartPosX: 0, scale: 1, fix_widt...

2082 2 2014-12-27 站长杂谈