这是我最喜欢的封面流程：
http://paulbakaus.com/lab/js/coverflow/
有什么方法可以下载吗？还是有实施指南？
我所看到的只是一些博客文章，没有关于如何实现的文章。
谢谢。
最佳答案
如何下载源代码中的所有脚本？
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Coverflow featuring css transitions</title>
<style type="text/css" media="screen">
body,html {
margin: 0;
padding: 0;
background: #000;
height: 100%;
color: #eee;
font-family: Arial;
font-size: 10px;
}
h1 {
margin: 20px;
}
p {
margin: 20px;
}
div.magnifyme {
height: 80px;
padding: 30px;
position: absolute;
top: 0px;
left: 0px;
width: 2000px;
}
div.wrapper {
margin: 20px;
height: 160px;
border: 2px solid #999;
overflow: hidden;
width: 600px;
position: relative;
}
div.slider {
position: absolute;
bottom: 5px;
left: 30px;
width: 542px;
height: 19px;
background: url(productbrowser_scrollbar_20070622.png) no-repeat;
}
div.ui-slider-handle {
position: absolute;
cursor: pointer;
cursor: hand;
top: 0px;
left: 0px;
height: 100%;
width: 181px;
background: url(handle.png) no-repeat;
}
div.magnifyme img {
width: 64px;
height: 64px;
float: left;
margin: 5px;
position: relative;
border: 1px solid #999;
}
</style>
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script type="text/javascript" src="ui.core.js"></script>
<script type="text/javascript" src="ui.slider.js"></script>
<script type="text/javascript" src="effects.core.js"></script>
<script type="text/javascript" src="ui.coverflow.js"></script>
<script type="text/javascript" src="../transformie/sylvester.js"></script>
<script type="text/javascript" src="../transformie/pb.transformie.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("div.magnifyme").coverflow();
});
</script>
</head>
<body>
<h1>Coverflow effect featuring CSS transformations and jQuery UI</h1>
<p>
This proof-of-concept shows a coverflow effect using the new CSS transformation feature from Webkit (featured in Safari 3.1). Needless
to say that it won't run in other browsers at this point (however, adapting it to canvas should be quite easy, and even now, it won't break in other browsers).
</p>
<p>
Unlike other demos, this one can truly animate between two half states, making a slider implementation like the iTunes slider really easy (will come
to this demo soon!). Have fun and try using the keyboard for hotness ;)
</p>
<div class="wrapper">
<div class="magnifyme">
<img src="icons/1.png" />
<img src="icons/2.png" />
<img src="icons/3.png" />
<img src="icons/4.png" />
<img src="icons/5.png" />
<img src="icons/6.png" />
<img src="icons/7.png" />
<img src="icons/8.png" />
<img src="icons/9.png" />
<img src="icons/10.png" />
<img src="icons/1.png" />
<img src="icons/2.png" />
<img src="icons/3.png" />
<img src="icons/4.png" />
<img src="icons/5.png" />
<img src="icons/6.png" />
<img src="icons/7.png" />
<img src="icons/8.png" />
<img src="icons/9.png" />
<img src="icons/10.png" />
</div>
<div class="slider">
<div class="ui-slider-handle"></div>
</div>
</div>
</body>
</html>
只需替换元素中的
<img>元素，它应提供相同的功能。例如，其中一个脚本是@ http://paulbakaus.com/lab/js/coverflow/ui.coverflow.js
关于jquery - 哪里可以下载CSS Coverflow？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/3034398/