[Projet de formation] APP "On Campus" - la plateforme de recherche de services autour du campus universitaire

1. Résumé du projet

1. Contexte du marché

Avec le nombre croissant d'utilisateurs d'Internet en Chine, l'industrie Internet joue un rôle important dans l'économie de marché. Dans le même temps, l'avènement de l'ère de l'information a complètement changé les moyens de communication traditionnels des gens. De l'envoi de lettres aux appels téléphoniques, des appels aux téléphones portables, et des téléphones portables parlants aux téléphones intelligents qui peuvent obtenir une grande quantité d'informations, les principaux moyens d'obtenir des informations ont subi des changements qualitatifs. Les gens ne seront pas seulement satisfaits des fonctions des appels téléphoniques et des SMS, mais plus comme un outil pour recevoir des informations, comprendre l'actualité, créer des réseaux sociaux, faciliter la vie et jouer à des jeux. Les étudiants universitaires ont généralement une forte acceptation et dépendance à l'égard de diverses plates-formes d'information, mais il existe sur le marché des logiciels d'application de services de vie mixtes.Selon les besoins des étudiants universitaires, les intérêts des étudiants universitaires sont le point de départ fondamental pour fournir des informations afin de faciliter la étude et vie des collégiens.

Très peu. Ainsi, une plate-forme de recherche de campus pour les étudiants est également née.

2. Présentation du produit

  La plateforme de recherche de campus est un logiciel d'application destiné aux étudiants, qui agrège des informations sur les nécessités de base, la nourriture, le logement et les transports autour de l'université, et les publie de manière centralisée pour faciliter l'étude et la vie des étudiants. Il s'agit de servir les étudiants de première année, de fournir des informations aux étudiants de première année et d'aider les étudiants à se renseigner.

2. Contenu du projet

1. Guide de vie

   Nourriture environnante : plats signatures uniques à la cafétéria de l'école, fenêtre d'approvisionnement, période d'approvisionnement, prix, plats signatures des restaurants autour de l'école, plats spéciaux, nouvelles cuisines, consommation par habitant, stratégie de commande, indice de recommandation des seniors et des sœurs, coupons restaurant , numéro de téléphone de la boutique à emporter sur le campus, menu, forfait assorti de repas et de boissons ; Shopping de loisirs : répartition de différentes catégories de centres commerciaux, supermarchés, librairies, magasins de boissons, etc. dans les quartiers d'affaires environnants, axes de circulation, enseignes caractéristiques du shopping centres commerciaux, informations sur les remises saisonnières, activités intra-urbaines, restaurants caractéristiques, hôtels en vedette, informations sur les achats groupés; Lettre de la vie du campus: coupures d'eau, coupures de courant, inspections des dortoirs, activités du club, soirées et autres communiqués d'information.

2. Guide d'étude

   Guide de sélection de cours, excellente recommandation de cours, stratégie de sélection de cours, stratégie de correspondance des crédits au choix pour CET-4 et CET-6, ordinateur, examen départemental, examen national et autres guides de préparation aux examens professionnels, partage de données, inscription aux cours, guides de lecture pour l'école , collèges et bibliothèques environnants, occupation des sièges pour l'examen d'entrée de troisième cycle, achat groupé de matériel, achat de notes d'étude d'anciens étudiants, réexamen scolaire, pré-étude, échange d'étudiants et autres informations.

3. Guide de lecture

  Guides touristiques pour les attractions environnantes, réunions de classe, logements en location à la journée, location de matériel, etc.

4. Autres

L'inscription à l'examen d'auto-école, le processus de délivrance des différents certificats par chaque bureau, etc.

3. Réalisation du projet

