Image s'éclairsit au passage du curseur

4 participants

Page 2 sur 2 Précédent  1, 2

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

Résolu Image s'éclairsit au passage du curseur

Message par suigetsu deus Mer 1 Sep 2010 - 15:42

Rappel du premier message :

Bonjour, j'aimerais savoir comment faire pour que les images de mes sous-forum s'éclairssisse au passage du curseur de la souris, qu'il se différencie part rapport aux autres.
Mon site: http://phalange-spartiate.forum-pro.fr/index.htm

ex: Image s'éclairsit au passage du curseur - Page 2 Imagep11

puis change quand le curseur est dessus:Image s'éclairsit au passage du curseur - Page 2 Imagep12

A bientôt j'espère Very Happy
avatar

suigetsu deus
Nouveau membre

Messages : 22
Inscrit(e) le : 15/05/2010

Voir le profil de l'utilisateur http://phalange-spartiate.forum-pro.fr
suigetsu deus a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par tuning78 Jeu 2 Sep 2010 - 18:45

oui dans la sase blanche ou il faut l'enregistrer sur la feuille ""Voir le CSS de base de votre forum""

et sinon pour la case de desactiver le CCS de base c'est bien cocher non

tuning78

tuning78
***

Masculin
Messages : 160
Inscrit(e) le : 06/11/2007

Voir le profil de l'utilisateur http://the-world-of-custom.forumactif.fr
tuning78 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par Renald Jeu 2 Sep 2010 - 19:07

Oui il faut que se soit cocher non.
Tu ne peux pas l'enregistrer sur le css de base c'est juste pour le voir.
Renald

Renald
*****

Masculin
Messages : 647
Inscrit(e) le : 27/04/2006

Voir le profil de l'utilisateur http://t-c-d.forumactif.com
Renald a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par tuning78 Jeu 2 Sep 2010 - 19:11

ok donc je l"avai mis dans le tableau blanc
tuning78

tuning78
***

Masculin
Messages : 160
Inscrit(e) le : 06/11/2007

Voir le profil de l'utilisateur http://the-world-of-custom.forumactif.fr
tuning78 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par Renald Jeu 2 Sep 2010 - 19:12

Et tu as bien mis le span avec la class "eclairci" autour de l'image?
Renald

Renald
*****

Masculin
Messages : 647
Inscrit(e) le : 27/04/2006

Voir le profil de l'utilisateur http://t-c-d.forumactif.com
Renald a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par tuning78 Jeu 2 Sep 2010 - 19:31

Renald a écrit:Les url des images elles sont déjà placées dans les descriptions des catégories.
Vous pouvez essayer ceci:
Devant les url des images concernées vous mettez:
Code:
<span class="eclairci"><img src="[img]http://i20.servimg.com/u/f20/11/00/90/13/500x2010.jpg[/img]" /></span>

Dans le css vous mettez:
Code:
.eclarci:hover
{
filter:alpha(opacity=50);
}

.eclarci
{
filter:alpha(opacity=100);
}

voila comment j'ai fait sinon esce normale quand on site le message que SPAN a la fin de mon lien img il y a un slash a l'enver et quand on poste le msg il est normal avec un espace?
tuning78

tuning78
***

Masculin
Messages : 160
Inscrit(e) le : 06/11/2007

Voir le profil de l'utilisateur http://the-world-of-custom.forumactif.fr
tuning78 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par Renald Jeu 2 Sep 2010 - 20:36

Retire les balises [img] et le code sera parfait.
Je ne sais pas pourquoi c'est différent quand tu postes mais à la fin de la balise <img c'est bien /> avec un espace devant.

Et dans le css c'est une faute que j'avais faite c'est ecrit eclarci au lieu de eclairci il faut rajouter le "i" sinon ça ne fonctionnera pas.
Renald

Renald
*****

Masculin
Messages : 647
Inscrit(e) le : 27/04/2006

Voir le profil de l'utilisateur http://t-c-d.forumactif.com
Renald a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par Adam_sfp Jeu 2 Sep 2010 - 20:43

Bonsoir

*suigetsu deus

Vous pouvez aussi utiliser Jquery .
par exemple cet effet ICI
A partir de ce tuto ICI

Pour faire au plus simple a partir d'une image de suigetsu deus.

Coller dans description de site

Code:
<script type=text/javascript src=http://sd-1.archive-host.com/membres/up/37821634957680146/fade/js/custom.js></script>

