Discussion :

[oceane751]

bonjour � tous

avec ce code, cela me permet (entre autre) de faire defiler des images de bas vers le haut
mais 'jaimerai le faire de droite vers la gauche

voici le code js

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
function clip() {
  // width of the banner container
  var contWidth = 134;
  // height of the banner container
  var contHeight = 227;
 
  var id1 = document.getElementById('slideA');
  var id2 = document.getElementById('slideB');
  var height = id1.offsetHeight;
 
  id1.style.top = parseInt(id1.style.top)-1 + 'px';
 
  document.getElementById('slideCont').style.height = contHeight + "px";
  document.getElementById('slideCont').style.clip = 'rect(auto,'+ contWidth +'px,' + contHeight +'px,auto)';
  id2.style.display = '';
  if(parseFloat(id1.style.top) == -(height/2)) {
    id1.style.top = '0px';
  }
  setTimeout(clip,50)
}
 
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}
 
addLoadEvent(function() {
  clip();
});

si quelqu'un pouvait m' aider se serait vraiment sympa, vraiment car je gal�re vraiment

merci...

[SpaceFrog]

haut bas = top
droit gauche= left ...

[Saray]

bonjour � tous

avec ce code, cela me permet (entre autre) de faire defiler des images de bas vers le haut
mais 'jaimerai le faire de droite vers la gauche

voici le code js

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
function clip() {
  // width of the banner container
  var contWidth = 134;
  // height of the banner container
  var contHeight = 227;
 
  var id1 = document.getElementById('slideA');
  var id2 = document.getElementById('slideB');
  var height = id1.offsetHeight;
 
  id1.style.top = parseInt(id1.style.top)-1 + 'px';
 
  document.getElementById('slideCont').style.height = contHeight + "px";
  document.getElementById('slideCont').style.clip = 'rect(auto,'+ contWidth +'px,' + contHeight +'px,auto)';
  id2.style.display = '';
  if(parseFloat(id1.style.top) == -(height/2)) {
    id1.style.top = '0px';
  }
  setTimeout(clip,50)
}
 
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}
 
addLoadEvent(function() {
  clip();
});

si quelqu'un pouvait m' aider se serait vraiment sympa, vraiment car je gal�re vraiment

merci...

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
function clip() {
  // width of the banner container
  var contWidth = 134;
  // height of the banner container
  var contHeight = 227;
 
  var id1 = document.getElementById('slideA');
  var id2 = document.getElementById('slideB');
  var height = id1.offsetHeight;
  var width = id1.offsetWidth;
 
  id1.style.top = parseInt(id1.offsetTop)-1 + 'px';
  id1.style.left = parseInt(id1.offsetLeft)-1 + 'px';
 
  document.getElementById('slideCont').style.height = contHeight + "px";
  document.getElementById('slideCont').style.clip = 'rect(auto,'+ contWidth +'px,' + contHeight +'px,auto)';
  id2.style.display = '';
  if(parseFloat(id1.style.top) == -(height/2)) {
    id1.style.top = '0px';
  }
  setTimeout(clip,50)
}
 
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}
 
addLoadEvent(function() {
  clip();
});

[oceane751]

super!!

mais j'ai complement oubli� de vous demander aussi un truc
actuellement mes images sont align�es verticalement
et il faudrait qu'elles soient align�es horizontalement

pouvez vous encore m'aider?

[oceane751]

j'ai modifi� les height par des width

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
 
function clip() {
  // width of the banner container
  var contWidth = 300;
  // height of the banner container
  var contHeight = 227;
 
  var id1 = document.getElementById('slideA');
  var id2 = document.getElementById('slideB');
  var width = id1.offsetWidth;
 
  id1.style.left = parseInt(id1.style.left)-1 + 'px';
 
  document.getElementById('slideCont').style.width = contWidth + "px";
  document.getElementById('slideCont').style.clip = 'rect(auto,'+ contWidth +'px,' + contHeight +'px,auto)';
  id2.style.display = '';
  if(parseFloat(id1.style.left) == -(width/2)) {
    id1.style.left = '0px';
  }
  setTimeout(clip,50)
}
 
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}
 
addLoadEvent(function() {
  clip();
});

mais �a ne m'affiche plus rien

[Saray]

Evite d'utiliser le style.left pour avoir la position gauche, utilise plut�t offsetLeft -> car des fois style.left vaut ""

id1.style.left = parseInt(id1.offsetLeft)-1 + 'px';

[Saray]

super!!

mais j'ai complement oubli� de vous demander aussi un truc
actuellement mes images sont align�es verticalement
et il faudrait qu'elles soient align�es horizontalement

pouvez vous encore m'aider?

Applique un float left � tes images

[Auteur]

le_chomeur a r�alis� un script qui permet un d�filement d'images

[oceane751]

le_chomeur a r�alis� un script qui permet un d�filement d'images

merci
mais le hic est que se code sort d'un plugin.. donc j'ai pas trop le choix de faire avec

[oceane751]

Applique un float left � tes images

merci
mais �a ne marche pas

je redonne mon code avec les modifs (au cas o� j'ai oubli� quelque chose)
code js

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
 
function clip() {
  // width of the banner container
  var contWidth = 300;
  // height of the banner container
  var contHeight = 300;
 
  var id1 = document.getElementById('slideA');
  var id2 = document.getElementById('slideB');
  var width = id1.offsetWidth;
 
 id1.style.left = parseInt(id1.offsetLeft)-1 + 'px'; 
 
  document.getElementById('slideCont').style.width = contWidth + "px";
  document.getElementById('slideCont').style.clip = 'rect(auto,'+ contWidth +'px,' + contHeight +'px,auto)';
  id2.style.display = '';
  if(parseFloat(id1.style.left) == -(width/2)) {
    id1.style.left = '0px';
  }
  setTimeout(clip,50)
}
 
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}
 
addLoadEvent(function() {
  clip();
});

puis le code qui appelle mes images :

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
 
 
<div id="load_img">
		<script type="text/javascript" src="banner.js"></script> 
			<?php
                                $retour = "<div id='slideCont' style='position:relative;z-index:1;width:134px;left:5px;overflow:hidden;float:left;'><div id='slideA' style='position:absolute;z-index:1;top:0px;left:0px;width:134px;overflow:hidden;float:left;'>";
                for ($i = 1;is_file("flash_img/img".$i.".jpg"); $i++)
                                {
                        $retour .= "<img src=\"flash_img/img".$i.".jpg\" style=' align: center; margin-top: 15px; float:left;' />";
                                }
                                $retour .= "<div id='slideB' style='position:relative;z-index:1;top:0px;left:0px;width:134px;overflow:hidden;float:left;'>";
                        for ($i = 1;is_file("flash_img/img".$i.".jpg"); $i++)
                        {
                        $retour .= "<img src=\"flash_img/img".$i.".jpg\" style='align: center; margin-top: 15px; float:left; ' />";
                        }
                        $retour .= "</div></div></div>";
                                        echo $retour;
                                ?>
	</div>

voilou