简单css3-transform鼠标效果
作者:admin 日期:2015-04-18测试页地址:http://blog.258754.cn/2015/flower/trf.html
效果比较简单,一般基础都能写出。主要是考虑此类效果比较常用,我自己做了一下思路整理,以便于工作中快速调用。
首先是把transition提炼成一个单独的class,这样调用时只要这样写就行了:
- .trans {transition: all 0.5s ease-in-out;}
- .trans03{transition: all 0.3s ease-in-out;}
- .trans08{transition: all 0.8s ease-in-out;}
- //调用时这样写
- <div class="tit trans">变化稍慢<br />Y轴转动</div>
接下是熟悉transform的emmet速写,不熟悉emmet的朋友请自行百度
- trf transform:;
- trf:r transform: rotate(angle);
- trf:rx transform: rotateX(angle);
- trf:ry transform: rotateY(angle);
- trf:rz transform: rotateZ(angle);
- trf:sc transform: scale(x, y);
- trf:sc3 transform: scale3d(x, y, z);
- trf:scx transform: scaleX(x);
bootstrap定制-这样比较符合中国式的开发要求
作者:admin 日期:2015-04-15基于bs版本: v3.3.4我做了一下定制,主要选择项如下:
定制后,主文件bootstrap.css由139K减少到102K
最后我决定所有的JS文件都不要了,连那仅有的三个勾都没选。
六边形-蜂巢形-花瓣形导航菜单
作者:admin 日期:2015-04-14测试FontAwesome对于IE8的兼容性
作者:admin 日期:2015-01-14idangerous.swiper.js的loop循环方式带来的控制问题
作者:admin 日期:2015-01-03swiper.js是手机微场景制作中最常用的框架,功能强大,参数齐全。它在使用loop: true这样的参数时,滑动片将可以首尾连接,即可以循环地滑动场景。
jquery插件-交互型网站-首页场景及大图预载-带进场动画-preloader
作者:admin 日期:2014-08-08应用于“图片数量多、体积大”页面的预加载,会给浏览者带来较好的用户体验,尤其是企业LOGO的提前显示,会让网站呈现出更完整的品牌形象。
优点:
1、未加载完成前,正式页面不显示。
2、自定义加载序列、自定义背景颜色变化、背景透明度。
3、参数灵活、调用较丰富,如以下3种加载画面方式。
4、站长dudu加入了时间线动画机制,可在加载原画面基础上,自定义更丰富的JS动画。
5、加载完毕后给出消息,方便自定义调用事件(如消隐掉加载动画、调用新的进场动画等)。
缺点:
- 进度计算,是以图片加载完成的张数(而不是字节数)来计算的,因此加载数字进程看上去不平均。
本测试范例使用的LOGO加载方式,加载过程中,调用了自定义“小光点向上飞行”的动画,为演示方便,只加载了2张大图,加载完成后,即撤去黑底,播放大图动画。
付费100元,可得到完整程序包,含技术文档,及得到站长技术支持。
本站长支付宝帐号:258754@qq.com
jquery对IE系列的兼容性支持-经测试发现jquery 1.11.1都支持IE8
作者:admin 日期:2014-08-02canvas+createjs制作满天星星旋转效果
作者:admin 日期:2014-04-07HTML世界销售地图-带交互子菜单
作者:admin 日期:2014-03-20sublime text3-emmet自定义文件snippets.json的路径
作者:admin 日期:2014-01-19在国内的网站上几乎查不到这个问题的解决方法,特此记录一下:
Emmet.sublime-settings的snippets.json文件,是用来自定义进行emmet缩写组合的,这个文件默认是没有的,必须自己建立,文件可以在国外很多网站上下载,我分享一个:
https://github.com/emmetio/emmet/blob/master/snippets.json
而这个文件下载以后,编辑以后,应该放到以下路径:
C:\Users\Administrator\emmet\Emmet.sublime-settings
把c:换成你自己的系统盘,如果没有路径,自己建立一下。
Dreamweaver 的snippets.json路径在此:
C:\Users\your user name\AppData\Roaming\Adobe\Dreamweaver CS6\en_US\Configuration\Commands\Emmet
大气页头动画效果重器!
作者:admin 日期:2013-10-23全屏观看请点击:http://blog.258754.cn/2013/ll/
来自于国外的商业应用,3D/2D效果、组合无限、播放组件定义自由、尺寸自适应、兼容浏览器,几乎完败一切同类应用。
商业应用可联系本站长,QQ:258754
来自于unheap.com的jquery-hover(鼠标感应效果)中文大全
作者:admin 日期:2013-09-30英文原站地址在这里: http://www.unheap.com/section/user-interface/hover/
第1集在这里:http://blog.258754.cn/article.asp?id=136
我就不多写了,只上个索引图
注释翻译了一个国外的长页面拖动案例
作者:admin 日期:2013-09-22今年特别流行长页面!加上这些拖动动画,非常之生动。不管你用不用,反正我用了。请拖住滚动条一直往下拉,可以看到各类动画。
中文注释在demo.js中
全屏请点击这里查看:http://blog.258754.cn/2013/drag/