Bonjour
j'essaye pour mon site de faire un effet parallax en suivant les conseils trouvés sur ce site: http://http://stephband.info/jparallax/
Dans la page il est stipulé (si j'ai bien compris) que l'on peut attribuer des options différentes a certains éléments:
Or je n'arrive pas à mettre ça en forme...comment distinguer les layer pour leur attribuer des options différentes?In addition to the global options above, individual layers can be passed their own set of options as extra arguments:
jQuery('.parallax-layer')
.parallax(options, layer_0_options, layer_1_options, ... );
As an example, to give the second layer a set xparallax value, but pass no options as default:
jQuery('.parallax-layer')
.parallax({}, {}, {xparallax: '200px'});
A layer option object can have the properties xparallax, yparallax, xorigin, yorigin, width and height, with the same meanings as described above.
Le code des options est celui ci à l'origine:
J'avais écrit ça pour mettre une option différente:
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 var options = { mouseport: 'body', // jQuery object or selector of DOM node to use as mouse detector xparallax: true, // boolean | 0-1 | 'npx' | 'n%' - Sets axis of reaction and by how much they react yparallax: true, // xorigin: 0.5, // 0-1 - Sets default alignment. Only has effect when parallax values are something other than 1 (or true, or '100%') yorigin: 0.5, // decay: 0.66, // 0-1 (0 instant, 1 forever) - Sets rate of decay curve for catching up with target mouse position frameDuration: 30, // Int (milliseconds) freezeClass: 'freeze' // String - Class added to layer when frozen }, value = { left: 0, top: 0, middle: 0.5, center: 0.5, right: 1, bottom: 1 }, regex = { px: /^\d+\s?px$/, percent: /^\d+\s?%$/ }, frameEvent = 'frame.'+plugin, abs = Math.abs, pointer = [0, 0];
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 var options = { mouseport: 'body', // jQuery object or selector of DOM node to use as mouse detector xparallax: true, // boolean | 0-1 | 'npx' | 'n%' - Sets axis of reaction and by how much they react yparallax: true, // xorigin: 0.5, // 0-1 - Sets default alignment. Only has effect when parallax values are something other than 1 (or true, or '100%') yorigin: 0.5, // decay: 0.66, // 0-1 (0 instant, 1 forever) - Sets rate of decay curve for catching up with target mouse position frameDuration: 30, // Int (milliseconds) freezeClass: 'freeze' // String - Class added to layer when frozen }, value = { left: 0, top: 0, middle: 0.5, center: 0.5, right: 1, bottom: 1 }, regex = { px: /^\d+\s?px$/, percent: /^\d+\s?%$/ }, frameEvent = 'frame.'+plugin, abs = Math.abs, pointer = [0, 0]; var layer_1_options = { mouseport: 'body', // jQuery object or selector of DOM node to use as mouse detector xparallax: true, // boolean | 0-1 | 'npx' | 'n%' - Sets axis of reaction and by how much they react yparallax: true, // xorigin: 0.5, // 0-1 - Sets default alignment. Only has effect when parallax values are something other than 1 (or true, or '100%') yorigin: 0.7, // decay: 0.66, // 0-1 (0 instant, 1 forever) - Sets rate of decay curve for catching up with target mouse position frameDuration: 30, // Int (milliseconds) freezeClass: 'freeze' // String - Class added to layer when frozen }, value = { left: 0, top: 0, middle: 0.5, center: 0.5, right: 1, bottom: 1 }, regex = { px: /^\d+\s?px$/, percent: /^\d+\s?%$/ }, frameEvent = 'frame.'+plugin, abs = Math.abs, pointer = [0, 0];
et dans la page html j'avais mis ça pour l'image qui devait avoir des options différentes:
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5 <div class="parallax-layer_1" style="width:1200px; height:170px;"> <img src="images/logo3.png" alt="" style="position:absolute; top:10px; right:40;" /> </div> </div>
mais ça ne marche pas...
Me suis-je bien fait comprendre?
Je ne suis pas très calé, j'ai réussi a faire marcher le zaffaire mais là je bloque!
Merci par avance à tous ceux qui pourront m'aider!!
Partager