<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title></title>
<style>
html,
body {
margin: 0;
padding: 0;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: #ffffff;
}
*{
margin:0;
padding:0;
}
button,
input,
input[type=button],
input[type=reset],
input[type=search],
input[type=submit],
select {
outline: none;
-webkit-tap-highlight-color: transparent;
-webkit-appearance: none;
font-family: inherit;
border: none;
}
.hide {
display: none;
}
.search-wrap {
position: absolute;
left: 0;
right: 0;
top: 0;
padding: 8px 60px 8px 15px;
background-color: #fff;
border-bottom: 1px solid #d3d3d3;
z-index: 100;
}
.search-wrap.init-status {
padding-right: 15px;
}
.search-wrap .search-bar {
display: block;
height: 30px;
background-color: #ebebeb;
padding-left: 10px;
padding-right: 10px;
color: #b4b4b4;
font-size: 15px;
line-height: 31px;
border-radius: 5px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.search-wrap .cancel,
.search-wrap .submit {
position: absolute;
top: 0;
right: 0;
width: 55px;
height: 46px;
line-height: 46px;
text-align: center;
font-size: 16px;
color: #0079ff;
background-color: #fff;
}
.search-wrap .clear-input {
top: 11px;
right: 60px;
width: 34px;
height: 26px;
line-height: 26px;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAPFBMVEUAAACZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZlr8OySAAAAE3RSTlMANO/H574Jw5g/soF2LxKbQCgmvcJ4rgAAAKFJREFUOMu9k1sSgyAMRcNLwbfe/e+1HZLa0DKTP8+PztwTDRDoWa4lRSCm5erGZcTNWP7iIaMhD22+BfwQtqae89bQ39jRYVf9ocu3U+5/cp4D7yZeCwkrKo7Y8O8XVFYRZilkgx+VWYQEZagcSYQIZagcUQRAGZwLpmD+wmzSXKa5UdZWW4d10E1Gh2wPjD1y9tBqSlDlB/U4PxfnpEd5AeZAIGebfob2AAAAAElFTkSuQmCC) no-repeat center center;
background-color: #ededed;
background-size: 18px 18px;
position: absolute;
padding: 0;
border: 0;
font-size: 14px;
border-radius: 4px;
text-align: center;
z-index: 2;
}
.search-wrap.init-status .cancel,
.search-wrap.init-status .clear-input,
.search-wrap.init-status .submit {
display: none;
}
.search-wrap .search-bar .keyword {
display: block;
width: 100%;
padding-top: 6px;
padding-bottom: 6px;
border: 0;
font-size: 14px;
line-height: 18px;
background: 0 0;
}
.search-wrap.init-status .search-bar .keyword {
text-align: left;
}
.search-wrap .search-bar .keyword::-webkit-input-placeholder {
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAAAgCAMAAACioYPHAAAAaVBMVEUAAACAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICxWbJ4AAAAInRSTlMAv39AEB/f758wYFDQj3CvDPflh9qpJBYEyEc3sn1om1t4LqRQpwAABAhJREFUWMPtlumS0zAQhD26TzvXsiwsC/T7PySK5Fi+Q2Cpoij6R2w5lvSpPTNS86+Jc1kbLbfrb7WxXT4U44Y1jK/1tI3cmPnwzYTT6dK1chcQCLVB2ABk8GtdXW1IKLHWk9Ct452PuOlJ7gLexk1shGYLcGFPfbujLs0Aut+z6vMJuJw/2Q+8JeD4tg0YyizCE0gQGs+TvCjIRIZlEW43RAvAmJx8ENAfofwQBQScNwEJZQ4gdDI1kNXHJ6AoSyFQFoAFYGLYAzTspki29++I10NT9QVo9wEZ2r4h82XPh0cBAw3qRzkovH6cJiFg7wDy2vgtQPsTPc9Qh9mjJ7yswUXGFBgzloEvHYyR3USjD2XcNWn7lLJyBCi8UbgPeNDLmvB8XLMARKRBpDhDEl2npBqDBLpJ0aAAluftxQZARYDSPwH4DZcly1d8vRODnPtrw3LOw/xLO7Ba2fM9d9fXeLpcO7MYAN21dtSnMzPvzS1IzVrOfoJ6IAZngBHKiTFg7So86xSArgVNF0WYqu4IL2tV/wAcfhFQ0A3JRzEHtABULgFLwEVA9TdqNWM15CZgmzwKVAKyXIpxlKm04gU0Ako2kvExQvR5dX8SUBJc7NhVCv12MbzLCZ0ocahB/m6ZIboPGPBpyfEREBuAWrdbg0qNKkoY7wL4hO8rmzNOq3xOwyRyMR1UDL7TtRZ6pqFcalr/HoBva0X5jKflQ9kqACspx6ZHRsp4+TX3DoDPwOe94l35rigB2UimFe/loEfRIJzKeKUR4OaAYgwoQJtlpv5l8PJxYeBleFQVOjks1NfqUddiXQdow3nLskwA3ATQEauAjnQ1P4BPVSuxPOI8L9Np0qXEtBqXV1qYuoFUBUrqGNPaVsCogbYCCmgzmE803/QSex34y4TvuIzAZahQntohDHNIYi3ndrKj8v5oL/yVrnOi/zMbZJsdCTY5AL7KevoHcPpwF1AE7ZrY81Wx7sZgcyw6eUVXAEIrapJIxqYVIBdNx/NWFEvkmTrq2xFH458THT9rwIRKuASshAhzPkmA6Rm8wlDBg4py/cBCUZSYprSkkjkKmTOMj82WkHTUSLr45jkTbgPWmHPTk66GkQODYEMFkmOPx50kIPocyb+2hEVm0pOVfI4XJJ2efMrfQrgP6Agwk/3MKSg+MclWE6ssgpc9nlMwJdW6UcYZuOKqFtP9TcrDcGS9rBIKjTywT2ggmZ1X0dsCgyhmX1EQ9CIVIkYikZkLioQuF9XUMNyQvEDNFs+INFQOkiRTGFwAyjix2Cc6otHHMWZlbM+yPOclxYd9QYGXTrIsTza7hGFmH6BMqSKdq+bbGMo0ohqUUvkR8VtJ8fKBXvJly2Cx3882//UX6QfMclqph21gcgAAAABJRU5ErkJggg==);
background-repeat: no-repeat;
background-position: left center;
background-size: 80px 16px;
color: gray
}
.search-wrap.init-status .search-bar .keyword::-webkit-input-placeholder {
background-position: center center;
}
.suggestion-wrap {
position: absolute;
top: 46px;
bottom: 0;
z-index: 7;
width: 100%;
background: #f6f6f6;
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.map-wrap {
height: 45%;
position: relative;
top: 46px;
}
.list-wrap {
width: 100%;
position: absolute;
background-color: #fff;
z-index: 1;
bottom: 0;
left: 0;
overflow: hidden;
border-top: 1px solid #d3d3d3;
overflow-y: scroll;
}
.poi-list ul {
list-style: none;
width: 100%;
text-align: left;
padding: 0 0 65px;
}
.suggestion-wrap li,
.active-pos,
.poi-list li{
position: relative;
display: block;
padding-left: 15px;
border: none;
height: 58px;
padding-top: 6px;
margin: 0;
}
.poi-list li * {
pointer-events: none;
}
.poi-list li p,
.active-pos div p {
padding-bottom: 10px;
border-bottom: 1px solid #d3d3d3;
}
.poi-title {
font-size: 14px;
line-height: 27px;
color: #333;
font-weight: 400;
display: block;
width: 92%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.poi-address {
font-size: 12px;
color: gray;
height: 20px;
line-height: 20px;
margin: 0;
width: 92%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
display: block;
}
.poi-city,
.poi-latlng {
line-height: 22px;
display: none;
}
.no-more-results,
.no-results {
color: gray;
padding: 20px 0;
- 1
- 2
- 3
- 4
前往页