Bonjour,

Je suis en train de créer un site d'actualité, et j'aimerais afficher en haut de la page d'accueil les 3 actualités les plus importantes dans une slide comme ça se fait beaucoup. Après plusieurs recherches je ne trouve pas comment faire.

J'aimerais que ça fasse comme ça :

http://www.musicactu.com/

ou:

http://www.clubic.com/

ou comme ça :

http://www.chartsinfrance.net/

Vous voyez le petit "module" à gauche afin de mettre en valeur les articles.

J'ai un peu regardé le code de clubic et j'ai vu qu'ils utilisaient premium.js, mais j'ai tapé sur Google, mais je ne trouve rien. Sur chartsinfrance c'est hplist.js mais je ne trouve rien non plus.

Je crois que je vais me baser sur le code de clubic et pour le faire. Est-ce que j'ai le droit de prendre leurs librairies ? Ou alors si vous connaissez une façon plus simple, ou un équivalent avec jQuery. Car pour moi c'est un peu difficile, car je débute là dedans.

Merci beaucoup, voilà le code de CLUBIC :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<div id="colMiddle">
            <div class="slide_premium">
                <script type="text/javascript" src="/api/js/premium.js"></script>
 
 
<script type='text/javascript'>
$(function() {
	$('#alaune').premium({
		'itemsSelector' : '.list li',
		'viewsSelector' : '.actus .actu',
		'duration' : 'slow',
		'delay' : 10
	});
});
</script>
 
 
<div id="alaune" class="inner">
 
	<ul class="list cf">
		<li>
			<a href="http://www.clubic.com/telecharger/logiciel-maison-et-hobby/article-339466-1-revisions-logiciels-preparer-examens-bac.html" class="show-a">
				<img src="http://img.clubic.com/download/image.php?id=03173006&h=0050&w=005A&crop=1" alt="Examens, Bac : Les logiciels pour préparer vos révisions !" height="83" width="97" />
			</a>
		</li>
		<li>
			<a href="http://www.clubic.com/carte-graphique/carte-graphique-nvidia/article-339266-1-nvidia-optimus-ordinateur-portable.html" class="show-b">
				<img src="http://img.clubic.com/download/image.php?id=03170220&h=0050&w=005A&crop=1" alt="NVIDIA Optimus: autonomie et performance 3D !" height="83" width="97" />
 
			</a>
		</li>
		<li>
			<a href="http://www.clubic.com/carte-mere/chipset-ati-amd/article-337192-1-chipset-amd-890gx.html" class="show-c">
				<img src="http://img.clubic.com/download/image.php?id=03168748&h=0050&w=005A&crop=1" alt="AMD 890GX: chipset avec graphique en test" height="83" width="97" />
			</a>
		</li>                    
	</ul><!-- #shows -->
 
	<div class="actus">        	
		<div class="actu actu3-a">
 
			<div class="visu"><a href="http://www.clubic.com/telecharger/logiciel-maison-et-hobby/article-339466-1-revisions-logiciels-preparer-examens-bac.html"><img src="http://img.clubic.com/photo/015E00FA03173006.jpg" alt="Examens, Bac : Les logiciels pour préparer vos révisions !" height="250" width="350" /></a>
        <div class="descriptif" >
  				<h3><a href="http://www.clubic.com/telecharger/logiciel-maison-et-hobby/article-339466-1-revisions-logiciels-preparer-examens-bac.html">Examens, Bac : Les logiciels pour préparer vos révisions !</a></h3>
  				<p><a href="http://www.clubic.com/telecharger/logiciel-maison-et-hobby/article-339466-1-revisions-logiciels-preparer-examens-bac.html">10 gratuiciels pour préparer vos examens dans les meilleures conditions !</a></p>
  			</div>
      </div>          
		</div><!-- .actu -->
 
		<div class="actu actu3-b" style="display:none;">
 
			<div class="visu"><a href="http://www.clubic.com/carte-graphique/carte-graphique-nvidia/article-339266-1-nvidia-optimus-ordinateur-portable.html"><img src="http://img.clubic.com/photo/015E00FA03170220.jpg" alt="NVIDIA Optimus: autonomie et performance 3D !" height="250" width="350" /></a>
        <div class="descriptif">
  				<h3><a href="http://www.clubic.com/carte-graphique/carte-graphique-nvidia/article-339266-1-nvidia-optimus-ordinateur-portable.html">NVIDIA Optimus: autonomie et performance 3D !</a></h3>
  				<p><a href="http://www.clubic.com/carte-graphique/carte-graphique-nvidia/article-339266-1-nvidia-optimus-ordinateur-portable.html">Découverte de la technologie NVIDIA Optimus à travers l'ordinateur portable Asus UL50Vf.</a></p>
  			</div>
      </div>
		</div><!-- .actu -->
 
		<div class="actu actu3-c" style="display:none;">
			<div class="visu"><a href="http://www.clubic.com/carte-mere/chipset-ati-amd/article-337192-1-chipset-amd-890gx.html"><img src="http://img.clubic.com/photo/015E00FA03168748.jpg" alt="AMD 890GX: chipset avec graphique en test" height="250" width="350" /></a>
  			<div class="descriptif">
  				<h3><a href="http://www.clubic.com/carte-mere/chipset-ati-amd/article-337192-1-chipset-amd-890gx.html">AMD 890GX: chipset avec graphique en test</a></h3>
  				<p><a href="http://www.clubic.com/carte-mere/chipset-ati-amd/article-337192-1-chipset-amd-890gx.html">Retour sur l'AMD 890GX, le nouveau chipset avec graphique intégré et Serial ATA 6 Gb/s d'AMD</a></p>
  			</div>
      </div>
 
		</div><!-- .actu -->                    
	</div>
