网站地图
首页
php教程
asp.net教程
手机开发
css教程
网页制作
办公数码
jsp教程
asp教程
ps教程
当前位置:
编程学习网
>>
网页制作
>
js教程
> >
[json]js 控制完美select下拉选框代码
[json]js 控制完美select下拉选框代码
发布时间:2018-03-25
【www.gdgbn.com--js教程】
提示:您可以先修改部分代码再运行
用javascript美化Select
<script type="text/javascript"> // JavaScript Document function $() { return document.getElementById(arguments[0]); } //取得外部class的属性值 function getCurrentStyle(o) { return o.currentStyle||document.defaultView.getComputedStyle(o,null); } var SetAllSelects = { Offset:function(e) { var t = e.offsetTop; var l = e.offsetLeft; var w = e.offsetWidth; var h = e.offsetHeight; while(e = e.offsetParent) { t += e.offsetTop; l += e.offsetLeft; } return {top:t, left:l, width:w, height:h}; }, setCreated:function(obj,status) { //设置属性 obj.setAttribute("childCreated",status); }, getCreated:function(obj) { //获取属性 var status = obj.getAttribute("childCreated"); if(status == null) { status = ""; } return status; }, setSelectStyle:function(obj,idnum,showHeight) { if(obj.id == null || obj.id == "") { obj.id = "selectID_"+idnum; } var offset = this.Offset(obj); obj.style.visibility = "hidden"; var mainDiv = document.createElement("div"); var iDiv = document.createElement("div"); var js_select_; var _this = this; iDiv.className = "iDiv"; iDiv.id = js_select_+obj.id; iDiv.style.width = offset.width + "px"; iDiv.style.top = offset.top + "px"; iDiv.style.left = offset.left + "px"; this.setCreated(iDiv,""); mainDiv.appendChild(iDiv); var tValue = obj.options[obj.selectedIndex].innerHTML; iDiv.innerHTML = tValue; iDiv.onmouseover = function() { iDiv.className = "iDiv iDiv_over"; } iDiv.onmouseout = function() { iDiv.className = "iDiv iDiv_out"; } iDiv.onclick = function() { var created = _this.getCreated(this); if (created != "") { if (created == "open") { this.nextSib
ling
.style.display = "none"; _this.setCreated(this,"close"); } else { _this.setCreated(this,"open"); var arrLiObj = this.nextSib
ling
.getElementsByTagName("li"); var selOjbIndex = 0; for(var i=0;ishowHeight) { cDiv.style.height = showHeight + "px"; } cDiv.style.top = (offset.top+parseInt(getCurrentStyle(this).height)+1) + "px"; cDiv.style.left = offset.left + "px"; cDiv.onselectstart = function() {return false;}; var uUl = document.createElement("ul"); cDiv.appendChild(uUl); mainDiv.appendChild(cDiv); for (var i=0;i
0) { for (var j=0;j
选择
选择3_22_22_22_2
选择3_22_22_22_3
选择3_22_22_22_4
选择3_22_22_22_5
选择3_22_22_22_6
选择3_22_22_22_7
选择3_22_22_22_8
选择3_22_22_22_9
选择3_22_22_22_10
选择3_22_22_22_11
选择3_22_22_22_12
选择3_22_22_22_13
选择3_22_22_22_14
选择3_22_22_22_15
选择3_22_22_22_16
提示:您可以先修改部分代码再运行
本文来源:
http://www.gdgbn.com/wangyezhizuo/22205/
上一篇:
超简单夹娃娃机制作|超简单js可拖动层代码
下一篇:
json|js 日期选择框代码
相关推荐
超简单夹娃娃机制作|超简单js可拖动层代码
【asp.net】asp 将中文自动转换成拼音
[自主可控]可控图片左右滚动代码
互联网的最大特点|互联网40年最大变革 中文域名备受关注
js文字无缝滚动_js文字无间向上滚效果代码
asp.net|asp 生成验证码程序代码
javascript学习指南|JavaScript图片放大效果代码
[asp.net]asp 生成图片缩略图代码
网页背景图片_随便给网页背景换背景图片
json_js 调用多input文本输入框代码
网友关注
【javascript学习指南】javascript 纯js图片广告轮换效果
seo优化_seo优化教程:如何优化内部链接?
[css div 居中]css+div 3行3列图片自动排列代码
[css教程]css+javascript 弹出层代码
【css div 居中】css+div 下拉菜单代码
【qq聊天弹出图片怎么关】QQ客服弹出聊天代码
【javascript学习指南】Java与JavaScript的区别分析
js网页加载进度条代码|js网页加载进度条代码
javascript学习指南_JAVA文件操作常用函数
【javascript学习指南】javascript 蛇小游戏代码
热门标签
json格式化
json在线格式化
js格式化
js刷新当前页面
jsp
js保留两位小数
最新js教程
js教程
js遍历对象_js中查找对象代码
js教程
javascript学习指南_java 自动装箱拆箱实现方法
js教程
eclipse连接mysql数据库_java连接db2数据代码
js教程
flash player|flash js Fusioncharts 参数详解与参考
js教程
json_js ajax XMLHttpRequest与jq $.ajax
js教程
【js利用cookie】js利用cookies与正则设置字体高亮显示
js教程
asp.net core_asp.net DataGridTree 下拉树 实现方法
js教程
[jsp注册页面代码]JSP页面编码问题分析
js教程
[hibernate和mybatis的区别]Hibernate 中get()和load()与Hibernate简介
js教程
判断textarea中是否有回车符|判断textarea中是否有回车符方法
js教程热门文章
js教程
json|js 日期选择框代码
js教程
【json】js可控下拉弹出层代码
js教程
json_js 调色板工具代码
js教程
js图片批量加载图片_js图片批量加载效果代码
js教程
【json】js title及alt提示个性化提示特效
js教程
[带关闭按钮js弹出对话框]带关闭按钮js弹出层代码
js教程
[select 默认选中]select multi 选择框操作类
js教程
json_js 倒计时变速加数效果代码
js教程
【json】js 缓冲效果代码
js教程
[json]js mouseover和mouseout实例
声明:本网站尊重并保护知识产权,根据《信息网络传播权保护条例》,如果我们转载的作品侵犯了您的权利,请在一个月内通知我们,我们会及时删除。
Copyright©2006-2019 编程学习网 www.gdgbn.com 版权所有