Ensuite dans forum catégories et forums choisissez votre forum et dans la partie :+html:
Collez ceci
Code:
<img src="http://sd-1.archive-host.com/membres/up/37821634957680146/fade/images/news.jpg" alt="NEWS" width="650" height="162" border="0" class="latest_img" />
et enregistrez.



Cordialement.


Dernière édition par Adam_sfp le Jeu 2 Sep 2010 - 21:45, édité 3 fois
Adam_sfp

Adam_sfp
Membre actif

Masculin
Messages : 4465
Inscrit(e) le : 18/04/2008

Voir le profil de l'utilisateur http://antonyadam.kanak.fr
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par Renald Jeu 2 Sep 2010 - 20:46

Bonsoir,

Le problème de suigetsu deus c'est que le code html ne fonctionnait pas.
un simple <img src="url de l'image" /> n'affichait pas l'image.
Pourtant le html est bien activé sur son forum.

En tout cas l'effet Jquery est vraiment sympa merci!
Renald

Renald
*****

Masculin
Messages : 647
Inscrit(e) le : 27/04/2006

Voir le profil de l'utilisateur http://t-c-d.forumactif.com
Renald a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par tuning78 Jeu 2 Sep 2010 - 20:56

merci j'essayerai demain et quand vous dites

""Coller dans description de site"" c'est dans le CCS?
tuning78

tuning78
***

Masculin
Messages : 160
Inscrit(e) le : 06/11/2007

Voir le profil de l'utilisateur http://the-world-of-custom.forumactif.fr
tuning78 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par Renald Jeu 2 Sep 2010 - 21:07

Non la description du site c'est dans le PA onglet général configuration du forum et la vous aurez "description du site"
Renald

Renald
*****

Masculin
Messages : 647
Inscrit(e) le : 27/04/2006

Voir le profil de l'utilisateur http://t-c-d.forumactif.com
Renald a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par suigetsu deus Jeu 2 Sep 2010 - 21:25

Merci beaucoup pour votre aide, l'effet fonctionne merveilleusement sur mon forum et l'effet Jquery est magnifique, encore merci Very Happy
avatar

suigetsu deus
Nouveau membre

Messages : 22
Inscrit(e) le : 15/05/2010

Voir le profil de l'utilisateur http://phalange-spartiate.forum-pro.fr
suigetsu deus a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par Renald Jeu 2 Sep 2010 - 21:31

Effectivement l'effet rend bien.
Mais je ne comprends pas pourquoi le premier code n'a pas fonctionné???

Sinon dans le code a mettre dans les catégories et forums la fin est inutile.
</a></div></div>
Renald

Renald
*****

Masculin
Messages : 647
Inscrit(e) le : 27/04/2006

Voir le profil de l'utilisateur http://t-c-d.forumactif.com
Renald a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image s'éclairsit au passage du curseur

Message par Adam_sfp Jeu 2 Sep 2010 - 22:01

suigetsu deus a écrit:Merci beaucoup pour votre aide, l'effet fonctionne merveilleusement sur mon forum et l'effet Jquery est magnifique, encore merci Very Happy
Bien content que cela vous convienne..
Vous pouvez personnaliser l'image via le ccs
En prenant toujours exemple sur la même image et pour rajouter un cadre de couleur
Code:
<div id="images"><a href="#"><img src="http://sd-1.archive-host.com/membres/up/37821634957680146/fade/images/news.jpg" alt="NEWS" width="650" height="162" border="0" class="latest_img" /></a></div>

Après <a href="#"> vous pouvez mettre un lien par exemple <a href="http://www.google.fr">
l'image devient cliquable.

et rajouter dans votre CSS
Code:
#images {
   width: 650px;
   border: 1px solid #363636;
   float: left;
   background-color: #2d2d2d;
   margin-top: 7px;
   line-height: 20px;
   padding-top: 8px;
   padding-bottom: 8px;
   padding-right: 8px;
   padding-left: 8px;
}




Renald a écrit:Effectivement l'effet rend bien.
Mais je ne comprends pas pourquoi le premier code n'a pas fonctionné???

Sinon dans le code a mettre dans les catégories et forums la fin est inutile.
</a></div></div>
Effectivement c'est rectifié quelques restes lors du copier coller...
Very Happy

Cordialement.
Adam_sfp

Adam_sfp
Membre actif

Masculin
Messages : 4465
Inscrit(e) le : 18/04/2008

Voir le profil de l'utilisateur http://antonyadam.kanak.fr
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Page 2 sur 2 Précédent  1, 2

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

- Sujets similaires

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