模板无忧
网页特效
每日更新
|
TOP排行榜
|
Tag标签
|
充值
无忧首页
网页模板
程序模板
建站教程
视频教程
网页特效
图标素材
字体下载
站长工具
站长问答
网页特效
菜单导航
图片特效
文本链接
层和布局
页面背景
表单按钮
日期时间
计算转换
键盘鼠标
浏览器
游戏娱乐
综合其它
常用代码
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在线编辑器
Mootools
HTML
JS广告代码合集
站长工具
站长常用软件
网站综合查询
Alexa排名查询
Google PR查询
域名Whois查询
网站收录查询
友情链接查询
CSS2中文手册
CSS精简优化工具
网页特效代码
模板无忧
>
网页特效
>
表单按钮特效代码
>
收藏
分享
查看评论
表单按钮
演示
鼠标框选多选框_表单按钮特效
查看演示效果
特效Tag：
暂无Tag,欢迎
添加
,赚取U币!
鼠标框选多选框,您可以先修改部分代码再运行.
<html> <head> <SCRIPT language=JavaScript> /*-------------------------------------------- 本程式为鼠标框选 多选框 辅助 帮手,其中还有不足. 1. 不能将多选框单独放到body标签中. 2. 多选框使用名子为ck+自然数, 如ck1. 3. 就先这么多吧,可能还有........... 制作者:八神奄 QQ:13730452 --------------------------------------------*/ var x0; var y0; var selectenable=0; function initChkBox(obj){ var coll=document.forms["form1"].tags("input"); for (i=0;i<coll.length;i++){ if (coll.item(i).name.substr(0,2)=="ck") { var offsetTop = 0; var offsetLeft = 0; var objP = coll.item(i); while (objP.tagName!="BODY"&&objP){ offsetTop += objP.offsetTop; offsetLeft += objP.offsetLeft; objP = objP.offsetParent; } coll.item(i).X=offsetLeft+10; coll.item(i).Y=offsetTop+10; //alert(coll.item(i).X+","+coll.item(i).Y+","+coll.item(i).offsetHeight); } } } function initselect() { if (window.event.srcElement.tagName=="BODY") { window.event.returnValue = true; return; } x0=document.body.scrollLeft+event.clientX; y0=document.body.scrollTop+event.clientY; selectarea.setCapture(); selectenable=1; } function startselect() { if (selectenable==1) { selectarea.style.visibility='visible'; if(document.body.scrollLeft+event.clientX-x0>0) { selectarea.style.left=x0; selectarea.style.width=document.body.scrollLeft+event.clientX-x0; } else{ selectarea.style.left=document.body.scrollLeft+event.clientX; selectarea.style.width=x0-(document.body.scrollLeft+event.clientX); } if (document.body.scrollTop+event.clientY-y0>0) { selectarea.style.top=y0; selectarea.style.height=document.body.scrollTop+event.clientY-y0; } else{ selectarea.style.top=document.body.scrollTop+event.clientY; selectarea.style.height=y0-(document.body.scrollTop+event.clientY); } } window.event.returnValue = true; } function endselect() { if (selectenable==0) return false; selectenable=0; selectarea.style.visibility='hidden'; selectarea.releaseCapture(); document.onmousemove=http://p1.mb5u.com/texiao/16/20100523005003120; var coll=document.forms["form1"].tags("input"); for (i=0;i<coll.length;i++){ if (coll.item(i).name.substr(0,2)=="ck") { /* if (((coll.item(i).X>selectarea.offsetLeft)&&(coll.item(i).X<selectarea.offsetLeft+selectarea.offsetWidth))&&((coll.item(i).Y>selectarea.offsetTop)&&(coll.item(i).Y<selectarea.offsetTop+selectarea.offsetHeight))){ coll.item(i).checked=!coll.item(i).checked;} */ if (coll.item(i).X>selectarea.offsetLeft) if (coll.item(i).X<selectarea.offsetLeft+selectarea.offsetWidth) if (coll.item(i).Y>selectarea.offsetTop) if (coll.item(i).Y<selectarea.offsetTop+selectarea.offsetHeight) coll.item(i).checked=!coll.item(i).checked } } selectarea.style.pixelHeight=0; selectarea.style.pixelWidth=0; } /*function hideselect() { //if (document.body.scrollLeft+event.clientX==x0 && document.body.scrollTop+event.clientY==y0 && event.srcElement!=selectarea) selectarea.style.visibility='hidden'; }*/ function checkAll(){ document.form1.allsel.checked=false; var coll=document.forms["form1"].tags("input"); for (i=0;i<coll.length;i++){ if (coll.item(i).name.substr(0,2)=="ck") { coll.item(i).checked=false; } } } function change(v){ var f = document.forms["form1"]; for (i=0;i<f.elements.length;i++) if (f.elements[i].name.substr(0,2)=="ck") f.elements[i].checked = v; } </SCRIPT> <script language="JavaScript" type="text/JavaScript"> <!-- function MM_reloadPage(init) { //reloads the window if Nav4 resized if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) { document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }} else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload(); } MM_reloadPage(true); //--> </script> <title>您想要的－www.51windows.Net</title> </head> <body onmousedown="initselect()" onmousemove=startselect() onmouseup=endselect() onselectstart="return false;" onLoad=initChkBox()> <table width="100%" height="100%" cellpadding="0" cellspacing="0" bgcolor="efefef"> <tr><td> <DIV id=selectarea style="border:1px dashed black;HEIGHT: 42px; LEFT: 0px; POSITION: absolute; TOP: 0px; VISIBILITY: hidden; WIDTH: 67px; Z-INDEX: 10"> <img src="http://p1.mb5u.com/texiao/16/20100523005003120" height="1" width="1"> </DIV> <div id="Layer1" style="position:absolute; left:256px; top:39px; width:203px; height:401px; z-index:1"> <form name="form1" action=""> <table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#339999"> <tr bgcolor="#FFFFFF"> <td width="13%"><input type="checkbox" name="ck1" value="checkbox"></td> <td width="87%"> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck2" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck3" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck4" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck5" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck6" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck7" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck8" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck9" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck10" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck11" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck12" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck13" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck14" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck15" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck16" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck17" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck18" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck19" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck20" value="checkbox"></td> <td> </td> </tr> <tr bgcolor="#FFFFFF"> <td><input type="checkbox" name="ck21" value="checkbox"></td> <td> </td> </tr> </table> <input type="checkbox" name="allsel" value="checkbox" onclick="change(this.checked)"> <button onClick="checkAll()">清空</button> </form> </div> </td></tr> </table> </body> </html>
所属频道：
表单按钮特效
/
更新时间：2012-11-21
[收藏]
[报错]
[返回列表]
相关
表单按钮特效
：
又一个带描述的表单
可自由移动位置的导航条
页面转跳。跟本站的教学文章中的那些转到第几页一样的
带Checkbox的列表框
提供四种打开新窗的形式
自动复制代码
方便登录各种管理页面以及任何EMAIL量身定做！
QQ分类搜索代码
查找表格的内容
一个带描述的表单
常用email检验函数
file框模拟新解
表单按钮特效Rss订阅
特效代码搜索
表单按钮特效推荐
radio值
仿XP界面的CSS按钮特效代码
JavaScript实现仿163邮箱删除/添加附件的功能
在规定时间内方有效的按钮
js判断复选框是否选中及选中个数
Javascript删除数据时的确认对话框
JavaScript常规性表单判断实例
用JS判断是否允许输入数字及一些特殊字符
在Input输入框中加入小图标背景
按回车提交的代码
猜你也喜欢看这些
农历挂历
猜你的属相
让你选择自己需要的日历
日期选择菜单
很酷的时钟 (跟随鼠标飘动的双层时钟!)
网页上的日期台历
显示特殊节日脚本(做一个朋友生日记事可最好不过)
计算圆周率
停止查看 Script
状态栏显示时间——数字钟
相关链接：
复制本页链接
|
搜索鼠标框选多选框
特效说明：
表单按钮模板
-
鼠标框选多选框
。
。