Coopérez avec les commerçants environnants pour servir les étudiants Coopérez avec une série d'installations de soutien autour de l'école, des restaurants, des hôtels, des magasins, etc. et les commerçants environnants peuvent fournir des remises électroniques sur la plate-forme. La fonction de coupon, la fonction d'achat groupé et la fonction de code QR attirent les utilisateurs cibles. Coopérez avec l'école, en vous concentrant sur les informations sur le campus et les nouveaux étudiants. En termes de fourniture d'informations sur l'école, il doit y avoir une certaine coopération avec l'école pour fournir les informations correspondantes. Vous pouvez négocier avec l'école pour mettre les informations quotidiennes de l'école et l'introduction sur la plate-forme. . Coopérez avec l'école pour promouvoir les étudiants de première année qui viennent d'entrer à l'école, ajoutez-le au contenu de l'éducation de début de trimestre et faites une promotion complète pour les étudiants de première année.Affichez le code QR de l'application de la plate-forme dans un endroit bien en vue de l'école pour que les étudiants puissent le télécharger et l'afficher dans l'école Promouvoir en ligne. Par la suite, il a coopéré avec de nombreuses écoles et promu à d'autres organisations universitaires.

4. Objectifs du produit

élargir la base d'utilisateurs

Améliorer l'activité des utilisateurs

Améliorer l'expérience produit

Trouvez des partenaires commerciaux et augmentez vos revenus

5. Innovation et avantages

La différence avec les autres plates-formes de services est que la plate-forme de recherche de campus s'adresse aux étudiants et que les consommateurs sont segmentés. En même temps, tout le contenu publié par la plate-forme est basé sur l'expérience de vie des étudiants et est réalisé par collecteurs de données spécialisés. Il est publié après collecte, tri, filtrage et confirmation. Toutes les informations communiquées sont basées sur la commodité de la vie des étudiants.

6. Mode

Le principal moyen de profit pour la "plate-forme de recherche de campus pour les étudiants" est de payer les marchands et de vendre des publicités, parmi lesquelles les publicités sont le modèle de profit le plus basique de la plate-forme. Dans le modèle commercial OCO, les utilisateurs consomment en ligne + expérience hors ligne, et la combinaison de en ligne et hors ligne rend l'expérience utilisateur plus pratique.

7. Affichage des travaux

8. Affichage PPT

Neuf, affichage du code

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>APP</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" />
</head>
<body>
    <div id="wrap">
        <div id="main"> 
            <label class="con">Hello APP!</label><br><br>
			<div id='sys-info' style="text-align:left;margin:10px;border:1px;"></div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript">
    apiready = function(){
		var ver = api.version;
		var sType = api.systemType;
		var sVer = api.systemVersion;
		var id = api.deviceId;
		var model = api.deviceModel;
		var name = api.deviceName;
		var cType = api.connectionType;
		var wgtParam = api.wgtParam || '';
		if(wgtParam){
			wgtParam = JSON.stringify(wgtParam);
		}
		var pageParam = api.pageParam || '';
		if(pageParam){
			pageParam = JSON.stringify(pageParam);
		}
		var appParam = api.appParam || '';
		if(appParam){
			appParam = JSON.stringify(appParam);
		}
		var wgtRootDir = api.wgtRootDir;
		var winName = api.winName;
		var winWidth = api.winWidth;
		var winHeight = api.winHeight;
		var frameName = api.frameName||'';
		var frameWidth = api.frameWidth||'';
		var frameHeight = api.frameHeight||'';

		var str = '<ul>';
		str += '<li>版本信息: '+ ver +'</li>';
		str += '<li>系统类型: '+ sType +'</li>';
		str += '<li>系统版本: '+ sVer +'</li>';
		str += '<li>设备标识: '+ id +'</li>';
		str += '<li>设备型号: '+ model +'</li>';
		str += '<li>设备名称: '+ name +'</li>';
		str += '<li>网络状态: '+ cType +'</li>';
		str += '<li>根目录: '+ wgtRootDir +'</li>';
		str += '<li>主窗口名字: '+ winName +'</li>';
		str += '<li>主窗口宽度: '+ winWidth +'</li>';
		str += '<li>主窗口高度: '+ winHeight +'</li>';
		str += '<li>子窗口名字: '+ frameName +'</li>';
		str += '<li>子窗口宽度: '+ frameWidth +'</li>';
		str += '<li>子窗口高度: '+ frameHeight +'</li>';
		str += '</ul>';

		$api.byId('sys-info').innerHTML = str;
    }
