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