You are not logged in.

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

1

Wednesday, June 12th 2019, 11:42am

thank you for helping me [html&css&javascript]

thank you for reading my question ! *smile*


right now , i am tryting to make a tour through html& css.

i made it possible to move from TOP menu, and also i made wrapped Scence 001, Scence02 in div to make a layer, but it's not moving. so is there anything i can do ?

please check the LINK down below

thank you

link
here

Source code

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
<head>
	<style>
        *{margin:0; padding: 0; box-sizing: border-box;}
        li{list-style: none;}
       a{text-decoration: none;}
       /*header*/
       header{ background-color: blue;}
        .top_navi {background-color: #ff3333; overflow: hidden; text-align: center;}
        .top_navi li{float: left; width: 25%; height: 40px; line-height: 40px;}
        .top_navi li a{color:#fff;}
        .bottom_navi { text-align: center; height: 40px; line-height: 40px; background:blue;}
       .bottom_navi li {float: left; width: 20%}
        .bottom_navi li a { color: #fff; }#pano{ position: absolute; width:100%;height: 100%;}
        .lilist {position: absolute; bottom: 10px; width: 300px; height: 50px; background-color: rgba(33,33,33, 0.5);line-height: 50px;}
        .lilist li {float: left; width: 50%; color: #fff; text-align: center;}
        .lilist li a {color: #fff;}

	</style>
</head>
<body>
    <header>	    <nav>

	        <ul class="top_navi">
	            <li onclick="goscene('scene_001');"><a href="#">Top_Menu</a></li>
	            <li onclick="goscene('scene_002');"><a href="#" ">Top_Menu</a></li>
	            <li><a href="#">Top_Menu</a></li>
	            <li><a href="#">Top_Menu</a></li>
</ul>
<ul class="bottom_navi">
<li onclick="goscene('scene_001');"><a href="#">Bottom Menu</a></li>
<li onclick="goscene('scene_002');"><a href="#" ">Bottom Menu</a></li>
<li><a href="#">Bottom Menu</a></li>
<li><a href="#">Bottom Menu</a></li>
<li><a href="#">Bottom Menu</a></li>
</ul>
</nav></header>
    
    <!-- VR-CONTENTS -->
<div id="pano" style="width:100%; height: calc(100% - 80px); border:0.1px solid gray;">
</div>
<div class="lilist">
<ul class="snb">
<li onclick="goscene('scene_001');"><a href="">Scene001</a></li>
<li onclick="goscene('scene_002');"><a href="">Scene002</a></li>
</ul> 
</div>
<script src="tour.js"></script>
	<!-- <noscript><table style="width:100%;height:100%;"><tr style="vertical-align:middle;"><td><div style="text-align:center;">ERROR:<br/><br/>Javascript not activated<br/><br/></div></td></tr></table></noscript> -->

	<script>		embedpano({swf:"tour.swf", xml:"tour.xml", target:"pano", html5:"auto", mobilescale:1.0, passQueryParameters:true,onready : krpano_onready_callback});
        function krpano_onready_callback(krpano_interface)
    {
        krpano = krpano_interface;
    }

        function goscene(scene)
    {
        if (krpano)
        {
            krpano.call("loadscene("+ scene +", null, MERGE, BLEND(0.5));");
        }

    }
	</script></div>
</body>
</html>