js实现三维3d图片墙效果代码

代码语言:html

所属分类:画廊相册

代码描述:js实现三维3d图片墙效果代码

代码标签: 3d 图片 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!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">


<style type="text/css">
	html {
		overflow: hidden;
	}
	body {
		position: absolute;
		margin: 0px;
		padding: 0px;
		background: #4f5a70;
		width: 100%;
		height: 100%;
	}
	a{ color: rgba(255, 255, 255, 0.6);outline: none;text-decoration: none;-webkit-transition: 0.2s;transition: 0.2s;}
	a:hover,a:focus{color:#74777b;text-decoration: none;}
	#screen {
		position: absolute;
		left: 10%;
		top: 10%;
		width: 80%;
		height: 80%;
		background: #3e495d;
	}
	#screen img {
		position: absolute;
		cursor: pointer;
		visibility: hidden;
		width: 0px;
		height: 0px;
	}
	#screen .tvover {
		border: solid #876;
		opacity: 1;
		filter: alpha(opacity=100);
	}
	#screen .tvout {
		border: solid #fff;
		opacity: 0.7;
	}
	#bankImages {
		display: none;
	}
</style>

</head>
<body>

<div id="screen">

</div>
<div id="bankImages">
	<img alt="" src="//repo.bfw.wiki/bfwrepo/image/5d653ba895333.png">
	<img alt="" src="//repo.bfw.wiki/bfwrepo/image/5d653bd0990d0.png">
	<img alt="" src="//repo.bfw.wiki/bfwrepo/image/5e0c6f2cae508.png">.........完整代码请登录后点击上方下载按钮下载查看

网友评论0