detail.html 12.2 KB
<!DOCTYPE html>
<!--[if IEMobile 7 ]>    <html class="no-js iem7"> <![endif]-->
<!--[if (gt IEMobile 7)|!(IEMobile)]><!--> <html class="no-js"> <!--<![endif]-->
<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="description" content="">
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <meta http-equiv="cleartype" content="on">
    <meta name=”apple-mobile-web-app-status-bar-style” content=black” />

    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="img/touch/apple-touch-icon-144x144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/touch/apple-touch-icon-114x114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/touch/apple-touch-icon-72x72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="img/touch/apple-touch-icon-57x57-precomposed.png">
    <link rel="shortcut icon" sizes="196x196" href="img/touch/touch-icon-196x196.png">
    <link rel="shortcut icon" href="img/touch/apple-touch-icon.png">

    <link rel="apple-touch-startup-image" sizes="640x920" href="img/startup/startup-retina.png" media="screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)">
    <link rel="apple-touch-startup-image" sizes="320x460" href="img/startup/startup.png" media="screen and (max-device-width: 320)">

    <!-- Tile icon for Win8 (144x144 + tile color) -->
    <meta name="msapplication-TileImage" content="img/touch/apple-touch-icon-144x144-precomposed.png">
    <meta name="msapplication-TileColor" content="#222222">

    <!-- Add to homescreen for Chrome on Android -->
    <meta name="mobile-web-app-capable" content="yes">

    <!-- For iOS web apps. Delete if not needed. https://github.com/h5bp/mobile-boilerplate/issues/94 -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="">

    <!-- This script prevents links from opening in Mobile Safari. https://gist.github.com/1042026 -->
    <script>
        (function (a, b, c) {
            if (c in b && b[c]) {
                var d, e = a.location, f = /^(a|html)$/i;
                a.addEventListener("click", function (a) {
                    d = a.target;
                    while (!f.test(d.nodeName))d = d.parentNode;
                    "href"in d && (d.href.indexOf("http") || ~d.href.indexOf(e.host)) && (a.preventDefault(), e.href = d.href)
                }, !1)
            }
        })(document, window.navigator, "standalone")
    </script>

    <link rel="stylesheet" href="css/add2home.css"/>
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/global.css">
    <script src="js/vendor/modernizr-2.7.0.min.js"></script>
</head>
<body id="header">
<div class="yohoHeader">
    <a tabindex="0" class="headerMenuBtn icon-app-list" href="javascript:void(0);"></a>
    <a tabindex="1" class="headerSearchBtn icon-app-search" href="search.html"></a>
    <a tabindex="2" class="headerCart icon-app-cart fn-right" href="javascript:void(0);"><em class="redCircle">2</em></a>
    <a tabindex="3" class="headerUserAvatar icon-app-user fn-right" href="javascript:void(0);"><em class="redCircle">4</em></a>
    <div class="yohoLogo">
        <a href="" target="5">
            <span class="headerYOHO">Y</span>
            <span class="headerChar">H</span>
        </a>
    </div>
