sdfdccc

index2.js

@@ -1,427 +0,0 @@
-
-var isUserInteracting = false,
-onMouseDownMouseX = 0,
-onMouseDownMouseY = 0,
-lon = 0,
-onMouseDownLon = 0,
-lat = 0,
-onMouseDownLat = 0,
-phi = 0,
-theta = 0;
-
-const house ={
-    idx:0,
-    nextId:null,
-    title:'南京世茂项目',
-    descript:'世茂天誉为城市综合体项目，主要包括约15万方集八大主题亮点商业、11万方的顶级酒店服务式公寓、15万方5A超甲级写字楼+五星级酒店，以及13万方高端住宅。\
-    NO.2016G11地块东至云锦路，南至国有空地，西至江东中路，北至集庆门大街，出让面积：62699.92㎡，地下出让面积4472.12㎡，规划用地性质：R21住宅用地，Bb商办混合用地。',
-    // img:'./panosimages/0.png',
-    src:[
-    
-        {id:1,name:"01frontGate",title:'01正门',thumb:"panos/01frontGate_b.jpg",descript:'简介:01正门于俄罗斯北部，波罗的海沿岸...'},
-    {id:2,name:"02masterBedroom",title:'02主卧',thumb:"panos/02masterBedroom_b.jpg",descript:'简介:02主卧位于俄罗斯北部，波罗的海沿岸...'},
-    {id:3,name:"03masterBedroom",title:'03主卧',thumb:"panos/03masterBedroom_b.jpg",descript:'简介:03主卧位于俄罗斯北部，波罗的海沿岸...'},
-    {id:4,name:"04masterBedroom",title:'04主卧',thumb:"panos/04masterBedroom_b.jpg",descript:'简介:04主卧于俄罗斯北部，波罗的海沿岸...'},
-    {id:5,name:"05masterBedroomToilet",title:'05主卧卫生间',thumb:"panos/05masterBedroomToilet_b.jpg",descript:'简介:05主卧卫生间位于俄罗斯北部，波罗的海沿岸...'},
-    {id:6,name:"06masterBedroomPorch",title:'06主卧门廊',thumb:"panos/06masterBedroomPorch_b.jpg",descript:'简介:06主卧门廊位于俄罗斯北部，波罗的海沿岸...'},
-    {id:7,name:"07masterBedroomCloakroom",title:'07主卧衣帽间',thumb:"panos/07masterBedroomCloakroom_b.jpg",descript:'简介:07主卧衣帽间位于俄罗斯北部，波罗的海沿岸...'},
-    {id:8,name:"08AguestRoom",title:'08客房',home:{T:90,R:100},thumb:"panos/08AguestRoom_b.jpg",descript:'简介:08客房于俄罗斯北部，波罗的海沿岸...'},
-    {id:9,name:"09guestRoomA",title:'09客房A',home:{T:80,R:90},thumb:"panos/09guestRoomA_b.jpg",descript:'简介:09客房A于俄罗斯北部，波罗的海沿岸...'},
-    {id:10,name:"10guestRoomAToilet",title:'10客房卫生间',home:{T:70,R:100},thumb:"panos/10guestRoomAToilet_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:11,name:"11guestRoomB",title:'11客房B',home:{T:85,R:70},thumb:"panos/11guestRoomB_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:12,name:"12guestRoomB",title:'12客房B',home:{T:80,R:60},thumb:"panos/12guestRoomB_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:13,name:"13guestRoomB",title:'13客房B',home:{T:95,R:70},thumb:"panos/13guestRoomB_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:14,name:"14livingRoom",title:'14客厅',home:{T:20,R:70},thumb:"panos/14livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:15,name:"15livingRoom",title:'15客厅',home:{T:30,R:50},thumb:"panos/15livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:16,name:"16livingRoom",title:'16客厅',home:{T:20,R:50},thumb:"panos/16livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:17,name:"17livingRoom",title:'17客厅',home:{T:8,R:60},thumb:"panos/17livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:18,name:"18livingRoom",title:'18客厅',home:{T:8,R:40},thumb:"panos/18livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:19,name:"19livingRoom",title:'19客厅',home:{T:8,R:50},thumb:"panos/19livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:20,name:"20livingRoom",title:'20客厅',home:{T:40,R:45},thumb:"panos/20livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:21,name:"21livingRoom",title:'21客厅',home:{T:42,R:55},thumb:"panos/21livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:22,name:"22livingRoom",title:'22客厅',home:{T:23,R:20},thumb:"panos/22livingRoom_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:23,name:"23kitchen",title:'23厨房',home:{T:-5,R:65},thumb:"panos/23kitchen_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:24,name:"24laundry",title:'24洗衣间',home:{T:-5,R:40},thumb:"panos/24laundry_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-    {id:25,name:"25frontGatePorch",title:'25前门门廊',home:{T:65,R:75},thumb:"panos/25frontGatePorch_b.jpg",descript:'简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...'},
-],
-
-} 
-
-
-init()
-
-
-function init(){
-
-
-    const queryString = window.location.search;
-
-    const urlParams = new URLSearchParams(queryString);
-
-    let pano_Id = urlParams.get('id')?urlParams.get('id'):-1
-
-    let backurl= urlParams.get('backurl')?urlParams.get('backurl'):'../'
-
-    let panoId = pano_Id>house.src.length?house.src.length-1:pano_Id
-
-    const descriptContent=document.getElementById("descriptContent");
-        descriptContent.innerHTML = limitWords(house.descript)
-    
-
-    if(panoId!==-1){
-        // document.getElementById('descriptTitle').innerHTML = house.src[panoId].title
-        // document.getElementById('descriptContent').innerHTML = limitWords(house.src[panoId].descript)
-
-        // update conver
-        const conver = document.getElementById('cover')
-        // conver.src='./panos/'+house.src[panoId].name +"4k_f.jpg"
-        conver.setAttribute('data-id',panoId)
-        conver.setAttribute('data-backurl',backurl)
-    }else{
-
-        panoId  =0
-        // const descriptTitle=document.getElementById("descriptTitle");
-        // // descriptTitle.innerHTML = house.src[house.idx].title
-        // descriptTitle.innerHTML = house.title
-
-        const conver = document.getElementById('cover')
-        // // conver.src='panos/'+house.src[house.idx].name +"4k_f.jpg"
-        conver.setAttribute('data-id',panoId)
-        conver.setAttribute('data-backurl',backurl)
-    
-    }
-
-    house.idx = panoId
-
-    console.log('panoId',panoId)
-
-
-
-    const listTitle = document.getElementById('listTitle')
-    listTitle.innerHTML = "剧集列表（"+ house.src.length +"集全）"
-
-
-    var listContent=document.getElementById("listContent");
-    while (listContent.firstChild) {
-        listContent.removeChild(listContent.firstChild);
-    }
-
-    let mid = 0
-
-    for(let item of house.src){
-
-
-        const dpano = document.createElement("div");
-        dpano.className = 'pano'
-
-        if(item.id-1==pano_Id*1){
-            dpano.className = 'panoSelect'
-        }
-
-        mid = item.id
-
-        if(mid==1){
-            dpano.style.marginLeft=0
-        }
-        
-
-        dpano.setAttribute('data-id',mid);
-        const title = document.createElement("div");
-        title.className = 'title'
-        title.innerHTML = item.title
-        const thumb = document.createElement("div");
-        thumb.className = 'thumb'
-        // thumb.innerHTML = house.src[i].name
-        const img=document.createElement("img");
-
-        img.src= './panos/'+item.name + '4k_f.jpg';
-
-        thumb.appendChild(img);
-
-        dpano.appendChild(title);
-        dpano.appendChild(thumb);
-
-        listContent.appendChild(dpano);
-    }
-
-    // const ddiv = document.createElement("div");
-    // ddiv.innerHTML='.'
-    // ddiv.className = 'panoEnd'
-    // listContent.appendChild(ddiv);
-
-    if(pano_Id!=-1){
-
-        const offset = document.getElementsByClassName("thumb")
-            const offset_width = offset.length>1&&offset[1].clientWidth?offset[1].clientWidth:180
-
-            // document.getElementById('listContent').scrollLeft =offset_width*pano_select;
-            const fromLeft = document.getElementById('listContent').scrollLeft
-            const toLeft = offset_width*pano_Id
-
-            const coords = {x: fromLeft, y: 0} // Start at (0, 0)
-            const tween = new TWEEN.Tween(coords) // Create a new tween that modifies 'coords'.
-                .to({x: toLeft, y: 200}, 1000) // Move to (300, 200) in 1 second.
-                .easing(TWEEN.Easing.Quadratic.Out) // Use an easing function to make the animation smooth.
-                .onUpdate(() => {
-                    // Called after tween.js updates 'coords'.
-                    // Move 'box' to the position described by 'coords' with a CSS translation.
-                    document.getElementById('listContent').scrollLeft = coords.x
-                })
-                .start() // Start the tween immediately.
-
-    }
-
-    
-
-
-    document.addEventListener('keyup', onKeyUp);
-
-    document.getElementById('play').addEventListener('click', enterPano);
-
-    // const Jdoc=document.getElementById("Jdoc");
-    // Jdoc.style.backgroundSize = "1280px 720px";
-
-}
-
-
-
-function selectUpnDown(is_down){
-    const nodess = document.getElementById("listContent").childNodes;
-    for(let i =0;i<nodess.length-1;i++){
-        if(nodess[i].className==='panoSelect'){
-            nodess[i].className = 'pano'
-        } 
-    }
-
-    if(is_down){
-        const firstChild = document.getElementById('listContent').firstChild
-        firstChild.className = 'panoSelect'
-
-        const playdiv = document.getElementById('play')
-        // playdiv.className = 'play'
-        playdiv.style.backgroundImage='url("./nanimages/play4.png")'
-
-        document.getElementById('listContent').scrollLeft =0;
-
-        let panoId = 0
-
-        // document.getElementById('descriptTitle').innerHTML = house.src[panoId].title
-        // document.getElementById('descriptContent').innerHTML = limitWords(house.src[panoId].descript)
-
-        // update conver
-        // const conver = document.getElementById('cover')
-        // conver.src='./panos/'+house.src[panoId].name +"4k_f.jpg"
-        // conver.setAttribute('data-id',panoId)
-
-
-
-    }else{
-        const playdiv = document.getElementById('play')
-        // playdiv.className = 'playSelect'
-        playdiv.style.backgroundImage='url("./nanimages/play_click.png")'
-
-    }
-}
-
-function limitWords(txt){
-    var str = txt;
-    if(str.length>180){
-        str = str.substr(0,180) + '...';
-    }
-    
-    return str;
-}
-
-function selectLeftnRight(is_right){
-
-    const nodess = document.getElementById("listContent").childNodes;
-
-    for(let i =0;i<nodess.length;i++){
-
-        if(nodess[i].className==='panoSelect'){
-            nodess[i].className = 'pano'
-
-            let pano_select = -1
-
-            if(is_right){
-                pano_select = i===nodess.length -1? 0:i+1
-            }else{
-                pano_select = i===0? nodess.length -1:i-1
-            }
-
-            house.idx = pano_select
-
-            nodess[pano_select].className='panoSelect'
-
-            // update description
-            
-            // document.getElementById('descriptTitle').innerHTML = house.src[house.idx].title
-            // document.getElementById('descriptContent').innerHTML = limitWords(house.src[house.idx].descript)
-
-            // update conver
-            const conver = document.getElementById('cover')
-            // conver.src='./panos/'+house.src[pano_select].name +"4k_f.jpg"
-            conver.setAttribute('data-id',pano_select)
-
-            // const descriptTitle=document.getElementById("descriptTitle");
-            // descriptTitle.innerHTML = house.src[house.idx].title
-
-            // const descriptContent=document.getElementById("descriptContent");
-            // descriptContent.innerHTML = house.src[house.idx].descript
-
-            const offset = document.getElementsByClassName("thumb")
-            const offset_width = offset.length>1&&offset[1].clientWidth?offset[1].clientWidth:180
-
-            // document.getElementById('listContent').scrollLeft =offset_width*pano_select;
-
-            const fromLeft = document.getElementById('listContent').scrollLeft
-            const toLeft = offset_width*pano_select
-
-            const coords = {x: fromLeft, y: 0} // Start at (0, 0)
-            const tween = new TWEEN.Tween(coords) // Create a new tween that modifies 'coords'.
-                .to({x: toLeft, y: 200}, 1000) // Move to (300, 200) in 1 second.
-                .easing(TWEEN.Easing.Quadratic.Out) // Use an easing function to make the animation smooth.
-                .onUpdate(() => {
-                    // Called after tween.js updates 'coords'.
-                    // Move 'box' to the position described by 'coords' with a CSS translation.
-                    document.getElementById('listContent').scrollLeft = coords.x
-                })
-                .start() // Start the tween immediately.
-    
-
-
-            i = nodess.length
-        } 
-    } 
-}
-
-function enterPano(){
-    const conver = document.getElementById('cover')
-
-    const panoId = conver.getAttribute('data-id')
-    const backurl = conver.getAttribute('data-backurl')
-
-    // window.location.href="pano3.html?id="+panoId
-
-    const url = "tip.html?id="+panoId + '&backurl='+backurl
-
-    console.log('url',url)
-     window.location.replace(url)  
-    //  window.location.href = url 
-
-    //  Var param = “{"vrUrl":"http://112.18.251.84:8090/tv/h5v2/activity2/vtour/tour.html"}”
-    // const param = '{"vrUrl":"http://112.18.251.84:8090/tv/h5v2/activity2/vtour/tour.html"}'
-
-    // UtilToJS.startVrBrowser(param);
-
-}
-
-
-
-
-
-function onKeyUp(e){
-    switch(e.keyCode){
-        case 38://ArrowUp
-            selectUpnDown(false)
-            break
-        case 40://ArrowDown
-            selectUpnDown(true)
-            break
-        case 37: //ArrowLeft
-            selectLeftnRight(false)
-            break
-        case 39://ArrowRight
-            selectLeftnRight(true)
-            break
-        case 13://Enter
-            enterPano()
-        case 48: // auto play
-            break
-        case 49:
-            break
-        default:
-            break
-    }
-}
-
-
-animate()
-
-function animate() {
-	requestAnimationFrame(animate)
-
-	TWEEN.update()
-
-}
-
-
-var btn = new tvSysBtnBind({
-    id: "Jdoc",
-    className: "ctrlBtn",
-    currentClass: "current",
-    keyRemoveDefault: false,
-    effect: "base",
-    currentIndex: 0,
-    onLoad: function(e) {
-
-    },
-    onPress:function() {
-        var keyCode = this.event.keyCode;
-        // alert('tvSysBtnBind:'+keyCode+" - " + this.event.key)
-        switch (keyCode) {
-            case 37: // left
-            // reloadData();
-            break;
-            case 39: // right
-            
-            break;
-            case 38: //up
-            
-            break;
-            case 40: //down
-            
-            break;
-            // case 13: //enter
-            
-            // break;
-            case 33: //chanel +
-            
-            break;
-            case 34: //chanel -
-            
-            break;
-            case 48: //0
-            
-            break;
-            default:
-                break;
-        }
-    },
-    onEnterPress: function() {
-
-    },
-    onBack: function() {
-    //    enterPano()
-    // console.log(window.UtilToJS)
-        // if(typeof(VrBrowserToJS)!=='undefined'){
-        //     // UtilToJS.appExit();
-        //     // VrBrowserToJS.vrBrowerExit();
-        //     VrBrowserToJS.vrBrowserExit();
-
-        //     // VrBrowserToJS.appExit()
-        // }
-
-        const conver = document.getElementById('cover')
-
-        const backurl = conver.getAttribute('data-backurl')
-
-        console.log('backurl')
-
-        // window.location.href = url
-        window.location.replace(backurl) 
-        // window.location.href = backurl 
-        
-        
-    }
-});

nanjing.html

@@ -98,7 +98,7 @@
     <div id='menu'>
         <div class="pano">
             <div class="title"></div>
-            <div class="thumb"><img src='panos/01frontGate4k_b.jpg' /></div>
+            <div class="thumb"><img src='' /></div>
         </div>
     </div>
 
@@ -108,8 +108,8 @@
 
     <div class="ctrlBtn"></div>
 
+    <script src="js/nanjing.min.js"></script>
 
-   <script src="app.min.js"></script> 
 
     <script type="text/javaScript">
 

nanstyle.css

@@ -442,6 +442,7 @@ body {
         /* position: absolute; */
     /* z-index: 9; */
     display: flex;
+    
     bottom: 0px;
     width: 100vw;
     margin-left: 20px;
@@ -563,6 +564,91 @@ body {
 }
 
 
+/*--------------------  home index html ------------------------*/
+#listContent_ybf{
+    position: absolute;
+    display: flex;
+    bottom: 0px;
+    width: 100vw;
+    margin-left: 42px;
+    /* margin-right: 30px; */
+    /* height: 184px; */
+    overflow: auto;
+    background-color: rgba(0,0,0,0);
+    /* min-width: 1280px; */
+    width: calc( 1280px - 20px);
+
+}
+
+#listContent_ybf .pano{
+    position: relative;
+    /* margin: 0px 16px; */
+    cursor: pointer;
+    background-position: center;
+}
+
+
+#listContent_ybf .panoEnd{
+
+    margin: 30px;
+}
+
+#listContent_ybf .panoSelect{
+     position: relative;
+     background-image: url('./nanimages/rangle.png');
+     background-size: cover;
+     background-position: center;
+
+}
+
+#listContent_ybf .pano .title,#listContent_ybf .panoSelect .title{
+    position: absolute;
+    top: 176px;
+    left: 50%;
+    transform: translate(-50%,0%);
+    font-size: 16px;
+    width: 255px;
+    color: #ffffff;
+    overflow: hidden;
+    /* max-width: 270px; */
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    text-align: center;
+    margin-left: 2px;
+    background-image: url('./nanimages/text_bg.png');
+     background-size: cover;
+     background-position: center;
+
+
+}
+
+#listContent_ybf .pano .thumb,#listContent_ybf .panoSelect .thumb{
+    
+    width: 298px;
+    height: 217px;
+    
+    display: flex;
+    align-items: center;
+    justify-content: center;
+   
+}
+
+#listContent_ybf .pano .thumb img,#listContent_ybf .panoSelect .thumb img{
+    /* height:97%;
+    width:100%;
+    min-height:120px;
+    max-height:200px; */
+    /* width:250px;
+    height: 170px; */
+    width: 255px;
+    height: 168px;
+    margin-top: 8px;
+    margin-left: 5px;
+    
+}
+
+
+
 *::-webkit-scrollbar {
     /*滚动条整体样式*/
     width: 1px;/*定义纵向滚动条宽度*/

pano3.html

@@ -18,7 +18,7 @@
             /* set margin to 0 and overflow to hidden, to go fullscreen */
             margin: 0;
             overflow: hidden;
-            background: url('./nanimages/bg1280.jpg') center no-repeat;
+            background: url('./nanimages/bg.jpg') center no-repeat;
             background-size:100% 100%;
             color:#ffffff;
             font-family:  "Microsoft YaHei";  
@@ -75,51 +75,52 @@
     </div>
 
     <div class="home">
-        <div class="preview">
-            <div class="detail">
-                <div class="detailtitle">
-                    <div class="titlelogo"></div>
-                    <div class="title">内容详情</div>
-                </div>
-                <div class='thumb'><img id="cover" data-id='0' src="./nanimages/nan0.jpg"/></div>
-            </div>
-
-            <div class="descript">
-                <div class="content">
-                    <div id="descriptTitle">南京世茂项目</div>
-                    <div id="descriptContent">简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...</div>
-                </div>
-                
-                <div id="play" class='play'>
-                    <!-- <div class='playlogo'></div>
-                    播放 -->
-                    
-                </div>
-            </div>
-        </div>
+
 
     </div>
 
-   <div id="listTitle">剧集列表（11集全）</div>
-    <div id='listContent'>
+
+    <!-- <div id='listContent_ypf'>
+        <div class="panoSelect">
+            <div class="title">样本房A</div>
+            <div class="thumb"><img  src='nanimages/sc_1.jpg' /></div>
+        </div>
+        <div class="pano">
+            <div class="title">样本房B</div>
+            <div class="thumb"><img  src='nanimages/sc_2.jpg' /></div>
+        </div>
+        <div class="pano">
+            <div class="title">样本房C</div>
+            <div class="thumb"><img  src='nanimages/sc_3.jpg' /></div>
+        </div>
+        <div class="pano">
+            <div class="title">样本房D</div>
+            <div class="thumb"><img  src='nanimages/sc_4.jpg' /></div>
+        </div>
+
+
+    </div> -->
+
+    <div id='listContent_ybf'>
         <div class="pano">
             <div class="title"></div>
-            <div class="thumb"><img  src='panos/01frontGate4k_b.jpg' /></div>
+            <div class="thumb"><img  src='' /></div>
         </div>
             -
-        </div>
 
     </div>
 
+
     <div id='debug'></div>
 
     <div class="ctrlBtn"></div>
 
-
-    <script src="index2.min.js"></script>
+    <script src="./js/pano3.min.js"></script>
 
     <script type="text/javaScript">
 
+
+
     </script>
 </body>
 

tip.html

@@ -84,13 +84,28 @@
 
         let url = pano_Id===-1?"nanjing.html?backurl="+backurl:"nanjing.html?id="+pano_Id+"&backurl="+backurl
 
-        setTimeout( function(){
+        const time_id = setTimeout( function(){
             
             window.location.replace(url) 
             // window.location.href = url  
 
         }, 5000 );
 
+        document.addEventListener('keyup', onKeyUp);
+
+        function onKeyUp(e){
+            switch(e.keyCode){
+                case 13://Enter
+                   clearTimeout(time_id)
+                   window.location.replace(url) 
+
+                default:
+                    break
+            }
+        }
+
+
+
     </script>
 </body>
 

ybf.html

@@ -0,0 +1,125 @@
+<!DOCTYPE html>
+
+<html>
+
+<head>
+    <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="nanstyle.css">
+
+
+
+    <style>
+
+        body {
+            /* set margin to 0 and overflow to hidden, to go fullscreen */
+            margin: 0;
+            overflow: hidden;
+            background: url('./nanimages/bg1280.jpg') center no-repeat;
+            background-size:100% 100%;
+            color:#ffffff;
+            font-family:  "Microsoft YaHei";  
+            width: 1280px;
+            height:720px;
+            /* background-repeat:no-repeat; */
+            /* width: 120vw; */
+            
+}
+
+/*
+        .navigation{
+            display: flex;
+            flex-direction: column;
+            margin-left: 30px;
+            margin-top: 30px;
+        }
+        
+        */
+
+        #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="home">
+        <div class="preview">
+            <div class="detail">
+                <div class="detailtitle">
+                    <div class="titlelogo"></div>
+                    <div class="title">内容详情</div>
+                </div>
+                <div class='thumb'><img id="cover" data-id='0' src="./nanimages/nan0.jpg"/></div>
+            </div>
+
+            <div class="descript">
+                <div class="content">
+                    <div id="descriptTitle">南京世茂项目</div>
+                    <div id="descriptContent">简介:圣彼得堡位于俄罗斯北部，波罗的海沿岸...</div>
+                </div>
+                
+                <div id="play" class='play'>
+                    <!-- <div class='playlogo'></div>
+                    播放 -->
+                    
+                </div>
+            </div>
+        </div>
+
+    </div>
+
+   <div id="listTitle">剧集列表（11集全）</div>
+    <div id='listContent'>
+        <div class="pano">
+            <div class="title"></div>
+            <div class="thumb"><img  src='' /></div>
+        </div>
+            -
+        </div>
+
+    </div>
+
+    <div id='debug'></div>
+
+    <div class="ctrlBtn"></div>
+
+    <script src="js/ybf.min.js"></script>
+
+    <script type="text/javaScript">
+
+    </script>
+</body>
+
+</html>