|
|
@@ -0,0 +1,208 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
|
+<meta name="viewport"
|
|
|
+ content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
|
+<link rel="icon" type="image/png" sizes="32x32" href="images/favicon.png" class="keep">
|
|
|
+<link rel="stylesheet" href="css/index.css">
|
|
|
+<script src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
|
|
|
+
|
|
|
+<head>
|
|
|
+ <title>吴忠博物馆</title>
|
|
|
+ <!-- <script src="https://model3d.4dage.com/3D/2018/model/DG/js/4dage.js"></script> -->
|
|
|
+ <script src="js/4dage.js"></script>
|
|
|
+ <style>
|
|
|
+ html {
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .logo {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ z-index: 9999;
|
|
|
+ width: 90vw;
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ bottom: 10px;
|
|
|
+ height: 50px;
|
|
|
+ display: none !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .logo .img {
|
|
|
+ background: url('./images/logo.png');
|
|
|
+ background-size: 100% 100%;
|
|
|
+ max-width: 40vw;
|
|
|
+ max-height: 50px;
|
|
|
+ height: 40px;
|
|
|
+ width: 150px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .logo .logotxt {
|
|
|
+ padding-bottom: 5px;
|
|
|
+ color: #666;
|
|
|
+ border-bottom: 1px solid #666;
|
|
|
+ }
|
|
|
+
|
|
|
+ .back{
|
|
|
+ display: none !important;
|
|
|
+ z-index: 9999;
|
|
|
+ cursor: pointer;
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ position: absolute;
|
|
|
+ top: 10px;
|
|
|
+ left: 10px;
|
|
|
+ }
|
|
|
+ .back img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+
|
|
|
+<body>
|
|
|
+ <div class="back" onclick="javascript:history.go(-1);">
|
|
|
+ <img src="./images/back.png" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="logo">
|
|
|
+ <div class="img"></div>
|
|
|
+ <div class="logotxt"> 提 供 技 术 支 持 </div>
|
|
|
+ </div>
|
|
|
+ <div id="ui">
|
|
|
+ <!-- <div id="introductionWrap" class="animated">
|
|
|
+ <span id="name"></span>
|
|
|
+ <span id="time"></span>
|
|
|
+ <span id="size"></span>
|
|
|
+ <span id="texture"></span>
|
|
|
+ <span id="keep"></span>
|
|
|
+ <span id="num"></span>
|
|
|
+ <span id="level"></span>
|
|
|
+ <span id="unit"></span>
|
|
|
+ </div>
|
|
|
+ <div id="iconWrap" class="iconWrap">
|
|
|
+ <img id="iconLeft" class="mar-right" src="images/icon_left.png" alt="">
|
|
|
+ <img id="iconRight" class="iconRight" src="images/icon_right.png" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="iconAction">
|
|
|
+ <div id="iconHome" class="iconMenu iconHome"><img src="images/icon_home.png" alt=""><span>首页</span></div>
|
|
|
+ <div class="iconMenu iconInfo" id="iconInfo" data-info=0>
|
|
|
+ <img src="images/icon_info.png" alt="">
|
|
|
+ <span>文物介绍</span>
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+ <!-- <span id="companyText" class="loading animated ">四维时代提供技术支持</span> -->
|
|
|
+ </div>
|
|
|
+ <script src="js/jquery.js"></script>
|
|
|
+ <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
|
|
|
+ <!-- <script src="js/constant.js"></script> -->
|
|
|
+
|
|
|
+ <script type="text/javascript" src="js/info.js"></script>
|
|
|
+ <script type="text/javascript" src="js/model.js"></script>
|
|
|
+ <!-- <script type="text/javascript" src="js/weixin.js"></script> -->
|
|
|
+ <!-- <script type="text/javascript" src="js/data.js"></script> -->
|
|
|
+ <script>
|
|
|
+ var number = getQueryVariable("m");
|
|
|
+ /* window.autoRotate = true; */ // 是否自动旋转
|
|
|
+
|
|
|
+ fdage.embed('4dage/' + number + '.4dage', {
|
|
|
+ width: 800,
|
|
|
+ height: 600,
|
|
|
+ autoStart: true,
|
|
|
+ fullFrame: true,
|
|
|
+ pagePreset: false
|
|
|
+ });
|
|
|
+ // marmoset.embed('4dage/' + number + '.4dage', { width: 800, height: 600, autoStart: true, fullFrame: true, pagePreset: false });
|
|
|
+ var number = getQueryVariable("m");
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ let pageNum = number.split("_")[1];
|
|
|
+
|
|
|
+ let iconLeft = document.querySelector('#iconLeft');
|
|
|
+ let iconRight = document.querySelector('#iconRight');
|
|
|
+ let iframe = document.querySelector('iframe');
|
|
|
+ let iconHome = document.querySelector('#iconHome');
|
|
|
+ let iconInfo = document.querySelector('#iconInfo');
|
|
|
+ var URL = window.location.href;
|
|
|
+ /* var n = parseInt(number.slice(2)); */
|
|
|
+ var n = -1; //当前位置
|
|
|
+ let list = ['yp01', 'yp02', 'yp03', 'yp04', 'yp05', 'yp06', 'yp07', 'yp08', 'yp09', 'yp09_1', 'yp10', 'yp11',
|
|
|
+ 'yp12', 'yp13', 'yp14', 'yp15', 'yp16', 'yp17', 'yp18', 'yp19', 'yp20'
|
|
|
+ ];
|
|
|
+ list.forEach(function (val, index) {
|
|
|
+ if (val == number) {
|
|
|
+ n = index;
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ iconHome.addEventListener('click', () => {
|
|
|
+
|
|
|
+ window.location.href = URL.split('Model')[0] + "index.html";
|
|
|
+ })
|
|
|
+ /* iconHome.addEventListener('touchstart', () => {
|
|
|
+ window.location.href = 'https://4dscene.4dage.com/culturalrelics/bengbu/index.html?m=ah'
|
|
|
+ }) */
|
|
|
+ /* iconInfo.addEventListener('click',() => {
|
|
|
+
|
|
|
+ }) */
|
|
|
+
|
|
|
+ iconLeft.addEventListener('click', () => {
|
|
|
+ if (n <= 0) {
|
|
|
+ iconLeft.style.cursor = 'not-allowed';
|
|
|
+ } else {
|
|
|
+ goToUrl(n - 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ iconLeft.addEventListener('mouseover', () => {
|
|
|
+ if (n <= 0) {
|
|
|
+ iconLeft.style.cursor = 'not-allowed';
|
|
|
+ } else {
|
|
|
+ iconLeft.style.cursor = 'pointer';
|
|
|
+ }
|
|
|
+ })
|
|
|
+ iconRight.addEventListener('mouseover', () => {
|
|
|
+ if (n >= list.length - 1) {
|
|
|
+ iconRight.style.cursor = 'not-allowed';
|
|
|
+ } else {
|
|
|
+ iconRight.style.cursor = 'pointer';
|
|
|
+ }
|
|
|
+ })
|
|
|
+ iconRight.addEventListener('click', () => {
|
|
|
+ if (n >= list.length - 1) {
|
|
|
+ iconRight.style.cursor = 'not-allowed';
|
|
|
+ } else {
|
|
|
+ goToUrl(n + 1);
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ function goToUrl(n) {
|
|
|
+ /* let next;
|
|
|
+ if(n<=9){
|
|
|
+ next = "yw" + "0" + n ;
|
|
|
+ }else next = "yw" +n ; */
|
|
|
+ window.location.href = URL.replace(number, list[n]);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ /* $("#iconInfo").click(function(){
|
|
|
+ console.log(1)
|
|
|
+ if($(this).attr("data-info")==0){
|
|
|
+ $("#introductionWrap").css("display","flex");
|
|
|
+ $("#introductionWrap").addClass("fadeInRight");
|
|
|
+ $("#introductionWrap").removeClass("fadeOutRight");
|
|
|
+ $(this).attr("data-info",1);
|
|
|
+ }else {
|
|
|
+ $("#introductionWrap").addClass("fadeOutRight");
|
|
|
+ $("#introductionWrap").removeClass("fadeInRight");
|
|
|
+ $(this).attr("data-info",0)
|
|
|
+ }
|
|
|
+
|
|
|
+ }) */
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+
|
|
|
+</html>
|