清华大佬耗费三个月吐血整理的几百G的资源,免费分享!....>>>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | < style > .zselect{width:500px;height:50px;line-height:50px;border:1px solid #ccc;position: relative;} .zselect ul{width:100%;list-style: none;margin: 0px;padding: 0px;position: absolute;z-index: 999;border: 1px solid #ccc;background: #fff;} .zselect ul li{width:100%;height:50px;line-height:50px;text-align:center;margin: 2px 0px;background: #CCC; display: none; cursor: pointer;} .zselect ul li:hover{background: #666;} .zselect ul li.on{display: block; } </ style > < div class = "zselect" > < ul > < li class = "on" >请选择</ li > < li >选项一</ li > < li >选项二</ li > < li >选项三</ li > < li >选项四</ li > < li >选项五</ li > </ ul > </ div > < script > var lis = document.getElementsByClassName('zselect')[0].getElementsByTagName('li'); for(var i = 0; i < lis.length ; i++){ lis[i] .onclick = function (){ if(this.parentNode.getAttribute('_zxs') == 'show'){ //for(var j = 0 ; j < lis.length; j++){ lis[j] .className = '' ;} for(var j = 0 ; j < lis.length; j++){ lis[j] .style.display = 'none' ;} this.className = 'on' ; this.style.display = 'block' ; this.parentNode.setAttribute('_zxs','hide'); }else{ //for(var j = 0 ; j < lis.length; j++){ lis[j] .className = 'on' ;} for(var j = 0 ; j < lis.length; j++){ lis[j] .style.display = 'block' ;} this.parentNode.setAttribute('_zxs','show'); } }; } </script> |