加入收藏 | 设为首页 | 会员中心 | 我要投稿 源码门户网 (https://www.92codes.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 站长资讯 > 传媒 > 正文

使用jQuery在网页中实现分隔线的功能

发布时间:2018-08-26 03:06:18 所属栏目:传媒 来源:站长网
导读:副标题#e# 在C/S系统中有专门的分隔条控件,很方便实现,但在Asp.net中却没有。本文介绍了一种使用JQuery技术实现分隔条的功能。 Java script代码如下,将该代码保存成JS文件后在HTML中引用。 Copy to Clipboard 引用的内容:[www.veryhuo.com]jsplit jQuer

 按以下步骤修改HTML文件:
1. 增加对JQuery和刚刚生成的jsplit.js文件的引用。 

Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com] <script language='javascript' src='jquery-1.4.4.min.js'></script>
<script language='javascript' src='jsplit.js'></script>

2. 为要被拖动大小的DIV或TD定义ID。 

Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com] <table>
<tr>
<td id="tt" style="background:#999999">test</td>
<td style="background:#009999" width="400">test Table</td>
</tr>
</table>

3. 增加Javascript调用Split。

Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com] <script type="text/javascript">
$(document).ready(function(){
jQuery('#tt').jsplit();
});
</script>

这样就实现了客户端的分隔条的功能,如下图所示:

使用jQuery在网页中实现分隔线的功能

(编辑:源码门户网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读