shopping/product.html at master · vsery/shopping · 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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<script type="text/javascript">
    function request(paras){
    　　var url = location.href;
    　　var paraString = url.substring(url.indexOf("?")+1,url.length).split("&");
    　　var paraObj = {}
    　　for (i=0;j=paraString[i];i++){
        　　paraObj[j.substring(0,j.indexOf("=")).toLowerCase()] = j.substring(j.indexOf("=")+1,j.length);
    　　}
    　　var returnValue = paraObj[paras.toLowerCase()];
    　　if(typeof(returnValue)=="undefined"){
        　　return "";
    　　}else{
        　　return returnValue;
    　　}
　　}
　　var id = request("id");
</script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>七宝商品</title>
    <meta name="keywords" content="七宝珠宝旗舰店">
    <meta name="description" content="七宝珠宝旗舰店">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" sizes="16x16" mask="" href="system/img/favicon.ico">
    <link rel="stylesheet" type="text/css" href="system/css/jquery.mobile.css">
    <link rel="stylesheet" type="text/css" href="system/css/swiper.min.css">
    <link rel="stylesheet" type="text/css" href="system/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="skin/001.css">
    <script type="text/javascript" src="system/js/jquery.min.js"></script>
    <script type="text/javascript" src="system/js/angular.min.js"></script>
    <script type="text/javascript" src="system/js/swiper.min.js"></script>
    <script type="text/javascript" src="system/js/jquery.mobile.min.js"></script>
    <script type="text/javascript" src="system/js/bootstrap.min.js"></script>
    <!--[if lt IE 9]>
      <script src="system/js/html5.js"></script>
      <script src="system/js/respond.min.js"></script>
    <![endif]-->
</head>
<body ng-app>
    <!-- 商品详情页面 -->
    <div data-role="page">
        <div id="header" data-role="header" data-position="fixed" data-fullscreen="false">
            <a href="javascript:;" class="sys sys_return ui-btn-left" data-rel="back"></a>
            <div class="float float-right">
                <a data-transition="slideup" data-ajax="false" href="search.html" class="sys sys_search"></a>
                <a href="javascript:;" class="sys sys_share" id="share-btn"></a>
                <a data-transition="slideup" data-ajax="false" href="javascript:;" class="sys sys_shopping_cart"></a>
            </div>
        </div>
        <div data-role="main" class="ui-content">
            <!-- 广告图部分 banner -->
            <script type="text/javascript">
                function ProdInfo($scope) {
                    $scope.prod = {
                        "title": "顶级珠宝",
                        "name": "5克拉珠宝项链",
                        "prize": 699.99,
                        "imgs": [{
                            "id": 0,
                            "src": "temp/activity (1).jpg",
                            "active": "active"
                        },{
                            "id": 0,
                            "src": "temp/activity (2).jpg",
                            "active": ""
                        },{
                            "id": 0,
                            "src": "temp/activity (3).jpg",
                            "active": ""
                        },{
                            "id": 0,
                            "src": "temp/activity (4).jpg",
                            "active": ""
                        }]
                    };
                };
            </script>
            <div id="home_banner" class="carousel slide" data-ride="carousel" ng-controller="ProdInfo">
               <ol class="carousel-indicators">
                    <li data-target="#home_banner" ng-repeat="img in prod.imgs" data-slide-to="{{img.id}}" class="{{img.active}}"></li>
                </ol>
                <div class="carousel-inner" role="listbox">
                    <div ng-repeat="img in prod.imgs" class="item {{img.active }}">
                        <img src="{{img.src}}">
                    </div>
                </div>
            </div>
            <section class="screen" ng-controller="ProdInfo">
                <div class="prize-body">
                    <span class="name">{{prod.name}}</span>
                    <span class="pirze">{{prod.prize}}</span>
                    <a href="orderinfo.html" data-ajax="false" class="btn btn-default float-right" id="paly-btn">立即购买</a>
                </div>
            </section>
            <script type="text/javascript">
                function Desginer($scope) {
                    $scope.dger = {
                        "header":"temp/fans (1).jpg",
                        "name": "Designer",
                        "dec": "是国内最早的网络钻石品牌设计中,倡导了钻石文化的传播,坚持完美",
                        "infos": [{
                            "img": "temp/info.jpg"
                        },{
                            "img": "temp/info.jpg"
                        },{
                            "img": "temp/info.jpg"
                        },{
                            "img": "temp/info.jpg"
                        },{
                            "img": "temp/info.jpg"
                        }]
                    }
                }
            </script>
            <section ng-controller="Desginer">
                <div id="Desginer">
                    <img src="{{dger.header}}" alt="" class="head">
                    <name>{{dger.name}}</name>
                    <p>{{dger.dec}}</p>
                </div>
            </section>
            <section ng-controller="Desginer">
                <p><title>设计说明</title></p>
                <img ng-repeat="info in dger.infos" src="{{info.img}}" alt="" class="img-responsive">
            </section>
        </div>
        <div id="share"></div>
    </div>
<script type="text/javascript">
    $("#paly-btn").attr("href", $("#paly-btn").attr("href")+"?id="+id);
    var sharehtml=$.ajax({ type:"GET", url:"system/share.html", async:false }); $("#share").html(sharehtml.responseText);
</script>
</body>
</html>