My_win7UI——基于H5,C3,JQ的小东西（原创）

在学校接触css3和jq和js确实有一两年时间了，不过总感觉缺少练习，我一直确信实战才是王道！所以呢一直想在无聊的时间整一个模拟win7UI的东西出来打发打发时间，好吧，终于有点半成品出来~小小感动下。。。

第一次在博客园发帖，虽然技术含量不是很高，但是还是很希望能得到更多前辈的意见和指点，让自己不断成长！本人自己认知很新手很菜，但是对web前端有极度的激情，这一点我觉得就是自己最大的学习动力。希望自己能在web前端这条道路上越走越远。

为了最佳的展示效果，请务必使用以下运行环境~

运行环境：基于webkit内核的浏览器（chrome，firefox，遨游等极速模式）

相关技术：html4，html5，css2.0，css3.0，jquery

特色：UI运用了大量的css3.0样式，包括圆角，阴影，透明，过渡，外发光等，用jquery实现窗体拖动，最大化，最小化，关闭，包括写进右键事件，大概可实现功能如下：

（前期版本!）

0.新手操作帮助小提示，增强用户体验

1.窗体的拖动，最大化，最小化，双击顶部最大化，最小化；最小化任务栏时可重新恢复大小，在任务栏时可横行拖动；

2.窗体内图标可重新排列，包括任务栏下面的小图标也可重新排列；

3.可手动切换背景颜色，右下角用jQ实现了实时时钟；

4.右键可触发新建桌面小图标（图标无效果）和重新刷新页面；

5.双击音乐欣赏和视频欣赏看欣赏相应媒体，可右键缩小至任务栏并且恢复大小，可右键关闭；

6.本地测试（音频与视频均由html5标签实现，服务器不提供视频音频播放，所以显示不出来）可对视频和音频进行界面大小控制；

7.按F8可触发相应事件（下次接着改进吧）；

关于优化：足量的html,css,js的注释，js，css全部进行模块化处理以提高重用率，便于后期维护，所有图片均做过处理优化，除音频视频作业文件外整个网站大小（html，js，css，图片文件）控制在2.2M左右，注重用户体验；

发表于 2012-11-30 14:40 叫我麟麟阅读(237) 评论(0) 收藏举报

公告