Discussion :

[Aiglichon]

Bonjour à tous, je créé un nouveau portfolio et j'ai déjà un problème. J'utilise cette galerie : http://tympanus.net/codrops/2012/06/...hover-effects/ que j'aime beaucoup, le problème est que quand je copie/colle la partie qui me semble logique pour créer de nouveaux articles, la deuxième partie ne fonctionne pas.

En gros je voudrais 2 parties:

-----------------------------------

Une partie Web avec 3 articles

-----------------------------------

Une partie Graphisme avec 3 articles

-----------------------------------


je copie colle cette partie de code :

Code html :

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
<div id="grid" class="main">
<div class="view">
	<div class="view-back">
		<span data-icon="A">566</span>
		<span data-icon="B">124</span>
		<a href="http://www.flickr.com/photos/ag2r/5439506585/in/photostream">&rarr;</a>
	</div>
	<img src="images/travaux/1.jpg" />
</div>
<div class="view">
	<div class="view-back">
		<span data-icon="A">210</span>
		<span data-icon="B">102</span>
		<a target="_blank" href="http://195.83.128.55/~src10d01/">&rarr;</a>
	</div>
	<img src="images/travaux/2.jpg" />
</div>
<div class="view">
	<div class="view-back">
		<span data-icon="A">690</span>
		<span data-icon="B">361</span>
		<a href="http://www.flickr.com/photos/ag2r/6271521984/in/photostream">&rarr;</a>
	</div>
	<img src="images/travaux/3.jpg" />
</div>
<div class="view">
	<div class="view-back">
		<span data-icon="A">987</span>
		<span data-icon="B">130</span>
		<a href="http://www.flickr.com/photos/ag2r/6131126901/in/photostream">&rarr;</a>
	</div>
	<img src="images/travaux/4.jpg" />
</div>
<div class="view">
	<div class="view-back">
		<span data-icon="A">987</span>
		<span data-icon="B">130</span>
		<a href="http://www.flickr.com/photos/ag2r/6131126901/in/photostream">&rarr;</a>
	</div>
	<img src="images/travaux/5.jpg" />
</div>
<div class="view">
	<div class="view-back">
		<span data-icon="A">987</span>
		<span data-icon="B">130</span>
		<a href="http://www.flickr.com/photos/ag2r/6131126901/in/photostream">&rarr;</a>
	</div>
	<img src="images/travaux/6.jpg" />
</div>
</div>

La deuxième partie s'affiche mais l'effet de transition ne fontionne pas. Ou est le problème ? Je vous serais très reconnaissant si vous pouviez m'aider ! Je but sur une petite bétises je suis sûre

Merci d'avance

[SpaceFrog]

sauf que tu ne nous montres pas comment tu initialises le plugin ...

[Aiglichon]

Comment ça ?
Je pensais que mon lien pourrait vous aider. Même avec le code de base ça ne fonctionne pas quand je sépare 2 bibliothèques dans 2 div différentes

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<div id="content_web">
</div>
 
<div id="content_graphisme">
</div>

[SpaceFrog]

heu il y a bien une partie jquery associée non ?

[Aiglichon]

Oui ! Le plus simple c'est de mettre ça en ligne, voici le lien pour voir ou j'en suis: http://195.83.128.55/~src10d01/portfolio4/ Ca vole pas bien haut pour le moment mais honnetement je ne vois pas mon problème

[SpaceFrog]

Le problème est très simple
tu as deux id grid sur la page ...
Or un id DOIT ETRE UNIQUE

mets grid1 et grid deux puis en bas de page dans ton jquery:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$( '#grid1, #grid2' ).hoverfold();