Autocomplete 下拉框加滚动条

引用：http://www.jqueryui.org.cn/demo/5669.html
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
    <title>Untitled Page</title>  
    <script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>  
    <script src="http://libs.baidu.com/jqueryui/1.8.24/jquery-ui.min.js"></script>  <style>  
      .ui-helper-hidden-accessible {display:none;}  
.ui-autocomplete { position: absolute; cursor: default; border-radius: 3px; border: 1px solid #c0c0c0; }    
.ui-menu {list-style: none;padding: 0;margin: 0;display: block;outline: none;}  
.ui-menu .ui-menu-item a {text-decoration:none;display:block;padding:.2em .4em;line-height:1.5;zoom:1;}  
  
 .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {background: #ff8a00;border: none;color:#000;border-radius:0;font-weight: normal;}  
    
.ui-autocomplete {
		max-width: 160px;
	    max-height: 100px;
	    overflow-y: auto;
	    overflow-x: hidden;
  	}
	  /* IE 6 ��֧�� max-height
	   * ����ʹ�� height ���棬�������ǿ�Ʋ˵�������ʾΪ�Ǹ��߶�
	   */
	  * html .ui-autocomplete {
	    height: 100px;
	  }
</style>  
    
  
    <script type="text/javascript">  
        $(document).ready(function() {  
             var availableTags = [  
      "ActionScript",  
      "AppleScript",  
      "Asp",  
      "BASIC",  
      "C",  
      "C++",  
      "Clojure",  
      "COBOL",  
      "ColdFusion",  
      "Erlang",  
      "Fortran",  
      "Groovy",  
      "Haskell",  
      "Java",  
      "JavaScript",  
      "Lisp",  
      "Perl",  
      "PHP",  
      "Python",  
      "Ruby",  
      "Scala",  
      "Scheme"  
    ];  
            $("#autocomplete").autocomplete({  
                source: availableTags,  
                minLength : 0 
            }).focus(function () {
  	            $(this).autocomplete("search");
  	        }); 
        });  
    </script>  
  
</head>  
<body>  
    <form id="form1">  
    <div>  
        <input id="autocomplete"  />  
    </div>  
    </form>  
</body>  
</html>
Autocomplete 下拉框加滚动条

猜你喜欢
