亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

幫忙看看代碼,出不來下拉框,調試不好,謝謝

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="X-UA-Compatible" content="IE=edge" /><!--解決瀏覽器兼容-->

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

????<title>bing search</title>

????<style type="text/css">

body{

background-color:#333;

}

.bg{

position:relative;

background-image:url(http://localhost:23688/river.jpg);

width:1228px;

height:690px;

margin:0 auto;

}

.search-form{

float: left;

background-color: #fff;

padding:5px;

}

.search-button{

background-image:url(http://localhost:23688/search-button.png);

width:29px;

height:29px;

float:left;

border:0;

}

.search-text{

width:350px;

height:25px;

line-height:25px;

border:0;

float:left;

outline:none;/*無邊框*/

}

.search-box{

position:absolute;

top:150px;

left:200px;

}

.logo{

background-image:url(http://localhost:23688/logo.png);

width:107px;

height:53px;

float:left;

margin:-4px 18px 0 0;

}

.suggest{

width:388px;

background-color:#fff;

border:1px solid #999;

}

.suggest ul{

list-style:none;

margin:0;

padding:0;

}

.suggest ul li{

padding:3px;

font-size:14px;

line-height:25px;

cursor:pointer;/*光標變為手*/

}

/*鼠標滑過*/

.suggest ul li:hover{

text-decoration:underline;

background-color:#e5e5e5;

}

????</style>

????<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>

????<script type="text/javascript">

???? $('#search_input').bind('keyup', function () {

????$('#search-suggest').show().css({

?top: $('#search-form').offset().top+$('#search-form').height,

?left: $('#search-form').offset().left,position:'absolute'

});//智能提示框

})

????</script>

????

</head>

<body>

????<div class="bg">

????????<div class="search-box">

????????????<div class="logo"></div>

????????????<form class="search-form" action="https://cn.bing.com/search" target="_blank" id="search-form">

????????????????<input type="text" name="q" class="search-text" id="search_input" autocomplete="off" />

????????????????<input type="submit" class="search-button" value="" />

????????????</form>

????????</div>

????</div>

????<div>

????????<div class="suggest" id="search-suggest" style="display:none">

????????????<ul>

????????????????<li>搜索結果1</li>

????????????????<li>搜索結果2</li>

????????????????<li>搜索結果3</li>

????????????</ul>

????????</div>

????</div>

</body>

</html>



正在回答

舉報

0/150
提交
取消
搜索框制作
  • 參與學習       66022    人
  • 解答問題       463    個

本課程從簡入深講解搜索框的制作,學習JQ與JS實現Ajax技術的不同點

進入課程

幫忙看看代碼,出不來下拉框,調試不好,謝謝

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號