Probleme de defilement d'images

mugn Messages postés 3 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 17 juin 2008 - 17 juin 2008 à 17:39
mugn Messages postés 3 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 17 juin 2008 - 17 juin 2008 à 22:56
Bonjour tout le monde,

Voila je suis actuellement entrain de développer un site web
dans lequel j'ai placer un défilement d'images horizontale, malheureusement, le
defilement des images fonctionne uniquement sous internet explorer. J'ai fait
quelques recherches et je pensse que le probleme pourrait venir de l'utilisation
du fameux "marquee".

Je voudrai donc savoir si quelqu'un pourrait m'aider
à résoudre ce problème grace a une modification du code afin que le defilement
ce fasse sur tous les navigateurs, Merci.
<hr size="2" width="100%" />
<script language="JavaScript1.2">
<!-- Begin
//largeur du
curseur (en pixels)
var sliderwidth=850
//hauteur du curseur
(Netscape)
var sliderheight=145
//vitesse de défilement
var
slidespeed=4

//les images
var leftrightslide=new Array()
var
finalslide=''
leftrightslide[0]='http://www.outils-web.com'
leftrightslide[1]='http://www.outils-web.com'
leftrightslide[2]='http://www.outils-web.com'
leftrightslide[3]='http://www.outils-web.com'
leftrightslide[4]='http://www.outils-web.com'
leftrightslide[5]='http://www.outils-web.com'
leftrightslide[6]='http://www.outils-web.com'
leftrightslide[7]='http://www.outils-web.com'
leftrightslide[8]='http://www.outils-web.com'
leftrightslide[9]='http://www.outils-web.com'

var
copyspeed=slidespeed
for
(i=0;i<leftrightslide.length;i++)
finalslide=finalslide+leftrightslide[i]+"&nbsp;&nbsp;"

if
(document.all){
document.write('<marquee id="ieslider" scrollAmount=0
width = 850>'+finalslide+'</marquee>')
ieslider.onmouseover=new
Function("ieslider.scrollAmount=0")
ieslider.onmouseout=new Function("if
(document.readyState=='complete')
ieslider.scrollAmount=slidespeed")
}

function
regenerate(){
window.location.reload()
}
function regenerate2(){
if
(document.layers){
document.ns_slider01.visibility="show"
setTimeout("window.onresize=regenerate",450)
intializeleftrightslide()
}
if
(document.all)
ieslider.scrollAmount=slidespeed
}

function
intializeleftrightslide(){
document.ns_slider01.document.ns_slider02.document.write('<nobr>'+finalslide+'</nobr>')
document.
ns_slider01.document.ns_slider02.document.close()
thelength=document.ns_slider01.document.ns_slider02.document.width
scrollslide()
}

function
scrollslide(){
if
(document.ns_slider01.document.ns_slider02.left>=thelength*(-1)){
document.ns_slider01.document.ns_slider02.left-=slidespeed
setTimeout("scrollslide()",100)
}
else{
document.ns_slider01.document.ns_slider02.left=sliderwidth
scrollslide()
}
}
window.onload=regenerate2

//
End -->
</script>

<layer
name="ns_slider02" onMouseover="slidespeed=0;"
onMouseout="slidespeed=copyspeed"></layer>

</HEAD>.

6 réponses

Supra3000 Messages postés 159 Date d'inscription lundi 18 février 2008 Statut Membre Dernière intervention 8 janvier 2010 2
17 juin 2008 à 17:49
Tu dois détecter le navigateur utilise par l'utilisateur avec :
var detect = navigator.userAgent.toLowerCase();

if (checkIt('konqueror'))
{
browser = "Konqueror";
OS = "Linux";
}
else if (checkIt('safari')) browser = "Safari"
else if (checkIt('omniweb')) browser = "OmniWeb"
else if (checkIt('opera')) browser = "Opera"
else if (checkIt('webtv')) browser = "WebTV";
else if (checkIt('icab')) browser = "iCab"
else if (checkIt('msie')) browser = "Internet Explorer"
else if (!checkIt('compatible'))
{
browser = "Netscape Navigator"
version = detect.charAt(8);
}
else browser = "An unknown browser";

Tu affiche l'information en fonction du navigateur de l'utilisateur. Voici le lien d'un petit tutorial sur le sujet : http://www.misfu.com/static/Javascript/detect.html

Bonne prog
Supra3000
0
mugn Messages postés 3 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 17 juin 2008
17 juin 2008 à 18:02
Bonjour Supra3000 et avant tout merci pour ta reponse,

Mais je detecte deja le navigateur, si je suis redirigé vers internet explorer, le defilement fonctionne parfaitement, si je suis redirigé sur firefox, plus aucune trace du defilement d'images. Je souhaiterais donc si c'est possible, une modification de mon code afin que celui-ci puisse fonctionner sur tous navigateurs. Merci

PS: Si ce n'est pas possible, j'ai trouver un superbe script qui fait ce defilement d'images (merci à RAD ^^)  mais a la verticale, si quelq'un pourrait m'expliquer les modifications pour le faire fonctionner a l'horizontale se serait super, voici le code :

Code html :

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en"     "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <title>
    </title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <style type="text/css"> /*
      <![CDATA[*/body{background-color:#000000} #slideCont{margin:10px; border:solid 1px #000; text-align:center; } #slideCont img{margin:5px; } /*]]> */
    </style>
<script type="text/javascript" src="banner.js"></script>
  </head>
 
   

     

        [
         
        [
         
        [
         
        [
         
        [
         
        [
         
       

          [
           
          [
           
          [
           
          [
           
          [
           
          [
           
       

     

   

    [slidejs.rar Download  files.rar ]

 
</html>

Code js :

function clip() {
  // width of the banner container
  var contWidth = 150;
  // height of the banner container
  var contHeight = 300;


  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();
});
0
cs_dipin Messages postés 60 Date d'inscription dimanche 26 septembre 2004 Statut Membre Dernière intervention 15 octobre 2009
17 juin 2008 à 20:41
pour faire defiler des images il existe une balise html qui marche dans le sens horizontal et vertical et qui fonctionne sous IE et mozilla cette balise et la balise marque (recherche GOOGLE pour plus d'explication)

exemple d'utilisation :

    <marquee id="marque" scrollamount="2" direction="up" onmouseover="stop()" onmouseout="start()" width=593  height=550 loop="infinite">
        tu mets ici tout se que tu veux qui defile
      </marquee>

voila petit methode qui evite d'utiliser le javascript

<<------------QuE lA FETE CoMmEnCe------------>>
0
cs_dipin Messages postés 60 Date d'inscription dimanche 26 septembre 2004 Statut Membre Dernière intervention 15 octobre 2009
17 juin 2008 à 20:42
dsl j'avais mal lu ton commentaire !!!

<<------------QuE lA FETE CoMmEnCe------------>>
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
zen69 Messages postés 584 Date d'inscription jeudi 28 décembre 2006 Statut Membre Dernière intervention 29 avril 2010 1
17 juin 2008 à 22:51
est-ce que ton firefox est configuré pour la prise en charge javascript ?

<hr size="2" width="100%" />  zen69 aka Ortho Le Profett
  [site web]
0
mugn Messages postés 3 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 17 juin 2008
17 juin 2008 à 22:56
oui il est configurer pour la prise en charge javascript
0
Rejoignez-nous