ShopFront/index.html at master · iselien/ShopFront · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <title>Shop</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
    <link rel='stylesheet' type='text/css' media='screen' href='main.css'>
    <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
    <script src='main.js'></script>
    <script src='./js/swipe.js'></script>
</head>
<body>

<div class="container">

    <header id="header">
        <span>SHOP</span>
    </header>

    <div class="container">
        <div class="container_innav">
            <nav id="nav">
            <a href="#nav" class="open toggle-btn"><i class="icon-reorder"></i></a>
            <a href="#top" class="close toggle-btn"><i class="icon-remove-sign"></i></a>
                <ul id="nav_con">
                    <li><a href="#home" onclick="home()" class="active">首页</a></li>
                    <li><a href="#classfy">分类</a></li>
                    <li><a href="#message">消息</a></li>
                    <li><a href="#car">购物车</a></li>
                    <li><a href="#penson">个人中心</a></li>
                </ul>
            </nav>

        </div>
    </div>

    <div id="content">
        <div id="home">
            <div id="showcase">
                <div id='slider' class='swipe'>
                    <div class='swipe-wrap'>
                        <div><img src="./img/01.jpg" alt=""></div>
                        <div><img src="./img/02.jpg" alt=""></div>
                        <div><img src="./img/03.jpg" alt=""></div>
                  </div>
                  <div class="slider-control">
                    <button class="left" onclick="mySwipe.prev()"><i class="icon-angle-left"></i></button>
                    <button class="right" onclick="mySwipe.next()"><i class="icon-angle-right"></i></button>
                  </div>
                </div>
                <script>
                  window.mySwipe = Swipe(document.getElementById('slider'));
                </script>
              </div>

              <section id="mainbody">
                <h3>热门商品</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sem erat, egestas quis luctus ut, rhoncus vitae risus. Integer venenatis libero sit amet sapien dictum, quis bibendum mi volutpat. Cras pretium quam quis magna facilisis, eget feugiat nisi lacinia.</p>
              </section>
              <aside id="sidebar">
                <h3>为您推荐</h3>
                <p>Donec dolor arcu, interdum sed turpis faucibus, placerat ultricies felis. Donec pulvinar gravida rhoncus. Suspendisse vestibulum est eget dolor lobortis.</p>
              </aside>

        </div>


    </div>


    <footer id="footer">
    <h3>页脚</h3>
  </footer>
</div><!-- end .container -->


</body>
</html>