为自己的JS库 moogens 增加 简易矩形 组件 -
看了 http://www.iteye.com/topic/610962 好东西啊 把它写成自己的吧.... 今天先做个基本版 明天回家优化...先看图效果 :
http://dl.iteye.com/upload/attachment/415307/b2c3841d-f1f0-3292-8721-7af47632cc41.jpg
http://dl.iteye.com/upload/attachment/415309/785ea8bd-dbe1-378b-b984-f4eed4dcdbe0.jpg
http://dl.iteye.com/upload/attachment/415311/b1e22f75-e717-39e6-afd8-59a378d428f2.jpg
http://dl.iteye.com/upload/attachment/415313/f609a2ed-a6ad-3988-a881-731037e1552e.jpg
谢谢 cjx186 的好东西啊....
代码如下:
(function(){var d={height:"1px","font-size":"1px",overflow:"hidden",display:"block",background:"#B2D0EA",margin:"0 3px",clear:"both"};var c={height:"1px","font-size":"1px",overflow:"hidden",display:"block",background:"#EDF7FF",margin:"0 1px",clear:"both","border-right":"2px solid #B2D0EA","border-left":"2px solid #B2D0EA"};var a={height:"1px","font-size":"1px",overflow:"hidden",display:"block",background:"#EDF7FF",margin:"0 1px",clear:"both","border-right":"1px solid #B2D0EA","border-left":"1px solid #B2D0EA"};var e={"font-size":"12px",overflow:"hidden",display:"block",background:"#EDF7FF",margin:"0 0px",clear:"both","border-right":"1px solid #B2D0EA","border-left":"1px solid #B2D0EA"};var b={background:"#EDF7FF",margin:"0 2px",padding:"5px"};var f={background:"#FFFFFF",margin:"0 2px",padding:"5px"};Moogens.UI.RoundRect=function(){var g=$C("div");g.className="roundrect";var m=new Moogens.Dom.Node($C("b"));g.appendChild(m.css(d).getElement());var k=new Moogens.Dom.Node($C("b"));g.appendChild(k.css(c).getElement());var i=new Moogens.Dom.Node($C("b"));g.appendChild(i.css(a).getElement());var l=$C("div");var n=new Moogens.Dom.Node(l);n.css(e).html("<div class='bt'></div><div class='bb'></div>");var h=new Moogens.Dom.Node(Moogens.Dom.get("div.bt",l));h.css(b);var j=new Moogens.Dom.Node(Moogens.Dom.get("div.bb",l));j.css(f);g.appendChild(n.getElement());var o=new Moogens.Dom.Node($C("b"));g.appendChild(o.css(a).getElement());var p=new Moogens.Dom.Node($C("b"));g.appendChild(p.css(c).getElement());var q=new Moogens.Dom.Node($C("b"));g.appendChild(q.css(d).getElement());this.getHeader=function(){return h};this.getBody=function(){return j};this.get=function(){return g}}})();
压缩后 只有 1.5k 不压缩 就80行....
========================================================================
修订版本:
var rect1 = new Moogens.UI.RoundRect({container: '#roundrects',title: "后台管理 -- 猪猪阵营(我的小屋)",content: $ID('header').innerHTML,});var rect2 = new Moogens.UI.RoundRect({container: '#roundrects',title: "后台管理 -- 猪猪阵营(我的小屋)",style: {} ,width: '400px',content: $ID('header').innerHTML,});var rect3 = new Moogens.UI.RoundRect({container: '#roundrects',title: "后台管理 -- 猪猪阵营(我的小屋)",width: '400px',content: $ID('header').innerHTML,});rect3.customStyle({bar: '#efc',border:'#636'});
http://dl.iteye.com/upload/attachment/415928/eb7f457b-4611-39d1-99cb-818104c636f2.jpg
代码 修改后如下:
<div class="quote_title">rect.js 写道
页:
[1]