Browse Source

完善列表页面的线条问题,以及搜索闪动问题

luyanan 8 years ago
parent
commit
767a7c590b
5 changed files with 24 additions and 19 deletions
  1. 17 12
      app/css/app.css
  2. 3 2
      app/html/index_home.html
  3. 1 1
      app/html/login.html
  4. 2 3
      app/index.html
  5. 1 1
      app/js/index.js

+ 17 - 12
app/css/app.css

3
.mui-input-group:after{background: none;}
3
.mui-input-group:after{background: none;}
4
.mui-table-view:before{ background: none;}
4
.mui-table-view:before{ background: none;}
5
.mui-table-view:after{ background: none;}
5
.mui-table-view:after{ background: none;}
6
/*.mui-table-view-cell:after{right: 0;bottom: 0;left: -10px;background: none;}*/
6
.mui-table-view-cell:after{right: 0;bottom: 0;left: 80px;}
7
/*.mui-table-view-cell .mui-media-body{padding-bottom:10px; border-bottom:1px solid #CCCCCC;}*/
7
/*.mui-table-view-cell .mui-media-body{padding-bottom:10px; border-bottom:1px solid #CCCCCC;}*/
8
.mui-input-group .mui-input-row:last-child:after{ background: none;}
8
.mui-input-group .mui-input-row:last-child:after{ background: none;}
9
.mui-input-group .mui-input-row:after{left:10px; background-color: #E6E6E6;}/*登录注册等表单的横线*/
9
.mui-input-group .mui-input-row:after{left:10px; background-color: #E6E6E6;}/*登录注册等表单的横线*/
75
.toptit{color: #FFFFFF; font-size: 20px;}
75
.toptit{color: #FFFFFF; font-size: 20px;}
76
.personhead{color: #FFFFFF;}
76
.personhead{color: #FFFFFF;}
77
/*底部导航栏*/
77
/*底部导航栏*/
78
.footbox{ background: #FFFFFF;}
78
.footbox{ /*background: #FFFFFF;*/border-top:1px solid #EFEFEF;-webkit-box-shadow: 0px 6px 6px 2px #CCCCCC;box-shadow: 0px 6px 6px 2px #CCCCCC;}
79
.footbox .mui-tab-item.mui-active{ color: #FF9900;}
79
.footbox .mui-tab-item.mui-active{ color: #FF9900;}
80

80

81
.listtit0{font-size: 13px; color: #222222;}
81
.listtit0{font-size: 13px; color: #222222;}
108
/*****表单公共样式********/
108
/*****表单公共样式********/
109
/*input输入相关*/
109
/*input输入相关*/
110
.frmbox{ width: 100%; margin:2% auto; border-radius: 6px; }
110
.frmbox{ width: 100%; margin:2% auto; border-radius: 6px; }
111
.frmtype{ width: 100%; margin: auto;line-height: 24px;padding: 1% 2%;font-size: 14px;}
111
.frmtype{ width: 100%; margin: auto;line-height: 30px;padding: 1% 2%;font-size: 14px;}
112
.frmbtn{margin:4% auto;font-size: 14px;line-height: 24px;padding: 1% 2%;border:1px solid #FF9900; border-radius: 6px; color:#FF9900 ;}
112
.frmbtn{margin:4% auto;font-size: 14px;line-height: 24px;padding: 1% 2%;border:1px solid #FF9900; border-radius: 6px; color:#FF9900 ;}
113
/*.frmbtn:hover{border:1px solid #FF9900; color:#FFFFFF;background-color:#FF9900;}*/
113
/*.frmbtn:hover{border:1px solid #FF9900; color:#FFFFFF;background-color:#FF9900;}*/
114
.frmbox{ border:none; width: 90%;height: 100%; } 
114
.frmbox{ border:none; width: 90%;height: 100%; } 
135
.frmbox .frm-input .frmtypel{ height: 0;height: 100%; width: 90%;}
135
.frmbox .frm-input .frmtypel{ height: 0;height: 100%; width: 90%;}
136
/*logo盒子的相关*/
136
/*logo盒子的相关*/
137
.logobox{ padding:6%; margin:12% auto 6% ; }
137
.logobox{ padding:6%; margin:12% auto 6% ; }
138
.logolink{display: block;width:40%;margin: auto;}
138
.logolink{display: block;width:30%;margin: auto;}
139
.logoimg{ width: 100%; margin: auto; text-align:center;}
139
.logoimg{ width: 100%; margin: auto; text-align:center;}
140
/*忘记密码*/
140
/*忘记密码*/
141
.forgetword{ position: absolute;top: 50%; margin-top:-14px;right: 2%;padding:4px 10px;line-height: 20px; font-size: 13px; background: #f0f0f0;border:1px solid #f0f0f0; color: #AAAAAA; border-radius: 6px;}
141
.forgetword{ position: absolute;top: 50%; margin-top:-14px;right: 2%;padding:4px 10px;line-height: 20px; font-size: 12px; background: #f0f0f0;border:1px solid #f0f0f0; color: #AAAAAA; border-radius: 6px;}
142
.forgetword2{ background: #FF9900;border:1px solid #FF9900; color: #FFFFFF;}
142
.forgetword2{ background: #FF9900;border:1px solid #FF9900; color: #FFFFFF;}
143
.forgetword em{font-size:16px; line-height:16px; margin-left:3px;}
143
.forgetword em{font-size:16px; line-height:16px; margin-left:3px;}
144
.forgeticon{ background: url(../images/forget.png) center center no-repeat; background-size: 100% 100%;padding:2%; position: absolute; margin-top:-2%;}
144
.forgeticon{ background: url(../images/forget.png) center center no-repeat; background-size: 100% 100%;padding:2%; position: absolute; margin-top:-2%;}
190
/***********************登录注册相关页面*******************/
190
/***********************登录注册相关页面*******************/
191

191

192
/***********************首页*******************/
192
/***********************首页*******************/
193
.searchbox {width: 96%;margin: auto;}
194
.searchbox .mui-placeholder .mui-icon-search{font-size:18px; color: #999999;}
193
.searchbox {width: 96%;margin:6px auto;background:#FFFFFF;height:32px;text-align: center;}
194
.searchbox .searchtxt.mui-icon{font-size:16px; color: #999999;}
195
.searchbox .searchtxt.mui-icon span{font-size:14px;margin-left:4px;line-height:16px;}
195
.mui-search input[type=search].searchtxt{background: #FFFFFF;}
196
.mui-search input[type=search].searchtxt{background: #FFFFFF;}
196
.mui-search .mui-placeholder{ font-size: 14px; top:2px }
197
.mui-search .mui-placeholder{ font-size: 14px; top:2px }
197

198

207
/*热门专家*/
208
/*热门专家*/
208
.mui-table-view-cell.prolist:after{/*background:#C0C0C0*//*#c8c7cc*/;}
209
.mui-table-view-cell.prolist:after{/*background:#C0C0C0*//*#c8c7cc*/;}
209
.protable:before{ background-color:transparent;}
210
.protable:before{ background-color:transparent;}
210

211
#table .mui-table-view-cell:after{right: 0;bottom: 0;left:0;background: none;}
211

212

212
.mui-media .headimg{max-width:60px; height:60px; margin: 1% 0;overflow:hidden;}
213
.mui-media .headimg{max-width:60px; height:60px; margin: 1% 0;overflow:hidden;}
213
.mui-media .resimg{border-radius:2px; max-width:60px; height:60px; margin: 1% 0;}
214
.mui-media .resimg{border-radius:2px; max-width:60px; height:60px; margin: 1% 0;}
306
/*我的关注*/
307
/*我的关注*/
307
.fixbox{ background: #FFFFFF; position:fixed;top:45px;left:0;width:100%; z-index:1;}
308
.fixbox{ background: #FFFFFF; position:fixed;top:45px;left:0;width:100%; z-index:1;}
308
.fixbox .fixbtn{ padding:0; margin: 0; overflow: hidden;}
309
.fixbox .fixbtn{ padding:0; margin: 0; overflow: hidden;}
309
.fixbox .fixbtn li{ list-style: none; float: left; padding:6px 10px; border-bottom:1px solid #F0F0F0;text-align: center;font-size: 14px;height: 32px;}
310
.fixbox .fixbtn li{ list-style: none; float: left;height:40px;line-height:30px; padding:6px 10px; border-bottom:1px solid #F0F0F0;text-align: center;font-size: 14px;}
310
.fixbox .fixbtn li:first-child{ border-right:1px solid #F0F0F0;}
311
.fixbox .fixbtn li:first-child{ border-right:1px solid #F0F0F0;}
311
.fixbox .fixbtn li.liactive{ color: #FF9900;border-bottom-color: #FF9900;}
312
.fixbox .fixbtn li.liactive{ color: #FF9900;border-bottom-color: #FF9900;}
312
.childlist{ display: none;}
313
.childlist{ display: none;}
331
.updatebox:hover,.updatebox:active,.updatebox:link{ color: #FF9900;}
332
.updatebox:hover,.updatebox:active,.updatebox:link{ color: #FF9900;}
332
.updatebox .updatebtn{font-size:16px;}
333
.updatebox .updatebtn{font-size:16px;}
333

334

334
.addinfobox{ position: absolute; right:0; top:0; font-size: 13px; line-height:16px;color: #FF9900;}
335
.addinfobox{ position: absolute;right: 10px;/* top: 0; */ font-size: 13px; line-height:16px;color: #FF9900;}
335
.addinfobox:hover,.addinfobox:active,.addinfobox:link{ color: #FF9900;}
336
.addinfobox:hover,.addinfobox:active,.addinfobox:link{ color: #FF9900;}
336
.addinfobox .addinfobtn{font-size:16px;}
337
.addinfobox .addinfobtn{font-size:16px;}
337

338

383

384

384
.filterbox{ position: fixed; z-index:2; width: 100%;}
385
.filterbox{ position: fixed; z-index:2; width: 100%;}
385
.filterblock{padding:0; margin: 0;background:#FFFFFF;overflow: hidden;}
386
.filterblock{padding:0; margin: 0;background:#FFFFFF;overflow: hidden;}
386
.filterblock li{list-style:none; float: left; border-right:1px solid #F0F0F0; border-bottom:1px solid #F0F0F0;} 
387
.filterblock li{list-style:none; float: left;border-right:1px solid #F0F0F0; border-bottom:1px solid #F0F0F0;} 
388
.filterblock li a.mui-btn{height:40px;line-height:30px; }
389
.filterblock li a.mui-btn.mui-active,.filterblock li a.mui-btn:enabled:active{background: none;border:none;color:#666666;}
387
.filterblock li em{ font-size:18px; margin:0 2px;}
390
.filterblock li em{ font-size:18px; margin:0 2px;}
388
.filterlist{ padding:0; margin: 0; border:none; border-radius:0;padding:6px 6px 6px 12px;font-size: 13px;}
391
.filterlist{ padding:0; margin: 0; border:none; border-radius:0;padding:6px 6px 6px 12px;font-size: 13px;}
389
/*筛选条件*/
392
/*筛选条件*/
437

440

438
.filterbox2{ position: fixed; z-index:2; width: 100%;}
441
.filterbox2{ position: fixed; z-index:2; width: 100%;}
439
.filterblock2{padding:0; margin: 0; background:#FFFFFF;overflow: hidden;}
442
.filterblock2{padding:0; margin: 0; background:#FFFFFF;overflow: hidden;}
440
.filterblock2 li{list-style:none; position: relative; float: left; border-right:1px solid #F0F0F0;border-bottom:1px solid #F0F0F0;} 
443
.filterblock2 li{list-style:none; position: relative;float: left; border-right:1px solid #F0F0F0;border-bottom:1px solid #F0F0F0;} 
444
.filterblock2 li a.mui-btn{height:40px;line-height:30px; }
445
.filterblock2 li a.mui-btn.mui-active,.filterblock2 li a.mui-btn:enabled:active{background: none;border:none;color:#666666;}
441
.filterblock2 li select{  margin:0 2px;}
446
.filterblock2 li select{  margin:0 2px;}
442
.filterlist2{ padding:0; margin: 0; border:none; border-radius:0;padding:6px;font-size: 13px;}
447
.filterlist2{ padding:0; margin: 0; border:none; border-radius:0;padding:6px;font-size: 13px;}
443

448


+ 3 - 2
app/html/index_home.html

12
	
12
	
13
<!-- 主页面标题 -->
13
<!-- 主页面标题 -->
14
<header class="mui-bar mui-bar-nav toptitbox">
14
<header class="mui-bar mui-bar-nav toptitbox">
15
    <div class="mui-input-row mui-search searchbox">
16
	    <input type="search" class="mui-input-clear searchtxt" placeholder="搜索专家、合作资源" id="search">
15
    <div class="searchbox bgRadius">
16
    	<em class="mui-icon mui-icon-search searchtxt" id="search"><span>搜索专家、合作资源</span></em>
17
	    <!--<input type="search" class="mui-input-clear searchtxt" placeholder="搜索专家、合作资源">-->
17
	</div>
18
	</div>
18
</header>
19
</header>
19
 <!-- 主页面内容容器 -->
20
 <!-- 主页面内容容器 -->

+ 1 - 1
app/html/login.html

26
		            <input type="text" class="mui-input-clear frmtype" placeholder="请输入账号" id="username">
26
		            <input type="text" class="mui-input-clear frmtype" placeholder="请输入账号" id="username">
27
		        </div>
27
		        </div>
28
		        <div class="mui-input-row frm-input">
28
		        <div class="mui-input-row frm-input">
29
					<input id='password' type="password" class="mui-input-clear frmtype" placeholder="请输入密码">
29
					<input id='password' type="password" class="frmtype" placeholder="请输入密码">
30
					<span id='forgetPassword' class="forgetword forgetword2">忘记密码<em class="mui-icon mui-icon-help"></em></span>
30
					<span id='forgetPassword' class="forgetword forgetword2">忘记密码<em class="mui-icon mui-icon-help"></em></span>
31
				</div>
31
				</div>
32
		    </form>
32
		    </form>

+ 2 - 3
app/index.html

8
    <link href="css/iconfont.css" rel="stylesheet" />
8
    <link href="css/iconfont.css" rel="stylesheet" />
9
    <link href="css/app.css" rel="stylesheet"/>
9
    <link href="css/app.css" rel="stylesheet"/>
10
</head>
10
</head>
11
<body>
12
     
11
<body>
13
    <!--主页面底部菜单-->
12
    <!--主页面底部菜单-->
14
    <nav class="mui-bar mui-bar-tab footbox">
13
    <nav class="mui-bar mui-bar-tab footbox">
15
	    <a class="mui-tab-item mui-active" href="html/index_home.html">
14
	    <a class="mui-tab-item mui-active" href="html/index_home.html">
29
	var subpages = ['html/index_home.html', 'html/consultlist.html', 'html/myaccount.html'];
28
	var subpages = ['html/index_home.html', 'html/consultlist.html', 'html/myaccount.html'];
30
	var subpage_style = {
29
	var subpage_style = {
31
		top: '0px',
30
		top: '0px',
32
		bottom: '50px'
31
		bottom: '51px'
33
	};
32
	};
34
	var aniShow = {};
33
	var aniShow = {};
35
	//创建子页面,首个选项卡页面显示,其它均隐藏;
34
	//创建子页面,首个选项卡页面显示,其它均隐藏;

+ 1 - 1
app/js/index.js

18

18

19

19

20
/*点击搜索按钮*/
20
/*点击搜索按钮*/
21
search.addEventListener('focus', function() {
21
search.addEventListener('tap', function() {
22
	var nwaiting = plus.nativeUI.showWaiting();//显示原生等待框
22
	var nwaiting = plus.nativeUI.showWaiting();//显示原生等待框
23
    webviewShow = plus.webview.create("../html/search-home.html","../html/search-home.html");//后台创建webview并打开show.html
23
    webviewShow = plus.webview.create("../html/search-home.html","../html/search-home.html");//后台创建webview并打开show.html
24
    webviewShow.addEventListener("loaded", function() {
24
    webviewShow.addEventListener("loaded", function() {