Partage
  • Partager sur Facebook
  • Partager sur Twitter

Integrer un titre dans un diaporama

    24 août 2011 à 15:25:09

    Bonjour je viens de classe mon premier sujet qui était :
    http://www.siteduzero.com/forum-83-682 [...] idershow.html
    Et pour ne pas mélanger car je ne cherche plus la même chose je créer ce sujet pour vous demander si quelqu'un sait ajouter un texte a un diaporama en jQuery ?
    J'ai 3 diapo donc il me faut pourvoir mettre 1 texte par diapo et 1texte par image.

    Je souhaiterais obtenir mon titre de la façon suivante : http://www.serie3.info/s3slider/demonstration.html

    Mon code :
    <html>
    
    <head>
    
    <script language="JavaScript">
    
    <!--
    
    
    
    var ie=1;
    
    if (navigator.appName=="Netscape") ie=0;
    
    
    
    function slide(name,tab_img,speed) {
    
    	this.name=name;
    
    	this.images=tab_img;
    
    	this.nb_images=tab_img.length;
    
    	this.index=0;
    
    	this.speed=speed;
    
    	this.create_img=create_img;
    
    	this.change=change;
    
    }
    
    
    
    
    
    function create_img() {
    
    	document.write('<img src="'+this.images[0]+'" name="'+this.name+'" Id="'+this.name+'" width="300" height="220" border="0" style="FILTER: progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.25,wipestyle=0,motion=forward)"/>');
    
    	for (i=1;i<this.nb_images;i++) {
    
    		document.write('<img src="'+this.images[i]+'" width="0" height="0" border="0"/>');
    
    	}
    }
    
    
    
    
    
    function change() {
    
    	this.index++;
    
    	if (this.index==this.nb_images) {
    
    		this.index=0;
    
    	}
    
    	this.obj=document.getElementById(this.name)
    
    	if (ie) this.obj.filters[0].apply();
    
    	this.obj.src = this.images[this.index];
    
    	if (ie) this.obj.filters[0].play();
    
    }
    
    
    
    function ecrit_img() {
    
    s1.create_img();
    
    s2.create_img();
    
    s3.create_img();
    
    }
    
    
    
    function start_slide() {
    
    	window.setInterval("s1.change();",s1.speed);
    
    	window.setInterval("s2.change();",s2.speed);
    	
    	window.setInterval("s3.change();",s3.speed);
    
    }
    
    
    
    s1 = new slide("slide1",Array("1.jpg","2.jpg","3.jpg","4.jpg"),3000);
    
    s2 = new slide("slide2",Array("m (1).jpg","m (2).jpg","m (3).jpg","m (4).jpg"),3000);
    
    s3 = new slide("slide3",Array("2.jpg","4.jpg","1.jpg","3.jpg"),3000);
    
    //-->
    
    </script>
    
    </head>
    
    <body onLoad="start_slide();">
    
    <script language="JavaScript">
    
    ecrit_img();
    
    </script>
    
    
    
    </body>
    
    </html>
    


    Merci à tous
    • Partager sur Facebook
    • Partager sur Twitter
      24 août 2011 à 15:47:01

      Inspire donc toi de ce qu'ils avaient dans ton précédent slideshow :
      //Function slideshow (Init)
      //Get the caption of the first image from REL attribute and display it
      $('#gallery .content').html($('#gallery a:first').find('img').attr('rel'))
        .animate({opacity: 0.7}, 400);
      
      //Function gallery (Interval)
      //Get next image caption
      var caption = next.find('img').attr('rel');
      //Display the content
      $('#gallery .content').html(caption);
      
      • Partager sur Facebook
      • Partager sur Twitter

      Integrer un titre dans un diaporama

      × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
      × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
      • Editeur
      • Markdown