</script>
</html>
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>APP</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" />
    <style>
    #main{
        padding: 0;
    }

/*导航栏4个按钮*/
    #nav_top{
        padding-top: 130px;
        margin: 0 0.6em 1em 0.6em;
    }
    #nav_top .nav_top_list{
        background-color: #EEEEF0;
        overflow: hidden;
    }

    #nav_top .nav_top_li{
        background-color: #EEEEF0;
        border-radius: 3px;
        float: left;
        width: 25%;
    }
    #nav_top .nav_top_li:active,#nav_top .nav_top_li.tap-active{
        background-color: #999999;
    }
    #nav_top .text{
        float: left;
        text-indent: 6px;
        color: #58616D;
        font-size: 0.75em;
        line-height: 2em;
    }
    #nav_top .nav_top_li .icon{
        float: left;
        margin-left: 7px;
        width: 1.5em;
        height: 1.5em;
    }
    #nav_top .score .icon{
        background: url(../../res/img/index_icon_score.png) center center no-repeat;
        background-size: 100% 100%;
    }
    #nav_top .recharge .icon{
        background: url(../../res/img/index_icon_recharge.png) center center no-repeat;
        background-size: 100% 100%;
    }
    #nav_top .lottery .icon{
        background: url(../../res/img/index_icon_lottery.png) center center no-repeat;
        background-size: 100% 100%;
    }
    #nav_top .ju .icon{
        background: url(../../res/img/index_icon_ju.png) center center no-repeat;
        background-size: 100% 100%;
    }
/*导航栏4个按钮 end*/
/* home页具体内容 */
    .headlines{
        width: 100%;
        padding-top: 1em;
        background-color: #FFFFFF;
    }
    .container .title{
        text-indent: 13px;
        color: #58616D;
        width: 100%;
        display: block;
    }
    .container .brief{
        text-indent: 13px;
        font-size: 0.7em;
        color: #BDBDBD;
        width: 100%;
        margin: 6px 0 3px 0;
        display: block;
    }
    .headlines img{
        width: 100%;
        display: block;
    }
    .brand{
        background-color: #FFF;

    }
    .brand:after{
        clear: both;
        content: '';
        display: block;
    }
    .brand .brand_left{
        float: left;
        width: 46%;
        padding-top: 1em;
    }
    .brand .brand_left img{
        width: 100%;
        display: block;
    }
    .brand .brand_right{
        float: left;
        width: 54%;
        padding-top: 1em;
    }
    .brand .brand_right .title{
        text-indent: 0;
        width: 100%;
        display: block;
    }
    .brand .brand_right .brief{
        text-indent: 0;
        width: 100%;
        color: #58616D;
        display: block;
    }
    .brand .brand_right .img_box{
        width: 100%;
        margin-top: 20px;
    }
    .brand .brand_right .img_box:after{
        content: '';
        display: block;
        clear: both;
    }
    .brand .brand_right .img_box img{
        width: 46%;
        float: left;
        margin: 2px;
    }
    .count_down{
        background-color: #FFF;
        margin-top: 0.75em;
        margin-bottom: 0.75em;
    }
    .count_down:after{
        content: '';
        display: block;
        clear: both;
    }
    .count_down .left{
        float: left;
        width: 33%;
        padding-top: 1em;
    }
    .count_down .center{
        float: left;
        width: 33%;
    }
    .count_down .center img{
        width: 100%;
        display: block;
    }
    .count_down .right{
        float: left;
        width: 33%;
        padding-top: 1.5em;
    }
    .count_down .right .title{
        font-size: 0.7em;
        color: #58616D;
        display: block;
    }

    #counting_box{
        padding-left: 13px;
    }
    #counting_box li{
        float: left;
        font-size: 0.7em;
    }
    #counting_box .t{
        background-color: #333333;
        border-radius: 2px;
        color: #FFF;
        width: 0.75em;
        height: 1.3em;
        line-height: 1.4em;
        text-align: center;
        margin-right: 1px;
        text-decoration: line-through;
    }
