顧亞恆博客

This is Gu Yaheng‘s Personal Blog

3D特效浏览:360X180度全景图预览插件下载

3D特效浏览:360X180度全景图预览插件下载  3DJS特效插件,特效演示。

《3D特效浏览:360X180度全景图预览插件下载》

3D特效点击演示           JS特效文件下载

源码展示:

<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>GuYahn网站:3D特效浏览 360X180度全景图预览页</title>
	<link rel="stylesheet" href="css/example1.css" />
	<script src="js/three.min.js"></script>
	<script src="js/photo-sphere-viewer.min.js"></script>
	<script src="js/example1.js"></script>
	
	<style>
		.jq22-header{ text-align: center; }
	</style>
</head>
<body>
	<div class="jq22-container">
		<header class="jq22-header">
			<h1>GuYahn网站提醒:基于Three.js的360X180度全景图预览 </h1>
		    A JavaScript library to display Photo Sphere panoramas(www.guyaheng.com)
		</header>
		<div id="content">
                                         <p>顾亚恒网站提供源码下载: <a href="https://www.guyaheng.com/archives/442">3D特效浏览:360X180度全景图预览插件下载</a></p>

			<p>下面的例子可以让你调用预定义的全景图来测试这个全景图插件。点击下面的按钮来查看效果。</p>
			<p>To see this panorama, just hit the link below: currently, the <code>div</code> has a height of 0 pixel but Photo Sphere Viewer will increase it to 500 pixels.</p>

			<div id="container"></div>

			<p style="text-align: center;">
				<a href="#" id="go">调用预定义的全景图</a>
			</p>

			<p>Note that the panorama is here given as a relative path, but you can give to Photo Sphere Viewer an absolute one or an URL pointing to another website if this website allows CORS.</p>

			<p>通过下面的按钮你可以上传自己电脑上的全景图来查看效果。代码使用FileReader API,非常简单,可以查看<code>example1.js</code>文件。 </p>

			<div id="your-pano"></div>

			<form method="get" action="example1.html">
				<p style="text-align: center;">
					<input type="file" name="pano" id="pano" />
				</p>
			</form>
		</div>
		
	</div>
</body>
</html>

 

点赞
  1. 马超金博客说道:

    什么3d,4k我都没体验过,好吧,我out了

    1. 顾亚恒博客说道:

      是不是很刺激,上传张照片就行

发表评论

电子邮件地址不会被公开。 必填项已用*标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据