基于ThreeJs的3D图片相册插件.zip资源-CSDN文库

共18个文件

jpg：8个

js：7个

css：2个

版权申诉

html5

jQuery

javascript

76 浏览量 2022-11-25 10:22:47 上传评论收藏 1.41MB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

基于ThreeJs的3D图片相册插件.zip （18个子文件）

基于ThreeJs的3D图片相册插件

基于ThreeJs的3D图片相册插件.jpg 66KB

jiaoben2853

css

image-gallery-three.css 328B

style.css 451B

images

image2.jpg 63KB

image6.jpg 172KB

image7.jpg 219KB

image4.jpg 244KB

image5.jpg 185KB

image1.jpg 224KB

image3.jpg 100KB

index.html 3KB

image-gallery-three.js 17KB

jquery-1.10.1.js 268KB

assets.js 2KB

preloadjs.min.js 26KB

Stats.js 3KB

TweenMax.min.js 97KB

three.min.js 402KB

<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>基于ThreeJs的3D图片相册插件 - 网页模板</title> <meta charset="UTF-8" name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> <link rel="stylesheet" type="text/css" media="screen,print" href="css/image-gallery-three.css" /> <link rel="stylesheet" type="text/css" media="screen,print" href="css/style.css" /> </head> <body> <div class="box"></div> <script type='text/javascript' src='js/jquery-1.10.1.js'></script> <script type="text/javascript" src="js/three.min.js"></script> <script type="text/javascript" src="js/assets.js"></script> <script type="text/javascript" src="js/preloadjs.min.js"></script> <script type="text/javascript" src="js/TweenMax.min.js"></script> <script type="text/javascript" src="js/Stats.js"></script> <script type="text/javascript" src="js/image-gallery-three.js"></script> <script type='text/javascript'> $(function(){ var box = $(".box").ig3js({ manifest: [ {src:"image1.jpg", id:"image1"}, {src:"image2.jpg", id:"image2"}, {src:"image3.jpg", id:"image3"}, {src:"image4.jpg", id:"image4"}, {src:"image5.jpg", id:"image5"}, {src:"image6.jpg", id:"image6"}, {src:"image7.jpg", id:"image7"} ], imagePath: 'images/', alphaBackground: true, onNavigateComplete: function(obj){ } }); $(".next").click(function(){ box.navigate.next(); return false; }); $(".prev").click(function(){ box.navigate.prev(); return false; }); $(".defP").click(function(){ box.perspective.default(); return false; }); $(".trP").click(function(){ box.perspective.topRight(); return false; }); $(".tlP").click(function(){ box.perspective.topLeft(); return false; }); for(count=1; count<=7; count++){ $(".goto").append('<a href="#" class="goto'+count+'" pos="'+(count-1)+'"> '+count+' </a>'); $(".goto"+count).click(function(){ box.navigate.goTo($(this).attr("pos")); return false; }); } }); </script> <div class="goto"></div> <a href="#" class="next">next</a><br /> <a href="#" class="defP">default perspective</a><br /> <a href="#" class="trP">top right perspective</a><br /> <a href="#" class="tlP">top left perspective</a><br /> <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"> <p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p> <p>来源：<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p> </div> </body> </html>

评论收藏

内容反馈

版权申诉