网页布局三之Jquery EasyUI TreeMenu实战

本文出自http://www.kwstu.com/ArticleView/kwstu_20139413501290,大神作品,只有学习与尊敬。

私人做程序开发一直有个头疼的问题就是后台管理界面,以前一般都是自己用jquery+ps自己设计的,效果很一般,很不理想。

今天初次使用Jquery EasyUi,简单的做了个布局页面感觉还不错,给大家分享一下,就是不知道Jquery EasyUi浏览器兼容性怎么样。

最后效果图如下:

使用Jquery EasyUi开发之前首先要引用Jquery EasyUi的Js和Css文件,引用如下:



 

 

 
OK,下面就开始我们的布局。


一、使用布局面板进行整体布局,直接贴代码:




    LayOut
    
    
    
    
     
    


    

 
  

以上代码效果如下(完成局部第一步):

二、添加左侧菜单

左侧菜单使用的是jquery easyui的可伸缩面板控件和树形控件的结合,直接将可伸缩面板控件和树形控件放到west域中即可,并且编写点击事件,代码如下:

页面代码:


content2
content3


Js点击事件代码:


                    
                    

你可能感兴趣的:(网页布局三之Jquery EasyUI TreeMenu实战)