Ceci est mon CoverFlow préféré: http://paulbakaus.com/lab/js/coverflow/Quelque part pour télécharger CSS coverflow?
Y at-il un moyen de télécharger? Ou y a-t-il un guide de mise en œuvre? Tout ce que je vois, ce sont des articles de blog sans rien sur la façon de l'implémenter.
Merci.
Que diriez-vous de télécharger tous les scripts dans la source?
<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>
, remplacez les éléments <img> dans l'élément et il doit fournir les mêmes fonctionnalités.
À titre d'exemple l'un des scripts est @http://paulbakaus.com/lab/js/coverflow/ui.coverflow.js
Vous cherchez juste pour un riiper site qui dupliquer le site Web sur votre PC? Si c'est le cas, regardez ici http://www.techsupportalert.com/best-free-web-site-ripper.htm (et regardez toujours ce site pour le meilleur en libre).
* CAVEAT * demander au propriétaire du site avant d'extraire.
Le script dit spécifiquement // C'EST UNIQUEMENT À DES FINS DE DÉMO! – Mark
@Mark - Peut-être que la raison pour laquelle vous ne pouvez trouver aucune documentation sur ce document ou même sur un téléchargement est que ce n'est pas un produit fini. –
Cela fonctionne plutôt bien. Est-ce que l'OS de licence? Quelqu'un devrait le libérer. – Mark