</div>
<div class="YOHOAPP">
    <div class="yohoBuyWrap">
        <div class="yohoNavgator">
            <div class="yohoTabNav">
                <a href="javascript:void(0);">
                    BOYS
                        <span class="YOHOBUY-arrow-up show">
                            <i class="arrow-first"></i>
                            <i class="arrow-last"></i>
                        </span>
                </a>
                <a href="javascript:void(0);">
                    GIRLS
                        <span class="YOHOBUY-arrow-up">
                            <i class="arrow-first"></i>
                            <i class="arrow-last"></i>
                        </span>
                </a>
            </div>
            <div class="navigatorContent">
                <ul class="tabMenu show">
                    <li><a href="index.html"><span class="fn-right"><em class="icon-uni3E"></em></span>首页</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="navNumber">283</em><em class="icon-uni3E"></em></span>新品</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>品牌</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>OUTLET</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>上衣</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>裤装</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span></a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>箱包</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>配饰</a></li>
                </ul>
                <ul class="tabMenu">
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>首页</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="navNumber">288</em><em class="icon-uni3E"></em></span>新品</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>品牌</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>OUTLET</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>上衣</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>裤装</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span></a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>箱包</a></li>
                    <li><a href="javascript:void(0);"><span class="fn-right"><em class="icon-uni3E"></em></span>配饰</a></li>
                </ul>
            </div>
        </div>
        <div class="yohoContainer">
            <div class="listNavigator normalTitle detailTopBar">
                <a href="javascript:void(0);" class="icon-uni3C listBack"></a>
                <h2>Married to the MOB OH HELL</h2>
            </div>
            <div class="detailBox">
                <div class="detailSlider" id="detailSlider">
                    <div class="detail-wrap">
                        <div><img src="img/goods-1.jpg" alt=""/></div>
                        <div><img src="img/goods-1.jpg" alt=""/></div>
                        <div><img src="img/goods-1.jpg" alt=""/></div>
                    </div>
                    <div class="detailSlide-nav">
                        <span class="on"></span>
                        <span></span>
                        <span></span>
                    </div>
                </div>
                <h1 class="detailTitle">¥399.00</h1>
                <div class="vipLevel"><span>银卡¥380.00</span><span>金卡¥360.00</span><span>白金卡¥352.00</span></div>
                <div class="detailToBuy">
                    <a href="javascript:void(0);" class="AddFavorite"><em class="icon-uni31"></em></a>
                    <a href="javascript:void(0);" class="toBuyNow">立即购买</a>
                </div>
                <div class="discountNotice">
                    <p><span>现金折扣</span>双十二 满¥999减¥200</p>
                    <p><span>买送礼品</span>CHOCOOLATE 满¥399加¥39购波点钱包</p>
                </div>
                <div class="detailSize">
                    <h3>尺码信息<span>size info</span></h3>
                    <table>
                        <tbody>
                        <tr>
                            <td>尺码</td>
                            <td>肩宽</td>
                            <td>衣长</td>
                            <td>袖长</td>
                            <td>胸围</td>
                        </tr>
                        <tr>
                            <td>M</td>
                            <td>43</td>
                            <td>102</td>
                            <td>65</td>
                            <td>90</td>
                        </tr>
                        <tr>
                            <td>XL</td>
                            <td>46</td>
                            <td>106</td>
                            <td>69</td>
                            <td>96</td>
                        </tr>
                        </tbody>
                    </table>
                    <img src="img/size.jpg" width="100%" alt=""/>
                </div>
                <div class="detailSize detailGoodsInfo">
                    <h3>商品信息<span>product info</span></h3>
                    <table>
                        <tbody>
                        <tr>
                            <td>编号:51018059</td>
                            <td>帽型:棒球帽</td>
                        </tr>
                        <tr>
                            <td>颜色:黑</td>
                            <td>平檐款式</td>
                        </tr>
                        <tr>
                            <td>类型:帽子</td>
                            <td>字母图案</td>
                        </tr>
                        <tr>
                            <td>性别:女款</td>
                            <td>风格:街头</td>
                        </tr>
                        <tr>
                            <td colspan="2">Married to the MOB是由Leah McSweeney创立的女装品牌,一向标榜不羁、大胆的女性streetwear设计。喜欢恶搞的女生们,赶紧入手吧。</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="detailToShop">
                    <a href="#">
                        <span class="fn-right">进入店铺 <em class="icon-uni3E"></em></span>
                        <img src="img/shopLogo.jpg" alt="" width="47"/>
                        Married to the MOB
                    </a>
                </div>
                <div class="detail-img">
                    <img src="img/detail01.jpg" width="300" alt=""/>
                    <img src="img/detail02.jpg" width="300" alt=""/>
                </div>
                <div class="scrollTop">
                    <a href="#header">back to top<em class="icon-uni2C"></em></a>
                </div>
            </div>
            <div class="footer">
                <div class="downloadApp">
                    <img src="img/app-download.jpg" alt="" width="100%"/>
                    <a href="#">下载</a>
                </div>
                <!--未登录-->
                <!--<div class="loginType">
                    <a class="loginBtn" href="javascript:void(0);">登录</a>
                    <a class="registerBtn" href="javascript:void(0);">注册</a>
                </div>-->
                <div class="loginType">
                    <p>Hi, <a href="#" class="tdu">Amanda</a> <a href="#" class="loginOut">退出</a></p>
                </div>
                <div class="copyright">
                    <p>CopyRight ? 2007-2016 南京新与力文化传播有限公司</p>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="js/vendor/jquery-2.0.3.min.js"></script>
<script src="js/helper.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
</body>
</html>