dlstatic / static-wappnr · Commits

Commit 1926da1eaa85d7d3f1343cffded030d8cf2c12c1

Authored by linning
Committed by Gerrit Code Review
2 parents ede12ede 32857333

Merge "branch swith" into dev

Inline Side-by-side
Showing 6 changed files with 296 additions and 0 deletions
2.0/filterpop.html 0 → 100644
  View file @1926da1
  1 +<!DOCTYPE html>
  2 +<html lang="en">
  3 +<head>
  4 + <meta charset="UTF-8">
  5 + <meta name="format-detection" content="telephone=no" />
  6 + <meta name="msapplication-tap-highlight" content="no" />
  7 + <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
  8 + <!-- <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> -->
  9 + <meta content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" name="viewport" />
  10 + <title>筛选弹出面板</title>
  11 + <link rel="stylesheet" href="../css/style/common.css">
  12 + <link rel="stylesheet" href="../css/style/filterpop.css">
  13 +
  14 + <!-- base seajs -->
  15 + <script type="text/javascript" src="http://static.nong12.com/static/newStatic/common/js/base/sea.js"></script>
  16 + <!-- base jquery -->
  17 + <script type="text/javascript" src="http://static.nong12.com/static/newStatic/common/js/base/jquery-2.1.3.min.js"></script>
  18 +</head>
  19 +
  20 +<body id="filterpop">
  21 + <!-- // wait bechao demo -->
  22 +</body>
  23 +</html>
0 24 \ No newline at end of file
... ...
2.0/searchtab01.html 0 → 100644
  View file @1926da1
  1 +<!DOCTYPE html>
  2 +<html lang="en">
  3 +<head>
  4 + <meta charset="UTF-8">
  5 + <meta name="format-detection" content="telephone=no" />
  6 + <meta name="msapplication-tap-highlight" content="no" />
  7 + <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
  8 + <!-- <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> -->
  9 + <meta content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" name="viewport" />
  10 + <title>带tab的 搜索01</title>
  11 + <link rel="stylesheet" href="../css/style/common.css">
  12 + <link rel="stylesheet" href="../css/style/searchtab.css">
  13 +
  14 + <!-- base seajs -->
  15 + <script type="text/javascript" src="http://static.nong12.com/static/newStatic/common/js/base/sea.js"></script>
  16 + <!-- base jquery -->
  17 + <script type="text/javascript" src="http://static.nong12.com/static/newStatic/common/js/base/jquery-2.1.3.min.js"></script>
  18 +</head>
  19 +
  20 +<body id="serachtab">
  21 + <div class="m-page">
  22 + <header class="m-header header-light">
  23 + <div class="head">
  24 + <a href="#" class="lt-bar m-icon icon-back white">返回</a>
  25 + <ul class="m-tab" searchtab>
  26 + <li class="active" ><a href="javascript:;" data-target="tab-content-goods">商品</a></li>
  27 + <li class=""><a href="javascript:;" data-target="tab-content-store">店铺</i></a></li>
  28 + </ul>
  29 + </div>
  30 + </header>
  31 + <section class="m-content tab-content">
  32 + <div id="tab-content-goods">
  33 + <form class="m-form inline-form">
  34 + <input type="text" autocomplete="off" class="m-input" placeholder="输入要搜索的商品">
  35 + <button class="m-btn btn-success btn-search">搜 索</button>
  36 + </form>
  37 + </div>
  38 +
  39 + <div id="tab-content-store" class="m-hide">
  40 + <form class="m-form inline-form">
  41 + <input type="text" autocomplete="off" class="m-input" placeholder="输入要搜索的店铺">
  42 + <button class="m-btn btn-success btn-search">搜 索</button>
  43 + </form>
  44 + </div>
  45 + </section>
  46 + </div>
  47 + <script type="text/javascript" src="../js/javascript/common/config.js"></script>
  48 + <script type="text/javascript">
  49 + seajs.use( ['../js/javascript/search/searchtab.js']);
  50 + </script>
  51 +</body>
  52 +</html>
