jsplith.css({ background: j.Btn.cBg.Out, “background-image”: j.BgUrl })
_selfclose();
} else {
jsplith.css({ background: j.Btn.oBg.Out, “background-image”: j.BgUrl })
}
jsplith.hover(function () {
if (Close == false) {
jQuery(this).css({ background: j.Btn.oBg.Hover, “background-image”: j.BgUrl })
} else { jQuery(this).css({ background: j.Btn.cBg.Hover, “background-image”: j.BgUrl }) }
}, function () {
if (Close == false) {
jQuery(this).css({ background: j.Btn.oBg.Out, “background-image”: j.BgUrl })
} else { jQuery(this).css({ background: j.Btn.cBg.Out, “background-image”: j.BgUrl }) }
})
jQuery(_self).hover(function () { if (Close == false) jsplite.stop().animate({ opacity: 0.85 }, 200) }, function () { if (Close == false) jsplite.stop().animate({ opacity: 0 }, 2000) })
jsplite.mousedown(function (e) {
j[‘Fn’] && j[‘Fn’].call(_self);
var screenX = e.screenX, w = jQuery(_self).width();
jQuery(document).mousemove(function (e2) {
curW = j.FloatD == “left” ? w + (e2.screenX – screenX) : w – (e2.screenX – screenX);
if (curW >= j.MaxW) { curW = j.MaxW; };
if (curW <= j.MinW) { curW = j.MinW; };
jQuery(_self).css({ width: curW });
dw = curW;
});
jQuery(document).mouseup(function () {
jQuery(document).unbind();
});
if (Close == true) {
jQuery(this).css({ cursor: “e-resize”, opacity: 0.8 });
jQuery(_self).animate({ width: dw }, 200);
Close = false;
};
return false;
});
jsplite.dblclick(function () {
if (Close == false) {
_selfclose();
};
return false;
});
jsplith.click(function () {
if (Close == false) {
_selfclose();
};
return false;
});
function _selfclose() {
jsplite.css({ cursor: “pointer”, opacity: 1 });
jsplith.css({ background: j.Btn.cBg.Out, “background-image”: j.BgUrl });
jQuery(_self).animate({ width: “6px” }, 400);
Close = true;
}
});
}
});
按以下步骤修改HTML文件：
1. 增加对JQuery和刚刚生成的jsplit.js文件的引用。
<script language=’javascript’ src=’jquery-1.4.4.min.js’></script>
<script language=’javascript’ src=’jsplit.js’></script>
2. 为要被拖动大小的DIV或TD定义ID。
<table>
<tr>
<td id=”tt” style=”background:#999999″>test</td>
<td style=”background:#009999″ width=”400″>test Table</td>
</tr>
</table>
3. 增加Javascript调用Split。
<script type=”text/javascript”>
$(document).ready(function(){
jQuery(‘#tt’).jsplit();
});
</script>
这样就实现了客户端的分隔条的功能，如下图所示：
