jquery插件分割屏幕实现页面分屏切换模板特效

闲来无事，搞了个页面的分屏效果，先来看下效果：

出于可自定义宽高的目的，屏幕分块由半铸钢钢性铸铁(铸造半钢)控制，由射流研究…控制估计等分模块效果一般。

程序相关说明：

超文本标记语言结构：

div class=' header ' header/div class=' container ' id=' display area '！-分屏内容渲染区域- /divdiv class='footer '！-省略其他代码- /divjs调用：

//分屏数据var iframes=[ { id:'frames_1 '，frameName: '百度一下，src:'http://www.baidu.com' }，{ id:'frames_1 '，frameName: '百度地图，src:'http://map.baidu.com' }，{ id:'frames_1 '，frameName: '百度下，src:'http://www.baidu.com' }，{ id:'frames_1 '，frameName: '百度视频，src:'http://v.baidu.com' }，{ id:'frames_1 '，frameName: '百度新闻2 '，src:'http://news.baidu.com' }，{ id:'frames_1 '，frameName:'test6 '，src:'6.html' }，{ id:'frames_1 '，frameName: '百度新闻，src:'http://news.baidu.com' }，{ id:'frames_1 '，frameName:'88888 '，src:'6.html' }，{ id:'frames_1 '，frameName: '百度更多，src : ' http://www。百度。com/more/' }]；//自适应屏幕窗户。onload=function(){ panel。resize()；}窗口。onresize=function(){ panel。resize()；} //初始化分屏var splitScreen=new splitScreen($(' #显示区域')，iframes)；//监听移除设置自定义事件分割屏幕._on('removeSettingCls '，function(){ splitscreen。toggletopbar(function(){ $(')).ulTab li[data-fp='setting']').移除类(' CurrentLi ')；});});//分屏切换功能变化模型(obj){ var FP model=$(obj).attr(' data-FP ')；if(fpmodel