360全景就是视角超过人的正常视角的图像,而我们这里说的全景特指水平视角360度,垂直视角180度的图像。可以全景空间里进行切换,达到浏览各个不同场景360全景展示的目的。
CSS
复制代码 代码如下:
html,body{background:#333;}
#loading{left:0;top:0;width:100%;height:100%;background:#333;color:#fff;}
#loading span{left:45%;top:40%;font:normal 50px Arial;color:#fff;}
#demo{left:50%;top:50%;margin-left:-512px;margin-top:-384px;width:1024px;height:768px;}
#demo img{border-radius:8px;border:5px solid #555;}
.back{font-size:18px;line-height:130%;padding:8px 20px;color:#fff;}
#back-home{left:0px;top:0px;background:#35916D;}
#back-article{right:0px;top:0px;background:#444;}
#back-download{right:0px;bottom:0px;background:#CE565D;}
HTML
复制代码 代码如下:
js
复制代码 代码如下:
以上就是jQuery实现360°全景拖动展示的详细内容,更多请关注0133技术站其它相关文章!
未经允许不得转载:0133技术站首页 » JavaScript 教程