JGUI源码:从头开始,建一个自己的UI框架(1)

开篇

1、JGUI是为了逼迫自己研究底层点的前端技术而做的框架,之前对web底层实现一直没有深入研究,有了技术瓶颈,痛定思痛从头研究,

2、虽然现在vue技术比较火,但还在发展阶段,暂时先使用JQuery实现,以后有时间会再做一套vue版本的。有好的建议欢迎大家留言。

3、自己在开发过程中遇到的问题和心得将会写到博客上,在实现过程中由简单到复杂实现,一些功能前期只考虑功能实现,后期再进行优化。

4、本框架是一个学习型的框架,功能都尽量自己手工敲代码实现,虽然有点造轮子,但是对深入理解Jquery有帮助,本框架基本不集成第三方组件,除了一些浏览器兼容库。

5、界面部分多少会受自己使用过的UI库的风格影响,雷同之处望大家海涵,欢迎从头和想深入学习Jquery的一起加入。

6、框架尽量兼容IE,目前一般是在兼容IE8下调试,不能完全模拟真正IE8。

github地址:
https://github.com/zhaogaojian/JGUI

demo地址:
http://www.jgui.com

项目结构如下

每个组件css,jss都是分离的,可以单独拿来使用,废话不多说,下面开始进行

代码会实时更新重构到github上,最新的可能与博客撰写时不太一致,可以看博客编写时间找对应的历史代码。

目录如下

JGUI源码:实现简单进度条显示(19)

JGUI源码:实现mask层显示(18)

JGUI源码:实现日期控件显示(17)

JGUI源码:实现图标按钮及下拉菜单(16)

JGUI源码:实现MVVM简单单项绑定(15)

JGUI源码:Tip实现(14)

JGUI源码:实现响应式布局(13)

JGUI源码:右键菜单实现(12)

JGUI源码:开发中遇到的问题(持续更新。。)(11)

JGUI源码:prefixfree 这个库有时候会引起网页一直加载中(10)

JGUI源码:Tab组件实现(9)

JGUI源码:JS菜单动态绑定(8)

JGUI源码:组件及函数封装方法(7)

JGUI源码:Accordion折叠到侧边栏实现(6)

JGUI源码:鼠标中键滚动再次优化(5)

JGUI源码:解决手机端点击出现半透明阴影(4)

JGUI源码:Accordion兼容IE8实现(3)

JGUI源码:Accordion鼠标中键滚动和手机端滑动实现(2)

JGUI源码:从头开始,建一个学习UI框架(1)



 
原文地址:https://www.cnblogs.com/zhaogaojian/p/10421543.html