0 53 \ No newline at end of file
... ...
2.0/searchtab02.html 0 → 100644
  View file @1926da1
  1 +<!DOCTYPE html>
  2 +<html lang="en">
  3 +<head>
  4 + <meta charset="UTF-8">
  5 + <meta name="format-detection" content="telephone=no" />
  6 + <meta name="msapplication-tap-highlight" content="no" />
  7 + <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
  8 + <!-- <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> -->
  9 + <meta content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" name="viewport" />
  10 + <title>带tab的 搜索02（带搜索结果）</title>
  11 + <link rel="stylesheet" href="../css/style/common.css">
  12 + <link rel="stylesheet" href="../css/style/searchtab.css">
  13 +
  14 + <!-- base seajs -->
  15 + <script type="text/javascript" src="http://static.nong12.com/static/newStatic/common/js/base/sea.js"></script>
  16 + <!-- base jquery -->
  17 + <script type="text/javascript" src="http://static.nong12.com/static/newStatic/common/js/base/jquery-2.1.3.min.js"></script>
  18 +</head>
  19 +
  20 +<body id="serachtab">
  21 + <div class="m-page">
  22 + <header class="m-header">
  23 + <div class="head">
  24 + <a href="#" class="lt-bar m-icon icon-back white">返回</a>
  25 + <ul class="m-tab">
  26 + <li class="" ><a href="javascript:;" data-target="tab-content-goods">商品</a></li>
  27 + <li class="active"><a href="javascript:;" data-target="tab-content-store">店铺</i></a></li>
  28 + </ul>
  29 + </div>
  30 + </header>
  31 + <section class="m-content tab-content">
  32 + <div id="tab-content-goods" class="m-hide">
  33 + <form class="m-form inline-form">
  34 + <input type="text" autocomplete="off" class="m-input" placeholder="输入要搜索的商品">
  35 + <button class="m-btn btn-success btn-search">搜 索</button>
  36 + </form>
  37 + </div>
  38 +
  39 + <div id="tab-content-store">
  40 + <form class="m-form inline-form">
  41 + <input type="text" autocomplete="off" class="m-input" placeholder="输入要搜索的店铺">
  42 + <button class="m-btn btn-success btn-search">搜 索</button>
  43 + </form>
  44 + <div class="m-table-view sort-left">
  45 + <ul id="search-rs-list">
  46 + <li class="cell on" >
  47 + <a class="title" href="#">测试店铺1</a>
  48 + </li>
  49 + <li class="cell" >
  50 + <a class="title" href="#">测试店铺2</a>
  51 + </li>
  52 + </ul>
  53 + </div>
  54 + </div>
  55 + </section>
  56 + </div>
  57 + <script type="text/javascript" src="../js/javascript/common/config.js"></script>
  58 +</body>
  59 +</html>
0 60 \ No newline at end of file
... ...
css/style/searchtab.css 0 → 100644
  View file @1926da1
  1 +#serachtab {
  2 + font-family: 'Microsoft YaHei', 'WenQuanYi Micro Hei', SimHei, tahoma, sans-serif;
  3 + background: #fff;
  4 +}
  5 +#serachtab .m-header {
  6 + background: #fff;
  7 + border-bottom: 1px solid #dddddd;
  8 +}
  9 +#serachtab .m-tab {
  10 + border: 0px solid #ddd;
  11 + background: transparent;
  12 + padding: 0px;
  13 +}
  14 +#serachtab .m-tab li {
  15 + min-width: 80px;
  16 + height: 43px;
  17 + border: 1px solid #ddd;
  18 + margin-left: 10px;
  19 + padding: 0;
  20 +}
  21 +#serachtab .m-tab li a {
  22 + display: inline-block;
  23 + width: 100%;
  24 + height: 100%;
  25 + background: #f5f5f5;
  26 + color: #666666;
  27 +}
  28 +#serachtab .m-tab li.active {
  29 + border-bottom: 1px solid #fff;
  30 +}
  31 +#serachtab .m-tab li.active a {
  32 + display: inline-block;
  33 + width: 100%;
  34 + height: 100%;
  35 + color: #23ac38;
  36 + background: #fff;
  37 +}
  38 +#serachtab .tab-content {
  39 + padding: 15px;
  40 +}
  41 +#serachtab .inline-form {
  42 + display: flex;
  43 + flex-flow: row wrap;
  44 +}
  45 +#serachtab .inline-form input {
  46 + box-sizing: border-box;
  47 + flex: 1;
  48 + height: 35px;
  49 + line-height: 35px;
  50 + font-family: 'Microsoft YaHei', 'WenQuanYi Micro Hei', SimHei, tahoma, sans-serif;
  51 + padding-left: 10px;
  52 + border: 1px solid #ddd;
  53 + font-size: 14px;
  54 + background: #f5f5f5;
  55 +}
  56 +#serachtab .inline-form button {
  57 + border-radius: 0;
  58 + width: 60px;
  59 + height: 35px;
  60 + margin-left: 10px;
  61 + line-height: 35px;
  62 + font-family: 'Microsoft YaHei', 'WenQuanYi Micro Hei', SimHei, tahoma, sans-serif;
  63 + font-size: 14px;
  64 + text-align: center;
  65 + padding: 0px;
  66 +}
  67 +#serachtab .m-table-view {
  68 + border-top: 0px solid #ccc;
  69 +}
