muzi
/
macUI
mirror of https://github.com/1099438829/macUI.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

修正浏览器 

修正菜单小尺寸下的错误
This commit is contained in:
1099438829 2020-01-16 10:57:03 +08:00
parent 5394ca9233
commit e0e315428e
14 changed files with 16 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/safari/css/index.css
View File

@ -1 +1 @@
body{padding:0;margin:0;font-family:microsoft yahei,segoe ui,lucida grande,Helvetica,Arial,sans-serif;font-size:14px;color:#333}.container{width:590px;margin:0 auto;padding-top:100px;position:relative}.container:after{content:'';display:block;clear:both}.container>div{float:left}.container .logo{width:100%;height:120px;margin:0 auto 10px;background-position:center;background-repeat:no-repeat;background-size:auto 120px}.container .input{position:relative;width:500px;height:44px;border-top:#ccc solid 1px;border-right:0;border-bottom:#ccc solid 1px;border-left:#ccc solid 1px;border-radius:4px 0 0 4px}.container .input>input{outline:0;border:0;padding:0 80px 0 10px;margin:0;height:44px;width:410px;color:#333;font-size:16px;border-radius:4px 0 0 4px}.container .input>input::-webkit-input-placeholder{color:#999}.container .input .picker{width:40px;padding-right:30px;position:absolute;top:0;right:0;height:100%;line-height:44px;cursor:pointer;color:#999;font-size:12px;text-align:right;background-image:url(../images/down.png);background-position:50px center;background-repeat:no-repeat;user-select:none}.container .input .picker-list{list-style:none;padding:5px 0;width:100px;position:absolute;right:0;top:50px;margin:0;line-height:26px;font-size:12px;border-radius:2px;box-shadow:0 1px 5px rgba(0,0,0,.2);background-color:#fff;display:none}.container .input .picker-list>li{padding-left:36px;background-position:10px center;background-repeat:no-repeat;background-size:16px auto}.container .input .picker-list>li:hover{background-color:#ebf1f5;cursor:pointer}.container .input .hot-list{padding:10px 0;width:100%;position:absolute;left:0;top:50px;margin:0;line-height:32px;font-size:14px;border-radius:2px;box-shadow:0 1px 5px rgba(0,0,0,.2);background-color:#fff;display:none}.container .input .hot-list>a{display:block;color:#333;text-decoration:none;padding:0 10px;overflow:hidden}.container .input .hot-list>a:hover{background-color:#f3f3f3}.container .input .hot-list>a>div{float:left}.container .input .hot-list>a>div.number{text-align:center;width:40px}.container .search{width:89px;height:46px;background-color:#08f;background-image:url(../images/search.png);background-position:center;background-repeat:no-repeat;border-radius:0 4px 4px 0;cursor:pointer} body{padding:0;margin:0;font-family:microsoft yahei,segoe ui,lucida grande,Helvetica,Arial,sans-serif;font-size:14px;color:#333}.container{width:590px;margin:0 auto;padding-top:100px;position:relative}.container:after{content:'';display:block;clear:both}.container>div{float:left}.container .logo{width:100%;height:120px;margin:0 auto 10px;background-position:center;background-repeat:no-repeat;background-size:auto 120px}.container .input{position:relative;width:500px;height:44px;border-top:#ccc solid 1px;border-right:0;border-bottom:#ccc solid 1px;border-left:#ccc solid 1px;border-radius:4px 0 0 4px}.container .input>input{outline:0;border:0;padding:0 80px 0 10px;margin:0;height:44px;width:410px;color:#333;font-size:16px;border-radius:4px 0 0 4px}.container .input>input::-webkit-input-placeholder{color:#999}.container .input .picker{width:40px;padding-right:30px;position:absolute;top:0;right:0;height:100%;line-height:44px;cursor:pointer;color:#999;font-size:12px;text-align:right;background-image:url(../img/down.png);background-position:50px center;background-repeat:no-repeat;user-select:none}.container .input .picker-list{list-style:none;padding:5px 0;width:100px;position:absolute;right:0;top:50px;margin:0;line-height:26px;font-size:12px;border-radius:2px;box-shadow:0 1px 5px rgba(0,0,0,.2);background-color:#fff;display:none}.container .input .picker-list>li{padding-left:36px;background-position:10px center;background-repeat:no-repeat;background-size:16px auto}.container .input .picker-list>li:hover{background-color:#ebf1f5;cursor:pointer}.container .input .hot-list{padding:10px 0;width:100%;position:absolute;left:0;top:50px;margin:0;line-height:32px;font-size:14px;border-radius:2px;box-shadow:0 1px 5px rgba(0,0,0,.2);background-color:#fff;display:none}.container .input .hot-list>a{display:block;color:#333;text-decoration:none;padding:0 10px;overflow:hidden}.container .input .hot-list>a:hover{background-color:#f3f3f3}.container .input .hot-list>a>div{float:left}.container .input .hot-list>a>div.number{text-align:center;width:40px}.container .search{width:89px;height:46px;background-color:#08f;background-image:url(../img/search.png);background-position:center;background-repeat:no-repeat;border-radius:0 4px 4px 0;cursor:pointer}

0
app/safari/images/baidu.png → app/safari/img/baidu.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
app/safari/img/bing.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 100 KiB

0
app/safari/images/down.png → app/safari/img/down.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 94 B

After

Width:  |  Height:  |  Size: 94 B

BIN
app/safari/img/google.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 48 KiB

0
app/safari/images/ico_baidu.png → app/safari/img/ico_baidu.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 178 B

After

Width:  |  Height:  |  Size: 178 B

0
app/safari/images/ico_bing.png → app/safari/img/ico_bing.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 239 B

After

Width:  |  Height:  |  Size: 239 B

0
app/safari/images/ico_google.ico → app/safari/img/ico_google.ico
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.3 KiB

After

Width:  |  Height:  |  Size: 5.3 KiB

0
app/safari/images/ico_sogou.png → app/safari/img/ico_sogou.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 562 B

After

Width:  |  Height:  |  Size: 562 B

0
app/safari/images/search.png → app/safari/img/search.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 297 B

After

Width:  |  Height:  |  Size: 297 B

BIN
app/safari/img/sogou.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.4 KiB

10
app/safari/index.html
View File

@ -7,15 +7,15 @@
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<div class="logo" style="background-image: url(images/baidu.png)"></div> <div class="logo" style="background-image: url(img/baidu.png)"></div>
<div class="input"> <div class="input">
<input type="text" placeholder="请输入要搜索的内容" autocomplete="off" id="search-input"> <input type="text" placeholder="请输入要搜索的内容" autocomplete="off" id="search-input">
<div class="picker">百度</div> <div class="picker">百度</div>
<ul class="picker-list"> <ul class="picker-list">
<li style="background-image: url(images/ico_baidu.png)" data-logo="baidu.png">百度</li> <li style="background-image: url(img/ico_baidu.png)" data-logo="baidu.png">百度</li>
<li style="background-image: url(images/ico_sogou.png)" data-logo="sogou.png">搜狗</li> <li style="background-image: url(img/ico_sogou.png)" data-logo="sogou.png">搜狗</li>
<li style="background-image: url(images/ico_bing.png)" data-logo="bing.png">bing</li> <li style="background-image: url(img/ico_bing.png)" data-logo="bing.png">bing</li>
<li style="background-image: url(images/ico_google.ico)" data-logo="google.png">Google</li> <li style="background-image: url(img/ico_google.ico)" data-logo="google.png">Google</li>
</ul> </ul>
<div class="hot-list"></div> <div class="hot-list"></div>
</div> </div>

13
app/safari/js/index.js
View File

@ -3,8 +3,14 @@ var helangSearch = {
searchIndex: 0, searchIndex: 0,
hot: { hot: {
color: ['#ff2c00', '#ff5a00', '#ff8105', '#fd9a15', '#dfad1c', '#6bc211', '#3cc71e', '#3cbe85', '#51b2ef', '#53b0ff'], color: ['#ff2c00', '#ff5a00', '#ff8105', '#fd9a15', '#dfad1c', '#6bc211', '#3cc71e', '#3cbe85', '#51b2ef', '#53b0ff'],
list: ['1099438829@qq.com', 'qq:1099438829', '木子的忧伤', 'macUI', '猿码云', 'apecloud.cn', 'win10ui', 'https://github.com/1099438829/macUI'] list: ['木子的忧伤', 'macUI', '猿码云', 'apecloud.cn', 'win10ui', 'https://github.com/1099438829/macUI']
}, },
searchArr : [
'https://www.baidu.com/s?ie=UTF-8&wd=',//百度
'https://www.sogou.com/web?query=', //搜狗
'https://cn.bing.com/search?q=', //必应
'https://www.google.com/search?q=',//谷歌
],
init: function() { init: function() {
var _this = this; var _this = this;
this.els = { this.els = {
@ -18,7 +24,7 @@ var helangSearch = {
this.els.hotList.html(function() { this.els.hotList.html(function() {
var str = ''; var str = '';
$.each(_this.hot.list, function(index, item) { $.each(_this.hot.list, function(index, item) {
str += '<a href="https://www.baidu.com/s?ie=utf8&oe=utf8&tn=98010089_dg&ch=11&wd=' + item + '" target="_blank">' + '<div class="number" style="color: ' + _this.hot.color[index] + '">' + (index + 1) + '</div>' + '<div>' + item + '</div>' + '</a>'; str += '<a href="'+_this.searchArr[_this.searchIndex] + item + '" target="_blank">' + '<div class="number" style="color: ' + _this.hot.color[index] + '">' + (index + 1) + '</div>' + '<div>' + item + '</div>' + '</a>';
}); });
return str; return str;
}); });
@ -47,8 +53,7 @@ var helangSearch = {
} }
}); });
this.els.button.click(function() { this.els.button.click(function() {
var searchArr = ['百度', '搜狗', '必应', '谷歌']; location.href = _this.searchArr[_this.searchIndex] + _this.els.input.val();
alert(searchArr[_this.searchIndex] + "搜索：" + _this.els.input.val());
}); });
$(document).click(function() { $(document).click(function() {
_this.els.pickerList.hide(); _this.els.pickerList.hide();