</div>                <!-- #alaune -->
            </div>
            <div class="bloc_depannage">
                <h3>comment <span>faire</span></h3>
<div class="espace-depannage">
	<div class="ed-stats">Posez votre question, la rédaction ou les membres vous répondent</div>
 
	<ul>
					<li class="">
				<a href="http://www.clubic.com/windows-os/windows-7/aide-probleme/windows-7-comment-partager-une-connexion-internet-en-wifi-2548.html" title="W7 : partager sa connexion en WiFi" >W7 : partager sa connexion en WiFi</a>
			</li>
					<li class="">
				<a href="http://www.clubic.com/windows-os/windows-7/aide-probleme/windows-7-comment-changer-le-mot-de-passe-d-une-session-2516.html" title="W7 : changer son mot de passe" >W7 : changer son mot de passe</a>
			</li>
					<li class="">
 
				<a href="http://www.clubic.com/windows-os/windows-7/aide-probleme/windows-7-comment-retrouver-les-gadgets-vista-2532.html" title="W7 : retrouver les gadgets Vista" >W7 : retrouver les gadgets Vista</a>
			</li>
					<li class="">
				<a href="http://www.clubic.com/composants-pieces-detachees/aide-probleme/windows-identifier-ses-composants-materiels-2534.html" title="Identifier ses composants" >Identifier ses composants</a>
			</li>
					<li class="">
				<a href="http://www.clubic.com/windows-os/windows-7/aide-probleme/configurer-un-vpn-sous-windows-7-et-vista-2550.html" title="W7 et Vista : configurer un VPN" >W7 et Vista : configurer un VPN</a>
 
			</li>
					<li class="last">
				<a href="http://www.clubic.com/windows-os/windows-7/aide-probleme/comment-passer-d-un-clavier-qwerty-a-un-clavier-azerty-ou-inversement-2692.html" title="Passer d'un QWERTY à un AZERTY" >Passer d'un QWERTY à un AZERTY</a>
			</li>
			</ul>