Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Widget "theme du mois" de FA

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Widget "theme du mois" de FA

Message par BAR4K le Mer 9 Juin 2010 - 23:12

Bien le bonjour ,

je voudrais savoir comment avoir le même widget de FA "theme du mois" que vous avez sur le coté mais avec 5 image au lieu de trois ici .
J'imagine qu'il s'agit d'un code en htlm ...


Dernière édition par BAR4K le Jeu 24 Juin 2010 - 21:33, édité 1 fois
avatar

BAR4K
***

Masculin
Messages : 193
Inscrit(e) le : 28/08/2009

http://lebunker.forumactif.org/forum.htm
BAR4K a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Widget "theme du mois" de FA

Message par bush76 le Mer 16 Juin 2010 - 22:01

ah oui j'aimerais savoir egalement ca m'interresse aussi merci d'avance

bush76
*****

Masculin
Messages : 590
Inscrit(e) le : 23/05/2010

http://happyjack.niceboard.com
bush76 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Widget "theme du mois" de FA

Message par BAR4K le Mer 16 Juin 2010 - 22:45

En fait je pense que ce qui me manque c'est le defilement des images et les petites icone 1,2,3,4,5
avatar

BAR4K
***

Masculin
Messages : 193
Inscrit(e) le : 28/08/2009

http://lebunker.forumactif.org/forum.htm
BAR4K a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Widget "theme du mois" de FA

Message par Shadow le Jeu 17 Juin 2010 - 10:37

Bonjour,

Voici le nouveau code pour 5 images:

Code:
<style type="text/css">
.picshow { z-index:444; position:relative; background-color:#ffffff; width: 100%; height: 135px}
.picshow_main { position: relative; width: 180px; height: 135px}
.picshow_main .imgbig { filter: progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4, motion=forward); width: 180px; height: 135px}
.picshow_change {position: absolute; text-align: left; bottom: 0px; height: 30px; right: 0px; left: 50px;}
.picshow_change img {width:15px; height: 15px}
.picshow_change a { border: 1px solid; display: block; float: left; margin-right: 5px;  -display: inline}
a.axx { border-color: #555}
a.axx:hover {border-color: #000}
a.axx img { filter: alpha(opacity=40); opacity: 0.4; -moz-opacity: 0.4}
a.axx:hover img {filter: alpha(opacity=100); opacity: 1.0; -moz-opacity: 1.0}
a.bxx { border-color: #000}
a.bxx:hover {border-color: #000}
img{
border:0px}
</style>
<SCRIPT language=javascript>
 var counts = 5;
 img1 = new Image();
 img1.src = 'Adresse de votre image 1';
 img2 = new Image();
 img2.src = 'Adresse de votre image 2';
 img3 = new Image();
 img3.src = 'Adresse de votre image 3';
 img4 = new Image();
 img4.src = 'Adresse de votre image 4';
 img5 = new Image();
 img5.src = 'Adresse de votre image 5';
 
var smallImg = new Array();
smallImg[0] = 'http://i60.servimg.com/u/f60/12/10/25/45/index_10.gif';
smallImg[1] = 'http://i60.servimg.com/u/f60/12/10/25/45/index_11.gif';
smallImg[2] = 'http://i60.servimg.com/u/f60/12/10/25/45/index_12.gif';
smallImg[3] = 'http://i63.servimg.com/u/f63/11/73/76/86/index_10.gif';
smallImg[4] = 'http://i63.servimg.com/u/f63/11/73/76/86/index_11.gif';
 
url1 = 'lien de votre image 1';
url2 = 'lien de votre image 2';
url3 = 'lien de votre image 3';
url4 = 'lien de votre image 4';
url5 = 'lien de votre image 5';

alt1 = new Image();
alt1.alt = 'titre de votre image 1';
alt2 = new Image();
alt2.alt = 'titre de votre image 2';
alt3 = new Image();
alt3.alt = 'titre de votre image 3';
alt4 = new Image();
alt4.alt = 'titre de votre image 4';
alt5 = new Image();
alt5.alt = 'titre de votre image 5';
var nn = 1;
var key = 0;
function change_img() {
  if (key == 0) {
  key = 1;
  } else if (document.all) {
  document.getElementById("pic").filters[0].Apply();
  document.getElementById("pic").filters[0].Play(duration = 2);
  }
  eval('document.getElementById("pic").src=img' + nn + '.src');
  eval('document.getElementById("url_theme").href=url' + nn);
  eval('document.getElementById("pic").alt=alt' + nn + '.alt');
  if (nn == 1) {
  document.getElementById("url_theme").target = "_blank";
  document.getElementById("url_theme").style.cursor = "pointer";
  } else {
  document.getElementById("url_theme").target = "_blank"
  document.getElementById("url_theme").style.cursor = "pointer"
  }
 
  for ( var i = 1; i <= counts; i++) {
  document.getElementById("xxjdjj" + i).className = 'axx';
  }
  document.getElementById("xxjdjj" + nn).className = 'bxx';
  nn++;
  if (nn > counts) {
  nn = 1;
  }
  tt = setTimeout('change_img()', 7000);
 }
 function changeimg(n) {
  nn = n;
  window.clearInterval(tt);
  change_img();
 }
 function ImageShow() {
  document.write('<div class="picshow_main">');
  document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
  document.write('<div class="picshow_change">');
  for ( var i = 0; i < counts; i++) {
  document.write('<a href="javascript:changeimg(' + (i + 1)
    + ');" id="xxjdjj' + (i + 1)
    + '" class="axx" target="_self"><img src="' + smallImg[i]
    + '"></a>');
  }
  document.write('</div></div>');
  change_img();
 }
</SCRIPT>
<SCRIPT language="javascript" type="text/javascript">
 ImageShow();
</SCRIPT>

Un exemple ici: http://testzen.forumactif.fr/index.htm Wink

Cordialement


Dernière édition par Zen le Jeu 29 Juil 2010 - 15:57, édité 1 fois
avatar

Shadow
Adminactive
Adminactive

Féminin
Messages : 24348
Inscrit(e) le : 30/03/2007

https://forum.forumactif.com
Shadow a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Widget "theme du mois" de FA

Message par BAR4K le Ven 18 Juin 2010 - 22:22

Waou ! merci ,ça marche nickel ...merci .
Peux tu ,pour finir, m'indiquer le parametre de la taille car je voudrai le modifier (histoire d'être sur). Je me plante a chaque éssais .
Merci d'avance
avatar

BAR4K
***

Masculin
Messages : 193
Inscrit(e) le : 28/08/2009

http://lebunker.forumactif.org/forum.htm
BAR4K a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Widget "theme du mois" de FA

Message par Shadow le Lun 21 Juin 2010 - 11:30

Excusez moi, je n'ai pas vu votre réponse. Voici les valeurs à modifier pour la taille des images (parties rouges):

.picshow_main { position: relative; width: 180px; height: 135px}
.picshow_main .imgbig { filter: progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4, motion=forward); width: 180px; height: 135px}
avatar

Shadow
Adminactive
Adminactive

Féminin
Messages : 24348
Inscrit(e) le : 30/03/2007

https://forum.forumactif.com
Shadow a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Widget "theme du mois" de FA

Message par BAR4K le Jeu 24 Juin 2010 - 21:34

Mille merci ZEN !!! victoire
avatar

BAR4K
***

Masculin
Messages : 193
Inscrit(e) le : 28/08/2009

http://lebunker.forumactif.org/forum.htm
BAR4K a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum