vor 4 Jahren · da19dfb5d9
--- a/app.min.js
+++ b/app.min.js
--- a/index2.min.js
+++ b/index2.min.js
--- a/nanimages/0.png
+++ b/nanimages/0.png
--- a/nanimages/auto_rotation.png
+++ b/nanimages/auto_rotation.png
--- a/nanimages/auto_rotation@2x.png
+++ b/nanimages/auto_rotation@2x.png
--- a/nanimages/auto_rotation_click.png
+++ b/nanimages/auto_rotation_click.png
--- a/nanimages/auto_rotation_click@2x.png
+++ b/nanimages/auto_rotation_click@2x.png
--- a/nanimages/bg.png
+++ b/nanimages/bg.png
--- a/nanimages/bg1280.jpg
+++ b/nanimages/bg1280.jpg
--- a/nanimages/bg@2x.png
+++ b/nanimages/bg@2x.png
--- a/nanimages/direction.png
+++ b/nanimages/direction.png
--- a/nanimages/direction_board.png
+++ b/nanimages/direction_board.png
--- a/nanimages/direction_board@2.png
+++ b/nanimages/direction_board@2.png
--- a/nanimages/direction_bottom.png
+++ b/nanimages/direction_bottom.png
--- a/nanimages/direction_bottom@2x.png
+++ b/nanimages/direction_bottom@2x.png
--- a/nanimages/direction_bottom_disable.png
+++ b/nanimages/direction_bottom_disable.png
--- a/nanimages/direction_bottom_disable@2x.png
+++ b/nanimages/direction_bottom_disable@2x.png
--- a/nanimages/direction_left.png
+++ b/nanimages/direction_left.png
--- a/nanimages/direction_left@2x.png
+++ b/nanimages/direction_left@2x.png
--- a/nanimages/direction_left_disable.png
+++ b/nanimages/direction_left_disable.png
--- a/nanimages/direction_left_disable@2x.png
+++ b/nanimages/direction_left_disable@2x.png
--- a/nanimages/direction_right.png
+++ b/nanimages/direction_right.png
--- a/nanimages/direction_right@2x.png
+++ b/nanimages/direction_right@2x.png
--- a/nanimages/direction_right_disable.png
+++ b/nanimages/direction_right_disable.png
--- a/nanimages/direction_right_disable@2x.png
+++ b/nanimages/direction_right_disable@2x.png
--- a/nanimages/direction_top.png
+++ b/nanimages/direction_top.png
--- a/nanimages/direction_top@2x.png
+++ b/nanimages/direction_top@2x.png
--- a/nanimages/direction_top_disable.png
+++ b/nanimages/direction_top_disable.png
--- a/nanimages/direction_top_disable@2x.png
+++ b/nanimages/direction_top_disable@2x.png
--- a/nanimages/direction_walk.png
+++ b/nanimages/direction_walk.png
--- a/nanimages/direction_walk@2x.png
+++ b/nanimages/direction_walk@2x.png
--- a/nanimages/play4.png
+++ b/nanimages/play4.png
--- a/nanimages/play4@2x.png
+++ b/nanimages/play4@2x.png
--- a/nanimages/play4@3x.png
+++ b/nanimages/play4@3x.png
--- a/nanimages/play_click.png
+++ b/nanimages/play_click.png
--- a/nanimages/play_click@2x.png
+++ b/nanimages/play_click@2x.png
--- a/nanimages/play_click@3x.png
+++ b/nanimages/play_click@3x.png
--- a/nanimages/rang_1201.png
+++ b/nanimages/rang_1201.png
--- a/nanimages/rang_1201@2x.png
+++ b/nanimages/rang_1201@2x.png
--- a/nanimages/rangle.png
+++ b/nanimages/rangle.png
--- a/nanimages/rangle@2x.png
+++ b/nanimages/rangle@2x.png
--- a/nanimages/yao0.png
+++ b/nanimages/yao0.png
--- a/nanimages/zoomin.png
+++ b/nanimages/zoomin.png
--- a/nanimages/zoomin@2x.png
+++ b/nanimages/zoomin@2x.png
--- a/nanimages/zoomin_click.png
+++ b/nanimages/zoomin_click.png
--- a/nanimages/zoomin_click@2x.png
+++ b/nanimages/zoomin_click@2x.png
--- a/nanimages/zoomout.png
+++ b/nanimages/zoomout.png
--- a/nanimages/zoomout@2x.png
+++ b/nanimages/zoomout@2x.png
--- a/nanimages/zoomout_click.png
+++ b/nanimages/zoomout_click.png
--- a/nanimages/zoomout_click@2x.png
+++ b/nanimages/zoomout_click@2x.png
--- a/nanimages/标志
+++ b/nanimages/标志
--- a/nanjing.html
+++ b/nanjing.html
@@ -0,0 +1,118 @@
 
				+<!DOCTYPE html>
			
 
				+
			
 
				+<html>
			
 
				+
			
 
				+<head>
			
 
				+    <title>南京世茂项目</title>
			
 
				+    <script src="./js/tvSysBtnBind.v2.1.js"></script>
			
 
				+
			
 
				+    <meta charset="utf-8">
			
 
				+    <link rel="stylesheet" href="nanstyle.css">
			
 
				+
			
 
				+    <style>
			
 
				+        #debug{
			
 
				+            display: none;
			
 
				+            position: absolute;
			
 
				+            top: 20px;
			
 
				+            left: 10px;
			
 
				+            color: #ffff00;
			
 
				+        }
			
 
				+
			
 
				+    </style>
			
 
				+</head>
			
 
				+
			
 
				+<script>
			
 
				+    var deviceWidth = parseInt(window.screen.width);  //获取当前设备的屏幕宽度
			
 
				+    var deviceScale = deviceWidth / 1280;  //得到当前设备屏幕与640之间的比例，之后我们就可以将网页宽度固定为640px
			
 
				+    var ua = navigator.userAgent;
			
 
				+    //获取当前设备类型（安卓或苹果）
			
 
				+    if (/Android (\d+\.\d+)/.test(ua)) {
			
 
				+        var version = parseFloat(RegExp.$1);
			
 
				+        if (version > 2.3) {
			
 
				+            document.write('<meta name="viewport" content="width=1280,initial-scale=' + deviceScale + ', minimum-scale = ' + deviceScale + ', maximum-scale = ' + deviceScale + ', target-densitydpi=device-dpi">');
			
 
				+        } else {
			
 
				+            document.write('<meta name="viewport" content="width=1280,initial-scale=0.75,maximum-scale=0.75,minimum-scale=0.75,target-densitydpi=device-dpi" />');
			
 
				+        }
			
 
				+    } else {
			
 
				+        document.write('<meta name="viewport" content="width=1280, user-scalable=no">');
			
 
				+    }
			
 
				+</script>
			
 
				+
			
 
				+<body id="Jdoc">
			
 
				+
			
 
				+    <!-- 用来保存输出结果 -->
			
 
				+    <div id="container">
			
 
				+    </div>
			
 
				+
			
 
				+    <div class="navigation">
			
 
				+        <div style="position:relative">
			
 
				+            <div id='map'><img id="map_img" class="map_img" src="panos/HomeHouseMap.png"/></div>
			
 
				+            <div id='cam'><img class="cam_img" src="panos/HomePoint.png"/></div>
			
 
				+            <div id='redPoints'>
			
 
				+            </div>
			
 
				+        </div>
			
 
				+            
			
 
				+    </div>
			
 
				+
			
 
				+
			
 
				+
			
 
				+    <!-- <div id="tip">Walking...</div> -->
			
 
				+
			
 
				+    <!-- <div id="menuTip"> 单击“OK”键，唤起菜单 </div>
			
 
				+    <div id="menuTitle">fff</div> -->
			
 
				+
			
 
				+    <!-- <div id="menuControl"> 
			
 
				+        <div class="menu_control_item">
			
 
				+            <img id="auto_rotation" src="yaoimages/auto_rotation.png" />
			
 
				+            <div id="rotation_title">自动旋转</div>
			
 
				+        </div>
			
 
				+        <div class="menu_control_item">
			
 
				+            <img id="zoom" src="yaoimages/zoomin.png" />
			
 
				+            <div id="zoom_title" >放大</div>
			
 
				+        </div>
			
 
				+    </div>
			
 
				+
			
 
				+    <div id="wholeDirection">
			
 
				+        <div id="directionTop">阳台</div>
			
 
				+        <div class="directionCenter">
			
 
				+            <div id="directionLeft">房间</div>
			
 
				+            <div id="directionControl"> 
			
 
				+                <div id='direct_top'><div><img id='direct_top_img' src='yaoimages/direction_top.png'></div><div>1</div></div>
			
 
				+                <div class="direct_center">
			
 
				+                    <div id='direct_left'><div><img id='direct_left_img' src='yaoimages/direction_left.png'></div><div>2</div></div>
			
 
				+                    <div id='direct_right'><div>4</div><div><img id='direct_right_img' src='yaoimages/direction_right.png'></div></div>
			
 
				+                </div>
			
 
				+                <div id='direct_bottom'><div>3</div><div><img id='direct_bottom_img' src='yaoimages/direction_bottom.png'></div></div>
			
 
				+            </div>
			
 
				+            <div id="directionRight">花园</div>
			
 
				+        </div>
			
 
				+
			
 
				+        
			
 
				+        <div id="directionBottom">露台</div>
			
 
				+    </div>
			
 
				+    
			
 
				+
			
 
				+    <div id='direction_top_tip'><img id='direct_top_tip_img' src='yaoimages/direction_top.png'></div> -->
			
 
				+
			
 
				+    
			
 
				+    <div id='menu'>
			
 
				+        <div class="pano">
			
 
				+            <div class="title"></div>
			
 
				+            <div class="thumb"><img src='panos/01frontGate4k_b.jpg' /></div>
			
 
				+        </div>
			
 
				+    </div>
			
 
				+
			
 
				+    <div id='debug'></div>
			
 
				+
			
 
				+
			
 
				+
			
 
				+    <div class="ctrlBtn"></div>
			
 
				+
			
 
				+   <script src="app.min.js"></script> 
			
 
				+
			
 
				+    <script type="text/javaScript">
			
 
				+
			
 
				+    </script>
			
 
				+</body>
			
 
				+
			
 
				+</html>
			
--- a/nanstyle.css
+++ b/nanstyle.css
@@ -0,0 +1,588 @@
 
				+html,body{
			
 
				+    height:100%;
			
 
				+    width: 100%;
			
 
				+}
			
 
				+
			
 
				+body {
			
 
				+    /* set margin to 0 and overflow to hidden, to go fullscreen */
			
 
				+    margin: 0;
			
 
				+    overflow: hidden;
			
 
				+    /* background-image: url('./nanimages/bg@2x.png');
			
 
				+    background-size:cover; */
			
 
				+    color:#ffffff;
			
 
				+    font-family:  "Microsoft YaHei";  
			
 
				+    /* width: 120vw; */
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+.navigation{
			
 
				+    display: flex;
			
 
				+    z-index: 10;
			
 
				+    position: fixed;
			
 
				+    top:15px;
			
 
				+    right:15px;
			
 
				+    user-select: none;
			
 
				+    -moz-user-select: none;
			
 
				+    -khtml-user-select: none;
			
 
				+    -webkit-user-select: none;
			
 
				+    -o-user-select: none;
			
 
				+    
			
 
				+    /* flex-direction: column;
			
 
				+    align-items: center; */
			
 
				+}
			
 
				+
			
 
				+.navigation .map_img{
			
 
				+    width: 128px;
			
 
				+    height: 128px;
			
 
				+}
			
 
				+
			
 
				+#map{
			
 
				+    position: absolute;
			
 
				+    /* z-index: 11;
			
 
				+    top:32px; */
			
 
				+    right:15px;
			
 
				+}
			
 
				+#cam{
			
 
				+    position: absolute;
			
 
				+    /* z-index: 12; */
			
 
				+    /* top:32px; */
			
 
				+    right:15px;
			
 
				+    /* transform: rotate(180deg); */
			
 
				+}
			
 
				+
			
 
				+#redPoints{
			
 
				+    position: relative;
			
 
				+    right:15px;
			
 
				+}
			
 
				+
			
 
				+.navigation .cam_img{
			
 
				+    width: 32px;
			
 
				+    height: 32px;
			
 
				+}
			
 
				+
			
 
				+.navigation .point_img{
			
 
				+    width: 8px;
			
 
				+    height: 8px;
			
 
				+}
			
 
				+
			
 
				+#tip{
			
 
				+    position: absolute;
			
 
				+    right:15px;
			
 
				+    bottom: 15px;
			
 
				+    color: gray;
			
 
				+    display: none;
			
 
				+}
			
 
				+
			
 
				+#menuTip{
			
 
				+    position: absolute;
			
 
				+    left:20px;
			
 
				+    bottom: 20px;
			
 
				+    color: gray;
			
 
				+    display: flex;
			
 
				+    /* transform: translate(-50%,-50%); */
			
 
				+    font-size: 26px;
			
 
				+}
			
 
				+
			
 
				+#menuTitle{
			
 
				+    position: absolute;
			
 
				+    left:24px;
			
 
				+    top: 23px;
			
 
				+    color: #ffffff;
			
 
				+    display: none;
			
 
				+    /* transform: translate(-50%,-50%); */
			
 
				+    font-size: 27px;
			
 
				+}
			
 
				+
			
 
				+#menu{
			
 
				+    position: absolute;
			
 
				+    z-index: 9;
			
 
				+    display: none;
			
 
				+    bottom: 0px;
			
 
				+    width: 100%; 
			
 
				+    overflow: auto;
			
 
				+    background-color: rgba(0,0,0,0);
			
 
				+}
			
 
				+
			
 
				+#menu .pano{
			
 
				+    position: relative;
			
 
				+    /* margin: 10px; */
			
 
				+    cursor: pointer;
			
 
				+
			
 
				+    
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+#menu .panoEnd{
			
 
				+    display: flex;
			
 
				+    justify-content: flex-end;
			
 
				+    align-items: flex-end;
			
 
				+}
			
 
				+
			
 
				+#menu .panoSelect{
			
 
				+    position: relative;
			
 
				+    /* margin: 10px; */
			
 
				+    cursor: pointer;
			
 
				+    /* background-color: violet; */
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+#menu .pano .title,#menu .panoSelect .title{
			
 
				+    position: absolute;
			
 
				+    top: 180px;
			
 
				+    left: 50%;
			
 
				+    transform: translate(-50%,0%);
			
 
				+    font-size: 16px;
			
 
				+    width: 273px;
			
 
				+    color: #ffffff;
			
 
				+    overflow: hidden;
			
 
				+    max-width: 270px;
			
 
				+    text-overflow: ellipsis;
			
 
				+    white-space: nowrap;
			
 
				+    text-align: center;
			
 
				+
			
 
				+
			
 
				+}
			
 
				+
			
 
				+#menu .panoSelect .thumb {
			
 
				+    width:327px;
			
 
				+    height:233px;
			
 
				+    background-image: url('./nanimages/rangle.png');
			
 
				+    background-size: cover;
			
 
				+    display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+
			
 
				+#menu .pano .thumb{
			
 
				+
			
 
				+    width:327px;
			
 
				+    height:233px;
			
 
				+    background-size: cover;
			
 
				+    display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+
			
 
				+
			
 
				+
			
 
				+#menu .pano .thumb img,#menu .panoSelect .thumb img{
			
 
				+    width:273px;
			
 
				+    height:180px;
			
 
				+    margin-left: 5px;
			
 
				+    margin-top: 9px;
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+#menuControl{
			
 
				+    position: absolute;
			
 
				+    display: none;
			
 
				+    top: 220px;
			
 
				+    left: 33px;
			
 
				+    width: 89px;
			
 
				+    height: 177px;
			
 
				+    color: #fffff0;
			
 
				+    font-family: MicrosoftYaHei;
			
 
				+    justify-content: space-around;
			
 
				+    flex-direction: column;
			
 
				+}
			
 
				+
			
 
				+.menu_control_item{
			
 
				+    text-align: center;
			
 
				+    font-size: 20px;
			
 
				+}
			
 
				+#rotation_title,
			
 
				+#zoom_title{
			
 
				+    height:26px;
			
 
				+}
			
 
				+
			
 
				+#auto_rotation,
			
 
				+#zoom{
			
 
				+    width: 53px;
			
 
				+    height: 53px;
			
 
				+}
			
 
				+
			
 
				+#wholeDirection{
			
 
				+    position: absolute;
			
 
				+    display: flex;
			
 
				+    bottom: 20px;
			
 
				+    right: 10px;
			
 
				+    /* width: 141px;
			
 
				+    height: 140px; */
			
 
				+    color: #ffffff;
			
 
				+    font-family: MicrosoftYaHei;
			
 
				+    justify-content: space-around;
			
 
				+    flex-direction: column;
			
 
				+}
			
 
				+
			
 
				+#wholeDirection .directionCenter{
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    margin: 0px 10px;
			
 
				+}
			
 
				+
			
 
				+#directionControl{
			
 
				+    /* position: absolute; */
			
 
				+    display: flex;
			
 
				+    bottom: 30px;
			
 
				+    right: 30px;
			
 
				+    width: 141px;
			
 
				+    height: 140px;
			
 
				+    color: #ffffff;
			
 
				+    font-family: MicrosoftYaHei;
			
 
				+    justify-content: space-around;
			
 
				+    flex-direction: column;
			
 
				+    background-image: url('nanimages/direction_board.png');
			
 
				+    background-size: cover;
			
 
				+
			
 
				+}
			
 
				+
			
 
				+#directionControl img{
			
 
				+    width: 15px;
			
 
				+    height: 14px;
			
 
				+}
			
 
				+
			
 
				+#direct_top,
			
 
				+#direct_bottom{
			
 
				+    display: flex;
			
 
				+    justify-content: center;
			
 
				+    flex-direction: column;
			
 
				+    align-items: center;
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+#direct_left,
			
 
				+#direct_right{
			
 
				+    display: flex;
			
 
				+    justify-content: center;
			
 
				+    align-items: center;
			
 
				+}
			
 
				+
			
 
				+#direct_left div,
			
 
				+#direct_right div{
			
 
				+    margin: 0px 2px;
			
 
				+}
			
 
				+
			
 
				+.direct_center{
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    margin: 0px 10px;
			
 
				+}
			
 
				+
			
 
				+#directionTop,
			
 
				+#directionBottom{
			
 
				+    display: flex;
			
 
				+    justify-content: center;
			
 
				+    align-items: center;
			
 
				+    margin: 2px 0px;
			
 
				+    height: 21px;
			
 
				+}
			
 
				+
			
 
				+#directionLeft{
			
 
				+    display: flex;
			
 
				+    justify-content: flex-end;
			
 
				+    align-items: center;
			
 
				+    margin: 0px 2px;
			
 
				+    width: 48px;
			
 
				+    text-align: center;
			
 
				+}
			
 
				+
			
 
				+#directionRight{
			
 
				+    display: flex;
			
 
				+    justify-content: flex;
			
 
				+    align-items: center;
			
 
				+    margin: 0px 2px;
			
 
				+    width: 48px;
			
 
				+    text-align: center;
			
 
				+}
			
 
				+
			
 
				+#direction_top_tip{
			
 
				+    display: flex;
			
 
				+    position: absolute;
			
 
				+    top: 10px;
			
 
				+    left: 50%;
			
 
				+}
			
 
				+
			
 
				+/* --------------------------------------------------------------------- */
			
 
				+.home{
			
 
				+    display: flex;
			
 
				+    flex-direction: column;
			
 
				+    margin-left: 39px;
			
 
				+    /* margin-top: 30px; */
			
 
				+}
			
 
				+
			
 
				+.home .preview{
			
 
				+    display: flex;
			
 
				+    height: 40%;
			
 
				+}
			
 
				+
			
 
				+.home .detail{
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+.home .detail .detailtitle{
			
 
				+    display: flex;
			
 
				+    align-items: center;
			
 
				+
			
 
				+    margin-top: 37px ;
			
 
				+    margin-bottom: 27px ;
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+
			
 
				+.home .detail .titlelogo{
			
 
				+    width: 5px;
			
 
				+    height: 33px;
			
 
				+    background-color: #316FEE;
			
 
				+}
			
 
				+
			
 
				+.home .detail .title{
			
 
				+    font-size: 30px;
			
 
				+    margin-left: 15px ;
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+.home .detail .thumb{
			
 
				+    /* width:480px;
			
 
				+    height:360px; */
			
 
				+    /* max-width: 50%;
			
 
				+    max-height: 50%; */
			
 
				+
			
 
				+}
			
 
				+
			
 
				+.home .detail .thumb img{
			
 
				+    width: 600px;
			
 
				+    height: 334px;
			
 
				+
			
 
				+}
			
 
				+
			
 
				+.home .descript{
			
 
				+    margin-top: 94px;
			
 
				+    margin-left: 25px;
			
 
				+    min-width: 588px;
			
 
				+    max-height: 345px;
			
 
				+    display: flex;
			
 
				+    flex-direction: column;
			
 
				+    justify-content: space-between;
			
 
				+}
			
 
				+
			
 
				+#descriptTitle{
			
 
				+    font-size: 33px;
			
 
				+    margin-bottom: 10px;
			
 
				+}
			
 
				+
			
 
				+#descriptContent{
			
 
				+    font-size: 21px;
			
 
				+    font-weight: Light;
			
 
				+    font-weight: lighter;
			
 
				+    line-height: 34px;
			
 
				+    max-width: 570px;
			
 
				+
			
 
				+}
			
 
				+
			
 
				+.home .descript .play{
			
 
				+    display: flex;
			
 
				+    position: relative;
			
 
				+    /* top: 40%; */
			
 
				+    /* background-color: #384071; */
			
 
				+    background-image: url('nanimages/play4.png');
			
 
				+    background-size: cover;
			
 
				+    width: 135px;
			
 
				+    height: 81px;
			
 
				+    justify-content: center;
			
 
				+    align-items: center;
			
 
				+    font-size: 20px;
			
 
				+    color: #ffffff;
			
 
				+    /* transform:translate(0,-50%); */
			
 
				+    cursor: pointer;
			
 
				+    flex-direction: column;
			
 
				+    
			
 
				+} 
			
 
				+
			
 
				+.home .descript .playlogo{
			
 
				+    width:0px;  
			
 
				+    height:0px;  
			
 
				+    border:13px solid transparent;
			
 
				+    border-left:24px solid #ffffff;
			
 
				+    transform: translate(6px, -6px);
			
 
				+}
			
 
				+
			
 
				+.home .descript .playSelect{
			
 
				+    display: flex;
			
 
				+    position: relative;
			
 
				+    /* top: 40%; */
			
 
				+    background-color: #1F81FE;
			
 
				+    width: 135px;
			
 
				+    height: 81px;
			
 
				+    justify-content: center;
			
 
				+    align-items: center;
			
 
				+    font-size: 20px;
			
 
				+    color: #ffffff;
			
 
				+    /* transform:translate(0,-50%); */
			
 
				+    cursor: pointer;
			
 
				+    flex-direction: column;
			
 
				+} 
			
 
				+
			
 
				+#listTitle{
			
 
				+    font-size: 23px;
			
 
				+    margin-left: 42px;
			
 
				+    margin-top:32px;
			
 
				+    margin-bottom: -10px;
			
 
				+    /* margin: 30px 30px 10px 30px; */
			
 
				+}
			
 
				+
			
 
				+#listContent{
			
 
				+    /* position: absolute;
			
 
				+    z-index: 9;
			
 
				+    display: flex;
			
 
				+    bottom: 0px;
			
 
				+    width: 100%; 
			
 
				+    overflow: auto;
			
 
				+    background-color: #eaeee3; */
			
 
				+
			
 
				+        /* position: absolute; */
			
 
				+    /* z-index: 9; */
			
 
				+    display: flex;
			
 
				+    bottom: 0px;
			
 
				+    width: 100vw;
			
 
				+    margin-left: 20px;
			
 
				+    /* margin-right: 30px; */
			
 
				+    /* height: 184px; */
			
 
				+    overflow: auto;
			
 
				+    background-color: rgba(0,0,0,0);
			
 
				+    /* min-width: 1280px; */
			
 
				+    width: calc( 1280px - 20px);
			
 
				+
			
 
				+
			
 
				+    /* display: flex;
			
 
				+    margin-top: 60px;
			
 
				+    margin-left: 30px;
			
 
				+    margin-right: 30px;
			
 
				+    height: 300px;
			
 
				+    overflow: auto;
			
 
				+    background-color: #eaeee3; */
			
 
				+}
			
 
				+
			
 
				+#listContent .pano{
			
 
				+    position: relative;
			
 
				+    /* margin: 0px 16px; */
			
 
				+    cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+
			
 
				+#listContent .panoEnd{
			
 
				+    /* display: flex;
			
 
				+    justify-content: flex-end;
			
 
				+    align-items: flex-end; */
			
 
				+    margin: 30px;
			
 
				+}
			
 
				+
			
 
				+#listContent .panoSelect{
			
 
				+     position: relative;
			
 
				+     background-image: url('./nanimages/rangle.png');
			
 
				+     background-size: cover;
			
 
				+    /*margin: 0px 16px;
			
 
				+    cursor: pointer;
			
 
				+    height: 184px;
			
 
				+    background-color: #ff00f2; */
			
 
				+}
			
 
				+
			
 
				+#listContent .pano .title,#listContent .panoSelect .title{
			
 
				+    /* position: absolute;
			
 
				+    top:50%;
			
 
				+    left:50%;
			
 
				+    transform:translate(-50%,-50%);
			
 
				+    font-size: 18px;
			
 
				+    width: 120px;
			
 
				+    display: flex;
			
 
				+    justify-content: center;
			
 
				+    align-items: center;
			
 
				+    overflow: hidden;
			
 
				+    text-overflow: ellipsis;
			
 
				+    white-space: nowrap; */
			
 
				+
			
 
				+    /* position: absolute;
			
 
				+    top: 156px;
			
 
				+    font-size: 16px;
			
 
				+    width: 273px;
			
 
				+    color: #ffffff;
			
 
				+    overflow: hidden;
			
 
				+    text-overflow: ellipsis;
			
 
				+    white-space: nowrap;
			
 
				+    display: flex;
			
 
				+    justify-content: center; */
			
 
				+
			
 
				+    position: absolute;
			
 
				+    top: 176px;
			
 
				+    left: 50%;
			
 
				+    transform: translate(-50%,0%);
			
 
				+    font-size: 16px;
			
 
				+    width: 273px;
			
 
				+    color: #ffffff;
			
 
				+    overflow: hidden;
			
 
				+    max-width: 270px;
			
 
				+    text-overflow: ellipsis;
			
 
				+    white-space: nowrap;
			
 
				+    text-align: center;
			
 
				+
			
 
				+
			
 
				+}
			
 
				+
			
 
				+#listContent .pano .thumb,#listContent .panoSelect .thumb{
			
 
				+    
			
 
				+    /* height:100%;
			
 
				+    width:100%;
			
 
				+    min-width:150px;
			
 
				+    max-width:200px;
			
 
				+    min-height:120px;
			
 
				+    max-height:150px; */
			
 
				+    /* width:277px;
			
 
				+    height: 184px;
			
 
				+    display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center; */
			
 
				+
			
 
				+    width:327px;
			
 
				+    height:233px;
			
 
				+    
			
 
				+    display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+   
			
 
				+}
			
 
				+
			
 
				+#listContent .pano .thumb img,#listContent .panoSelect .thumb img{
			
 
				+    /* height:97%;
			
 
				+    width:100%;
			
 
				+    min-height:120px;
			
 
				+    max-height:200px; */
			
 
				+    width:273px;
			
 
				+    height: 180px;
			
 
				+    margin-top: 8px;
			
 
				+    margin-left: 5px;
			
 
				+    
			
 
				+}
			
 
				+
			
 
				+
			
 
				+*::-webkit-scrollbar {
			
 
				+    /*滚动条整体样式*/
			
 
				+    width: 1px;/*定义纵向滚动条宽度*/
			
 
				+    height: 1px;/*定义横向滚动条高度*/
			
 
				+    display: none;
			
 
				+}
			
 
				+
			
 
				+*::-webkit-scrollbar-thumb {
			
 
				+    /*滚动条内部滑块*/
			
 
				+    border-radius: 1px;
			
 
				+    background-color: hsla(220, 4%, 58%, 0.3);
			
 
				+    transition: background-color 0.3s;
			
 
				+}
			
 
				+
			
 
				+*::-webkit-scrollbar-thumb:hover {
			
 
				+    /*鼠标悬停滚动条内部滑块*/
			
 
				+    background: #bbb;
			
 
				+}
			
 
				+
			
 
				+*::-webkit-scrollbar-track {
			
 
				+    /*滚动条内部轨道*/
			
 
				+    background: #ededed;
			
 
				+}
			
--- a/pano3.html
+++ b/pano3.html
@@ -3,12 +3,12 @@
 
				 <html>
			
 
				 
			
 
				 <head>
			
 
				-    <title>vr house</title>
			
 
				+    <title>南京世茂项目</title>
			
 
				 
			
 
				     <script src="./js/tvSysBtnBind.v2.1.js"></script>
			
 
				     <meta charset="utf-8">
			
 
				     <meta name="page-view-size" content="1280*720" />
			
 
				-    <link rel="stylesheet" href="style.css">
			
 
				+    <link rel="stylesheet" href="nanstyle.css">
			
 
				 
			
 
				 
			
 
				 
			
@@ -18,7 +18,7 @@
 
				             /* set margin to 0 and overflow to hidden, to go fullscreen */
			
 
				             margin: 0;
			
 
				             overflow: hidden;
			
 
				-            background: url('./images/bg1280.jpg') center no-repeat;
			
 
				+            background: url('./nanimages/bg1280.jpg') center no-repeat;
			
 
				             background-size:100% 100%;
			
 
				             color:#ffffff;
			
 
				             font-family:  "Microsoft YaHei";  
			
@@ -81,18 +81,19 @@
 
				                     <div class="titlelogo"></div>
			
 
				                     <div class="title">内容详情</div>
			
 
				                 </div>
			
 
				-                <div class='thumb'><img id="cover" data-id='0' src="./images/0.png"/></div>
			
 
				+                <div class='thumb'><img id="cover" data-id='0' src="./nanimages/0.png"/></div>
			
 
				             </div>
			
 
				 
			
 
				             <div class="descript">
			
 
				                 <div class="content">
			
 
				-                    <div id="descriptTitle">圣彼得堡</div>
			
 
				+                    <div id="descriptTitle">南京世茂项目</div>
			
 
				                     <div id="descriptContent">简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...</div>
			
 
				                 </div>
			
 
				                 
			
 
				                 <div id="play" class='play'>
			
 
				-                    <div class='playlogo'></div>
			
 
				-                    播放
			
 
				+                    <!-- <div class='playlogo'></div>
			
 
				+                    播放 -->
			
 
				+                    
			
 
				                 </div>
			
 
				             </div>
			
 
				         </div>
			
@@ -114,7 +115,8 @@
 
				 
			
 
				     <div class="ctrlBtn"></div>
			
 
				 
			
 
				-    <script src="index2.min.js"></script> 
			
 
				+
			
 
				+    <script src="index2.min.js"></script>
			
 
				 
			
 
				     <script type="text/javaScript">
			
 
				 
			
--- a/pano4.html
+++ b/pano4.html
@@ -1,70 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-
			
 
				-<html>
			
 
				-
			
 
				-<head>
			
 
				-    <title>vr house</title>
			
 
				-    <script src="./js/tvSysBtnBind.v2.1.js"></script>
			
 
				-
			
 
				-    <meta charset="utf-8">
			
 
				-    <link rel="stylesheet" href="style.css">
			
 
				-
			
 
				-    <style>
			
 
				-        #debug{
			
 
				-            display: none;
			
 
				-            position: absolute;
			
 
				-            top: 20px;
			
 
				-            left: 10px;
			
 
				-            color: #ffff00;
			
 
				-        }
			
 
				-
			
 
				-    </style>
			
 
				-</head>
			
 
				-
			
 
				-<body id="Jdoc">
			
 
				-
			
 
				-    <!-- 用来保存输出结果 -->
			
 
				-    <div id="container">
			
 
				-    </div>
			
 
				-
			
 
				-    <div class="navigation">
			
 
				-        <div style="position:relative">
			
 
				-            <div id='map'><img id="map_img" class="map_img" src="panos/HomeHouseMap.png"/></div>
			
 
				-            <div id='cam'><img class="cam_img" src="panos/HomePoint.png"/></div>
			
 
				-            <div id='redPoints'>
			
 
				-                <!-- <img id='Li' class="point_img" src="panos/redPoint.png"/> -->
			
 
				-            </div>
			
 
				-        </div>
			
 
				-            
			
 
				-    </div>
			
 
				-
			
 
				-
			
 
				-
			
 
				-    <div id="tip">Walking...</div>
			
 
				-
			
 
				-    <div id="menuTip"> 单击“返回/OK”键全景观赏当前图片 </div>
			
 
				-    <div id="menuTitle">fff</div>
			
 
				-
			
 
				-    <div id='menu'>
			
 
				-
			
 
				-        <div class="pano">
			
 
				-            <div class="title">ddd</div>
			
 
				-            <div class="thumb"><img src='panos/01frontGate4k_b.jpg' /></div>
			
 
				-        </div>
			
 
				-    </div>
			
 
				-
			
 
				-    <div id='debug'></div>
			
 
				-
			
 
				-
			
 
				-
			
 
				-    <div class="ctrlBtn"></div>
			
 
				-
			
 
				-
			
 
				-    <script src="app.min.js"></script> 
			
 
				-
			
 
				-    <script type="text/javaScript">
			
 
				-
			
 
				-    </script>
			
 
				-</body>
			
 
				-
			
 
				-</html>