js模拟真实翻页的照片展示效果，超酷~
前台部分代码
代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Demo for - 'Create a unique Gallery by using z-index and jQuery'</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/960.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/demo.js"></script>
</head>
<body>
<div class="container_12" id="wrapper">
<div class="grid_8" id="content"><br /><br /><br /><br /><br /><br /><br />
<!-- relevant for the tutorial - start -->
<div class="grid_6 prefix_1 suffix_1" id="gallery">
<div id="pictures">
<img src="images/picture1.png" alt="" />
<img src="images/picture2.png" alt="" />
<img src="images/picture3.png" alt="" />
<img src="images/picture4.png" alt="" />
<img src="images/picture5.png" alt="" />
</div>
<div class="grid_3 alpha" id="prev">
<a href="#previous">« Previous Picture</a>
</div>
<div class="grid_3 omega" id="next">
<a href="#next">Next Picture »</a>
</div>
</div>
<!-- relevant for the tutorial - end -->
<div class="clear"></div>
<p><p>可以上翻和下翻，模拟真实翻页的照片展示效果。</p></p>
<p></p>
</div>
<div class="clear"></div>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Demo for - 'Create a unique Gallery by using z-index and jQuery'</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/960.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/demo.js"></script>
</head>
<body>
<div class="container_12" id="wrapper">
<div class="grid_8" id="content"><br /><br /><br /><br /><br /><br /><br />
<!-- relevant for the tutorial - start -->
<div class="grid_6 prefix_1 suffix_1" id="gallery">
<div id="pictures">
<img src="images/picture1.png" alt="" />
<img src="images/picture2.png" alt="" />
<img src="images/picture3.png" alt="" />
<img src="images/picture4.png" alt="" />
<img src="images/picture5.png" alt="" />
</div>
<div class="grid_3 alpha" id="prev">
<a href="#previous">« Previous Picture</a>
</div>
<div class="grid_3 omega" id="next">
<a href="#next">Next Picture »</a>
</div>
</div>
<!-- relevant for the tutorial - end -->
<div class="clear"></div>
<p><p>可以上翻和下翻，模拟真实翻页的照片展示效果。</p></p>
<p></p>
</div>
<div class="clear"></div>
</div>
</body>
</html>
