Recherche code bannière aléatoire et cliquable

[loulou69]

Bonjour à tous !

J'ai cherché sur de nombreux sujets un code pour pouvoir mettre des bannières en format aléatoires et que celles-ci puissent êtres cliquable afin de rediriger sur le site en question.

A ce jour, je n'ai rien trouvé de concret.

Je souhaiterai mettre ces bannières en annonce et dans un widjet.

Je vous remercie pour votre aide.

Adrien.

[loulou69]

Up, merci pour votre aide.

Adrien.

[Ea]

Bonjour,


Si par bannière vous voulez dire image avec un lien, en mettant ce html :

Code:

<span class="aleat">
  <a href="http://forum.forumactif.com/t311791-gestion-des-codes-javascript"><img src="http://illiweb.com/fa/i/smiles/icon_santa.png" /></a>
  <img src="http://illiweb.com/fa/i/smiles/icon_farao.png" />
  <a href="aaa"><img src="http://illiweb.com/fa/i/smiles/icon_monkey.png"></a>
</span>

Et ce code javascript sur les pages où vous voulez que ça fonctionne ( cf ceci pour comment faire ) :

Code:

$(function(){$('.aleat').each(function(){$(this).replaceWith($(this).children().eq(Math.floor($(this).children().length*Math.random())))})});

Cela sélectionnera un des éléments dans le class="alea" au hasard.

Cordialement.

[loulou69]

Merci pour cette réponse mais les images de défilent pas l'une après l'autre.

Le javascript ne semble avoir aucun effet.

Adrien.

[Ea]

Vous l'avez inclus sur quels pages le javascript ? Et vous avez bien activé la fonction ?

Car je ne le vois inclus nulle part.


Cordialement.

[loulou69]

Erreur de ma part.

Tous marche comme souhaité !

Je vous remercie pour votre temps et votre aide.

Adrien.

[Ea]

Ok =)

Sinon le code en commenté donne :

Code:

/* après le chargement de la page */
$(function() {
  /* prendre tout les éléments avec la classe .aleat  et exécuter la fonction qui suit pour chacun d'eux */
  $(".aleat").each(function() {
    /* remplacer l'élément courant par */
    $(this).replaceWith(
      /* l'élément enfant numéro */
      $(this).children().eq(
        /* numéro d'enfant aléatoire */
        Math.floor($(this).children().length * Math.random())
      )
    )
  })
});

Enfin donc le <balise class="aleat">...</balise> est remplacé par un élément enfant aléatoirement après l'affichage de la page, donc ça serait probablement bien d'ajouter ce css également :

Code:

.aleat { display: none; }

( pour que le tout soit caché jusqu'à ce que le remplacement soit effectué ( si la page est très grande ou la connexion internet très lente, ça peut prendre quelque secondes ) )

Cordialement.