自定义的联动下拉框

一直都嫌下拉框这个html控件难看，之前弄了个<div><ul><li></li></ul></div>版的下拉框

觉得这个下拉框已经稍微能满足美观需求了，

 

这个是点出来的效果，写了键盘的方向键，回车，esc等 事件， 并且能根据页面的底部距离判断是否向上展示

今天弄了个联动的，顺便贴部分代码

效果预览：

 

 以下代码解决了ie6的兼容问题

 $containerDivText.mousedown(function() {
            setTimeout(
        function() {
            if ($newUl[0].style.display == 'block') {
                $newUl.hide();
                positionHideFix();
                return false;
            }

            $containerDiv.focus();

            //show list
            $newUl.slideDown(100);
            positionFix();

            //when keys are pressed
            document.onkeydown = function(e) {
                if (e == null) { // ie
                    var keycode = event.keyCode;
                } else { // everything else
                    var keycode = e.which;
                }
                //enter key or esc key pressed, hide list
                if (keycode == 13 || keycode == 27) {
                    $newUl.hide();
                    positionHideFix();
                    return false;
                }
            }
        }, 1);
        //the function settimeout is used for ie6, because if you click the element where you hava focused on the element, 
        //ie6 would think you click it twice(2010-2-4)
        });