... ...
css/style/searchtab.less 0 → 100644
  View file @1926da1
  1 +#serachtab{
  2 + font-family: 'Microsoft YaHei', 'WenQuanYi Micro Hei', SimHei, tahoma, sans-serif;
  3 + background:#fff;
  4 + .m-header{
  5 + background: #fff;
  6 + border-bottom:1px solid #dddddd;
  7 + }
  8 + .m-tab{
  9 + border: 0px solid #ddd;
  10 + background:transparent;
  11 + padding:0px;
  12 + }
  13 + .m-tab li{
  14 + min-width:80px;
  15 + height: 43px;
  16 + border: 1px solid #ddd;
  17 + margin-left:10px;
  18 + padding:0;
  19 + }
  20 + .m-tab li a{
  21 + display: inline-block;
  22 + width: 100%;
  23 + height: 100%;
  24 + background:#f5f5f5;
  25 + color:#666666;
  26 + }
  27 + .m-tab li.active{
  28 + border-bottom: 1px solid #fff;
  29 + }
  30 + .m-tab li.active a{
  31 + display:inline-block;
  32 + width:100%;
  33 + height:100%;
  34 + color:#23ac38;
  35 + background:#fff;
  36 + }
  37 + .tab-content{
  38 + padding:15px;
  39 + }
  40 + .inline-form{
  41 + display: flex;
  42 + flex-flow: row wrap;
  43 + input{
  44 + box-sizing: border-box;
  45 + flex: 1;
  46 + height:35px;
  47 + line-height:35px;
  48 + font-family: 'Microsoft YaHei', 'WenQuanYi Micro Hei', SimHei, tahoma, sans-serif;
  49 + padding-left:10px;
  50 + border:1px solid #ddd;
  51 + font-size:14px;
  52 + background:#f5f5f5;
  53 + }
  54 + button{
  55 + border-radius:0;
  56 + width:60px;
  57 + height:35px;
  58 + margin-left:10px;
  59 + line-height:35px;
  60 + font-family: 'Microsoft YaHei', 'WenQuanYi Micro Hei', SimHei, tahoma, sans-serif;
  61 + font-size:14px;
  62 + text-align:center;
  63 + padding:0px;
  64 + }
  65 + }
  66 +
  67 + .m-table-view{
  68 + border-top:0px solid #ccc;
  69 + }
  70 +}
0 71 \ No newline at end of file
... ...
js/javascript/search/searchtab.js 0 → 100644
  View file @1926da1
  1 +define(function( require, exports, module ) {
  2 + "use strict";
  3 +
  4 + // 注册插件
  5 + $.fn.searchtab = function() {
  6 + if (this.length > 0) {
  7 + return this.each(function() {
  8 + $(this).find("[data-target]").click(function(){
  9 + var target = $(this).attr('data-target');
  10 + var $target = $("#"+target);
  11 + $target.siblings().addClass('m-hide');
  12 + $target.removeClass('m-hide');
  13 + $(this).parent().siblings().removeClass('active');
  14 + $(this).parent().addClass('active');
  15 + });
  16 + });
  17 + }
  18 + };
  19 +
  20 + $(function(){
  21 + $("[searchtab]").searchtab();
  22 + });
  23 +});
... ...