添加一个以前写的table的spliter给大家- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 添加一个以前写的table的spliter给大家

Javascript: 阻止JavaScript事件冒泡传递（cancelBubble 、stopPropagation）; (转载)JavaScript中匿名函数，函数直接量和闭包; 简单的无缝滚动程序-仅几行代码; Javascript中的数学函数集合; javascript之大字符串的连接的StringBuffer 类; javascript之对系统的toFixed()方法的修正; 用javascript实现自定义标签; js在客户端验证密码强度，兼容FireFox和IE; javascript背景颜色按时变换; 脚本分析、压缩、混淆工具 JSA新版本发布，压缩效率提高大约10％; javascript语句中的CDATA标签的意义; 用javascript实现分割提取页面所需内容; 网上抓的一个特效; js之点击超连接,提示一个层.点击空白.层消失; 模拟用户操作Input元素，不会触发相应事件; 弹出广告特效代码(一个IP只弹出一次); (仅IE下有效)关于checkbox 三态; JavaScript Archive Network 集合; 关于__defineGetter__ 和__defineSetter__的说明; textContent在Firefox下与innerText等效的属性

No. « ‹ 66 67 68 69 › »

技术文章搜索

关键字

Javascript 中的添加一个以前写的table的spliter给大家

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-10 浏览: 405 ::

收藏到网摘: n/a

在修改准备发的批量美化select+可修改select时，在非IE下发现了几个问题鼠标滚轮编程

点击运行可以看到效果:

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title> neverSpliter - http://www.never-online.net </title> <meta http-equiv="ImageToolbar" content="no" /> <meta name="author" content="never-online, BlueDestiny"/> <meta name="keywords" content="never modules, Mozilla CSS, C#, .net, Reference, BlueDestiny, never-online"/> <meta name="description" content="javascript reference, c sharp artilces"/> <meta name="creator.name" content="never-online, BlueDestiny" /> <style type="text/css" media="all" title="Default"> body, td { font:9pt "Verdana"; } table { border:4px solid buttonface; } .innerSpliter { width:4px; height:100%; border:1px outset buttonhighlight; background-color:buttonface; overflow:hidden; cursor:col-resize; } .spliterLine { display:none; top:0px; left:100px; position:absolute; border:2px outset button; } </style> <script type="text/javascript"> //<![CDATA[ function getElementOffset(e) { var t = e.offsetTop; var l = e.offsetLeft; var w = e.offsetWidth; var h = e.offsetHeight-1; while(e=e.offsetParent) { t+=e.offsetTop; l+=e.offsetLeft; } return { top : t, left : l, width : w, height : h } } window.onload = function() { window.lftWrapper = document.getElementById("leftWrapper"); window.rgtWrapper = document.getElementById("rightWrapper"); window.splitObj = document.getElementById("splitLine"); window.bIsMoved = false; document.getElementById("spliter").onmousedown = handlerDown; document.onmousemove = handlerMove; document.onmouseup = handlerUp; } function handlerDown() { var elposition = getElementOffset(document.getElementById("spliter")); splitObj.evtX = event.clientX-elposition.left; with (splitObj.style) { display = "block"; left = elposition.left; cursor = "col-resize"; filter = "alpha(opacity=30)"; height = elposition.height; top = elposition.top; } bIsMoved = true; } function handlerMove() { if (!bIsMoved) return; splitObj.setCapture(); with (splitObj.style) { left = event.clientX - splitObj.evtX; cursor = "col-resize"; } } function handlerUp() { if (!bIsMoved) return; lftWrapper.style.width = event.clientX - splitObj.evtX; bIsMoved=false; splitObj.releaseCapture(); splitObj.style.display = "none"; } //]]> </script> </head> <body id="www.never-online.net"> <div id="splitLine" class="spliterLine"></div> <table cellspacing="0" cellpadding="0" border="0" id="mainWrapper" width="100%" height="500"> <tr> <td width="20%" id="leftWrapper" class="borderTop" valign="top"> I am never-online </td> <td id="spliter" title="drag this line to control leftframe width" width="5" style="overflow:hidden"> <div class="innerSpliter"></div> </td> <td id="rightWrapper" class="borderTop" valign="top"> or BlueDestiny, click here to my <a href="http://blog.never-online.net">blog</a> </td> </tr> </table> <p align="center"> Power By never-online </body>
</html>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

在修改准备发的批量美化select+可修改select时，在非IE下发现了几个问题鼠标滚轮编程

Javascript 中的 添加一个以前写的table的spliter给大家

评论 (0) All

Javascript 中的添加一个以前写的table的spliter给大家