/*会场*/
    .venue{
        width: 100%;
        padding-top: 1em;
        background-color: #FFFFFF;
    }
    .venue img{
        width: 100%;
        display: block;
    }
    .venue_big_box{
        width: 100%;
        padding-bottom: 1em;
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .venue_big_inner{

    }
    .venue_big{
        padding-top: 1em;
        background-color: #FFFFFF;
    }
    .venue_big.v1{
        margin-left: 0;
    }
    .venue_big img{
        width: 100%;
        display: block;
    }
/*会场end*/
/*中间大广告*/
    .big_ads{
        margin-top: 0.75em;
        margin-bottom: 0.75em;
    }
    .big_ads.last{
        margin-top: 0;
    }
/*中间大广告end*/
/*行业精选*/
    .industry_select{

    }
    .industry{
        background-color: #FFF;
        margin-bottom: 0.75em;
    }
    .reload_header{
        margin-top: 0.5em;
        margin-bottom: 0.5em;
    }
    .reload_header .title{
        float: left;
        width: auto;
    }
    .reload_header .reload{
        float: right;
        color: #BDBDBD;
        border-radius: 3px;
        text-align: center;
        width: 5em;
        font-size: 0.8em;
        height: 1.5em;
        line-height: 1.4em;

    }
    .reload_header .reload .reload_icon{
        width: 1em;
        height: 1em;
        display: inline-block;
        background: url(../../res/img/tm_home_refresh_small_normal.png) center center no-repeat;
        background-size: 100% 100%;
        vertical-align: baseline;
    }
    .reload_header .reload:active,.reload_header .reload.tap-active{
        background-color: #666666;
    }
    .reload_header .reload:active .reload_icon,.reload_header .reload.tap-active .reload_icon{
        background: url(../../res/img/tm_home_refresh_small_press.png) center center no-repeat;
        background-size: 100% 100%;
    }
    .industry_left{
        padding-top: 1em;
        width: 50%;
        float: left;
    }
    .industry_right{
        width: 50%;
        float: left;
    }
    .industry_right img{
        width: 100%;
        display: block;
    }
/*行业精选end*/
/* 更多惊喜 */
    .more{

    }
    .more_unit{
        background-color: #FFF;
        margin-bottom: 0.75em;
    }
    .more_unit .img_box{
        margin: 0.75em auto;
    }
    .more_unit img{
        width: 100%;
        display: block;
    }
    .more_unit .price{
        text-indent: 0.75em;
        color: #FF4450;
        margin-bottom: 8px;
    }
/*更多惊喜 end*/
/* home页具体内容 end */

    </style>
</head>
<body>
    <div id="wrap">
        <div id="main"> 
            <!-- 轮播图 -->
            <div id='slider' class='swipe'>
                <div class='swipe-wrap'>
                    <div class="swipe-box" tapmode="tap-active" data-url="http://h5.m.taobao.com/channel/act/other/newbook.php" data-title="新书" onclick="toDetail(this);">
                        <img src="../../image/002.png" alt="全球知名大牌特卖汇">
                    </div>
                    <div class="swipe-box" tapmode="tap-active" data-url="http://h5.m.taobao.com/channel/act/other/newbook.php" data-title="新书" onclick="toDetail(this);">
                        <img src="../../image/003.jpg" alt="君御灯饰特惠日!">
                    </div>
                    <div class="swipe-box" tapmode="tap-active" data-url="http://h5.m.taobao.com/channel/act/other/newbook.php" data-title="新书" onclick="toDetail(this);">
                        <img src="../../image/004.jpg" alt="宇宙最萌面膜专场">
                    </div>
       
                </div>
                <div id="title-box">
                    <!-- <span id="title-box-text">
                        一周电影推荐《移动迷宫》
                    </span> -->
                    <ul id="title-box-ul">
                        <li class="active"></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </div>
            </div>
            <!-- 轮播图 end -->
            <!-- 上方导航栏 -->
            <div id="nav_top">
                <ul class="nav_top_list">
                    <li class="nav_top_li score" tapmode="tap-active" data-url="http://ju.taobao.com/m/jusp/juhuasuantm/mtp.htm" data-title="聚划算" onclick="toDetail(this);">
                        <i class="icon"></i>
                        <span class="text">领积分</span>
                    </li>
                    <li class="nav_top_li recharge" tapmode="tap-active" data-url="http://ju.taobao.com/m/jusp/juhuasuantm/mtp.htm" data-title="聚划算" onclick="toDetail(this);">
                        <i class="icon"></i>
                        <span class="text">充值</span>
                    </li>
                    <li class="nav_top_li lottery" tapmode="tap-active" data-url="http://ju.taobao.com/m/jusp/juhuasuantm/mtp.htm" data-title="聚划算" onclick="toDetail(this);">
                        <i class="icon"></i>
                        <span class="text">彩票</span>
                    </li>
                    <li class="nav_top_li ju" tapmode="tap-active" data-url="http://ju.taobao.com/m/jusp/juhuasuantm/mtp.htm" data-title="聚划算" onclick="toDetail(this);">
                        <i class="icon"></i>
                        <span class="text">聚划算</span>
                    </li>
                </ul>
            </div>
            <!-- 上方导航栏 end-->
            <!-- 下方详情 -->
            <!--<div class="container">-->
                <!--<div class="headlines sp1_3" tapmode="tap-active" data-url="http://m.tmall.com/channel/act/315/tmall-headlines_2014/11/19.php" data-title="天猫头条" onclick="toDetail(this);">
                    <span class="title">天猫头条</span>
                    <span class="brief">娇俏女</span>
                    <img src="../../image/index_img_headlines.png" alt="">
                </div>
                <div class="brand sp2_3">
                    <div class="brand_left" tapmode="tap-active" data-url="http://brand.tmall.com/mobilestreet/index.htm" data-title="品牌街" onclick="toDetail(this);">
                        <span class="title">品牌街</span>
                        <span class="brief">怀念书写的乐趣</span>
                        <img src="../../image/index_img_brand.png" alt="">
                    </div>
                    <div class="brand_right">
                        <span class="title">&nbsp;</span>
                        <span class="brief">我关注的才是大牌</span>
                        <div class="img_box">
                            <img src="../../image/index_brand_logo_1.png" alt="" tapmode="tap-active" data-url="http://jeanswest.m.tmall.com" data-title="真维斯" onclick="toDetail(this);">
                            <img src="../../image/index_brand_logo_2.png" alt="" tapmode="tap-active" data-url="http://cherry.m.tmall.com" data-title="cherry" onclick="toDetail(this);">
                            <img src="../../image/index_brand_logo_3.png" alt="" tapmode="tap-active" data-url="http://puma.m.tmall.com" data-title="puma" onclick="toDetail(this);">
                            <img src="../../image/index_brand_logo_4.png" alt="" tapmode="tap-active" data-url="http://playboy.m.tmall.com" data-title="playboy" onclick="toDetail(this);">
                        </div>
                        
                    </div>                  
                </div>
                <div class="count_down sp1" tapmode="tap-active" data-url="http://page.m.tmall.com/myy/myy_cjy.html" data-title="喵一眼" onclick="toDetail(this);">
                    <div class="left">
                        <span class="title">喵一眼</span>
                        <span class="brief">精选商品限时抢购</span>
                        <ul id="counting_box" class="clearfix">
                            <li class="h1 t">0</li>
                            <li class="h2 t">0</li>
                            <li class="colon">:</li>
                            <li class="m1 t">2</li>
                            <li class="m2 t">5</li>
                            <li class="colon">:</li>
                            <li class="s1 t">0</li>
                            <li class="s2 t">0</li>
                        </ul>
                    </div>
                    <div class="center">
                        <img src="../../image/home_count_down.png" alt="">
                    </div>
                    <div class="right">
                        <span class="title">精品大量涌入</span>
                        <span class="brief">24小时整点更新</span>
                    </div>
                </div>
                <div class="venue_big_box sp1">
                    <div class="venue_big_inner clearfix">
                        <div class="venue_big sp1_3_big v1" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                            <span class="title">我的衣橱</span>
                            <span class="brief">私人时尚衣橱</span>
                            <img src="../../image/index_img_p5.png" alt="">
                        </div>
                        <div class="venue_big sp1_3_big" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                            <span class="title">专属试用</span>
                            <span class="brief">只属于你的试用</span>
                            <img src="../../image/index_img_p6.png" alt="">
                        </div>
                        <div class="venue_big sp1_3_big" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                            <span class="title">穿戴Style</span>
                            <span class="brief">我的搭配经</span>
                            <img src="../../image/index_img_p7.png" alt="">
                        </div>
                    </div>
                </div>
                <div class="venue sp1_3" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                    <span class="title">建材会场</span>
                    <span class="brief">3年质保</span>
                    <img src="../../image/index_img_p1.png" alt="">
                </div>
                <div class="venue sp1_3" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                    <span class="title">居家会场</span>
                    <span class="brief">我的梦想家</span>
                    <img src="../../image/index_img_p2.png" alt="">
                </div>
                <div class="venue sp1_3" tapmode="tap-active" data-title="喵鲜生" data-url="http://miao.tmall.com/go/market/miao/m.php" onclick="toDetail(this);">
                    <span class="title">喵鲜生</span>
                    <span class="brief">双11生鲜抄底</span>
                    <img src="../../image/index_img_p3.png" alt="">
                </div>
                -->
                <img src="../../image/index_img_p4.png" alt="" class="big_ads sp1" tapmode="tap-active" data-url="http://h5.m.taobao.com/channel/act/other/newbook.php" data-title="新书" onclick="toDetail(this);">
                <div class="industry_select clearfix">
                    <div class="sp1 reload_header">
                        <span class="title">行业精选</span>
                        <!-- <span class="reload">
                            <i class="reload_icon"></i>
                            换一组
                        </span> -->
                    </div>
                    <!-- 行业精选 -->
                    <!--<div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">女装</span>
                            <span class="brief">手机优先购</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/005.jpg" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">电器城</span>
                            <span class="brief">抢稀缺手机</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i2.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">女鞋</span>
                            <span class="brief">抢秋冬新款</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i3.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">男装</span>
                            <span class="brief">潮男搭配</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i4.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">箱包</span>
                            <span class="brief">包你满意</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i5.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">男鞋</span>
                            <span class="brief">英伦休闲季</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i6.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">美妆</span>
                            <span class="brief">免费试用</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i7.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">食品</span>
                            <span class="brief">每天免费吃</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i8.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">运动</span>
                            <span class="brief">爱运动</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i9.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">居家</span>
                            <span class="brief">10点秒杀</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i10.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">母婴</span>
                            <span class="brief">萌装过冬</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i11.png" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">汽车车品</span>
                            <span class="brief">购车享大礼</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/index_img_i12.png" alt="">
                        </div>
                    </div>-->
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">吃喝玩乐</span>
                            <span class="brief">havefun</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/007.jpg" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">学习</span>
                            <span class="brief">学习</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/006.jpg" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">兼职</span>
                            <span class="brief">我的兼职</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/005.jpg" alt="">
                        </div>
                    </div>
                    <div class="sp1_2 industry clearfix" tapmode="tap-active" data-url="http://nvzhuang.tmall.com/market/fushi/nvzhuang_mobile.php" data-title="精品女装" onclick="toDetail(this);">
                        <div class="industry_left">
                            <span class="title">其他</span>
                            <span class="brief">其他</span>
                        </div>
                        <div class="industry_right">
                            <img src="../../image/001.jpg" alt="">
                        </div>
                    </div>
                </div>
                <!-- 更多惊喜 -->
                <!--<div class="more clearfix">
                    <div class="sp1 reload_header">
                        <span class="title">行业精选</span>
                        <span class="reload" tapmode="tap-active" onclick="changeGroup();">
                            <i class="reload_icon"></i>
                            换一组
                        </span>
                    </div>
                    <div class="more_unit sp1_2" tapmode="tap-active" data-url="http://detail.m.tmall.com/item.htm?spm=875.7403452.20000008.2.M7uZ74&id=13570491314&abbucket=&acm=03317.1003.1.99094&uuid=jsjqEXAo_mFKjC0zy31sCAXbPnigNyV/z&abtest=&scm=1003.1.03317.ITEM_13570491314_99094&pos=2" data-title="键盘" onclick="toDetail(this);">
                        <div class="img_box">
                            <img src="../../image/index_img_m1.png" alt="">
                        </div>
                        <span class="price">¥398.0</span>
                    </div>
                    <div class="more_unit sp1_2" tapmode="tap-active" data-url="http://detail.m.tmall.com/item.htm?spm=875.7403452.20000008.13.M7uZ74&id=18826634839&abbucket=&acm=03317.1003.1.99094&uuid=OUtYF9zr_mFKjC0zy31sCAXbPnigNyV/z&abtest=&scm=1003.1.03317.ITEM_18826634839_99094&pos=3" data-title="哑铃" onclick="toDetail(this);">
                        <div class="img_box">
                            <img src="../../image/index_img_m2.png" alt="">
                        </div>
                        <span class="price">¥288.0</span>
                    </div>
                    <div class="more_unit sp1_2" tapmode="tap-active" data-url="http://detail.m.tmall.com/item.htm?spm=875.7403452.20000008.13.M7uZ74&id=18826634839&abbucket=&acm=03317.1003.1.99094&uuid=OUtYF9zr_mFKjC0zy31sCAXbPnigNyV/z&abtest=&scm=1003.1.03317.ITEM_18826634839_99094&pos=3" data-title="哑铃" onclick="toDetail(this);">
                        <div class="img_box">
                            <img src="../../image/index_img_m3.png" alt="">
                        </div>
                        <span class="price">¥95.0</span>
                    </div>
                    <div class="more_unit sp1_2" tapmode="tap-active" data-url="http://detail.m.tmall.com/item.htm?spm=875.7403452.20000008.2.M7uZ74&id=13570491314&abbucket=&acm=03317.1003.1.99094&uuid=jsjqEXAo_mFKjC0zy31sCAXbPnigNyV/z&abtest=&scm=1003.1.03317.ITEM_13570491314_99094&pos=2" data-title="键盘" onclick="toDetail(this);">
                        <div class="img_box">
                            <img src="../../image/index_img_m4.png" alt="">
                        </div>
                        <span class="price">¥148.0</span>
                    </div>
                </div>-->
                <!-- 更多惊喜 end -->
                <img src="../../image/123.jpg" alt="" class="big_ads last sp1" tapmode="tap-active" data-url="http://h5.m.taobao.com/channel/act/other/newbook.php" data-title="新书" onclick="toDetail(this);">
            </div>
            <!-- 下方详情 end -->
            <!--  -->
            <div class="standard_hor">
                <span class="title"></span>
                <span class="brief"></span>
                <img src="" alt="">
            </div>
            <!-- div.standard_per -->
            <!--  -->
        </div>
    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/zepto.js"></script>
<script type="text/javascript" src="../../script/swipe.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript">
    apiready = function(){
        Zepto(function($){
        // home页 样式 初始化
            var sp1_3,sp1_2,sp2_3,sp1,sp1_3_big;
            var em = parseInt(getComputedStyle(document.body,false).fontSize);
            var emW = em*3/4;
            var bodyW = $api.offset(document.body).w;
            sp1_3 = (bodyW - 4*emW)/3;
            sp1_3_big = (bodyW - 4*emW)/3 + emW;
            sp2_3 = bodyW - sp1_3 - 3*emW;
            sp1_2 = (bodyW - 3*emW)/2;
            sp1 = bodyW - 2*emW;
            $('.sp1_3').width(sp1_3);
            $('.sp1_3_big').width(sp1_3_big);
            $('.sp2_3').width(sp2_3);
            $('.sp1_2').width(sp1_2);
            $('.sp1').width(sp1);
            $('.venue_big_inner').width((sp1_3_big*3 + emW*2));
            $('.more_unit .img_box').width(sp1_2 - emW*2);
        // home页 样式 初始化 end
            var aLi = $('#title-box-ul li');
            // var act_title = $('#title-box-text');
            window.mySwipe = Swipe($api.byId('slider'),{
                auto: 3000,
                continuous: true,
                callback: function(index,elem) {

                    var i = aLi.length;
                    while (i--) {
                        aLi[i].className = '';
                    }
                    aLi[index].className = 'active';
                    // var text = $(elem).find('img').attr('alt');
                    // act_title.text(text);
                }
            });
            $('#slider .swipe-box').on('click', function(event) {
                
            });

            var toDouble = function(num){
                var json;
                if (num < 10) {
                    num = '0' + num;
                } else{
                    num = num + '';
                }
                json = {
                    'n1': num.charAt(0),
                    'n2': num.charAt(1)
                };
                
                return json;
            }
            var h1 = $('#counting_box .h1');
            var h2 = $('#counting_box .h2');
            var m1 = $('#counting_box .m1');
            var m2 = $('#counting_box .m2');
            var s1 = $('#counting_box .s1');
            var s2 = $('#counting_box .s2');
            var countDownTimer;
            var countDown = function(date){
                var  counting = (date.getTime() - (new Date().getTime()))/1000;
                // var hh = parseInt(counting/3600);
                // var mm = parseInt((counting-hh*3600)/60);
                // var ss = parseInt(counting - hh*3600 - mm*60);
                // h1.text(toDouble(parseInt(counting/3600)).n1);

                countDownTimer = setInterval(function(){
                    counting -= 1; 
                    if (counting <= 0) {
                        // 倒计时结束……
                        clearInterval(countDownTimer);
                    }
                    var hh = parseInt(counting/3600);
                    var mm = parseInt((counting-hh*3600)/60);
                    var ss = parseInt(counting - hh*3600 - mm*60);
                    // toDouble(counting);
                    h1.text(toDouble(hh).n1);
                    h2.text(toDouble(hh).n2);
                    m1.text(toDouble(mm).n1);
                    m2.text(toDouble(mm).n2);
                    s1.text(toDouble(ss).n1);
                    s2.text(toDouble(ss).n2);

                },1000)

            };
            var countDownTime = new Date();
            countDownTime.setMinutes(countDownTime.getMinutes()+25);
            countDown(countDownTime);
        });

    }
    // apiready();
</script>
</html>

10. Rapport de formation

 

Je suppose que tu aimes

Origine blog.csdn.net/lf21qp/article/details/131819985
conseillé
Classement