Codage image

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

Résolu Codage image

Message par Park Ha Gi le Mar 26 Oct - 9:15

Bonjour,
Voilà, il y a quelque temps, j'ai voulu essayer cet effet ( voir photo ) mais sans résultat. Ce que j'aimerais : une image, entouré par un cadre ( fait en codage ), avec une opacité réduite et qui lors du passage de la souris dessus, le cadre et l'image soit dans leur opacité normal ...
Spoiler:

Merci d'avance Smile


Dernière édition par Park Ha Gi le Mer 27 Oct - 16:04, édité 2 fois

Park Ha Gi
**

Féminin
Messages : 76
Inscrit(e) le : 03/12/2009

http://www.mybrowserbar.com/cgi/errors.cgi?q=http%3A%2F%2Fwww.th
Park Ha Gi a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Arlem le Mar 26 Oct - 9:58


Arlem
+ Hyperactif +

Messages : 2550
Inscrit(e) le : 30/06/2009

Arlem a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Park Ha Gi le Mar 26 Oct - 16:03

Bonjour, merci pour votre réponse, mais je viens d'essayer mais ça ne marche pas du tout --"

Park Ha Gi
**

Féminin
Messages : 76
Inscrit(e) le : 03/12/2009

http://www.mybrowserbar.com/cgi/errors.cgi?q=http%3A%2F%2Fwww.th
Park Ha Gi a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par ge80 le Mar 26 Oct - 16:06

Bonjour

Pouvez-vous placer, sur ce forum, le code que vous avez utilisé ?
J'essaierai de le corriger ou d'en proposer un autre.

Cordialement
ge



Edit : correction car le post vient d'être mis en résolu.
Le problème est réglé.


ge80
+ Hyperactif +

Masculin
Messages : 16158
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Park Ha Gi le Mar 26 Oct - 16:26

Euh, non, le post n'est pas résolu, c'est bizarre, je l'ai pas mis ?? ^^"

Code:
<style TYPE="text/css">
<!--
.opac { filter:alpha(opacity=30) }
.clair { filter: alpha(opacity=100)}
-->
</style>

<img class='opac'
onmouseover="this.className='clair'" onmouseout="this.className='opac'" src="http://i25.servimg.com/u/f25/14/05/20/17/phg10.jpg">
Voilà ce que j'ai mis comme code.

Park Ha Gi
**

Féminin
Messages : 76
Inscrit(e) le : 03/12/2009

http://www.mybrowserbar.com/cgi/errors.cgi?q=http%3A%2F%2Fwww.th
Park Ha Gi a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par ge80 le Mar 26 Oct - 16:29

Tiens bizarre, il n'y a que l'auteur du sujet qui puisse le mettre en résolu.

Je regarde votre code après avoir terminé une autre aide....


ge80
+ Hyperactif +

Masculin
Messages : 16158
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Park Ha Gi le Mar 26 Oct - 16:59

Oui, effectivement, c'est bizarre ^^"
Okay, merci beaucoup Smile

Park Ha Gi
**

Féminin
Messages : 76
Inscrit(e) le : 03/12/2009

http://www.mybrowserbar.com/cgi/errors.cgi?q=http%3A%2F%2Fwww.th
Park Ha Gi a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par ge80 le Mar 26 Oct - 18:03

Ce code fonctionne dans une page html, un widget ou en message d'accueil.

Par contre il ne fonctionne pas pour Firefox.
In Firefox (opacity:x) x can be a value from 0.0 - 1.0. A lower value makes the element more transparent.

In IE (filter:alpha(opacity=x)) x can be a value from 0 - 100. A lower value makes the element more transparent.


ge


ge80
+ Hyperactif +

Masculin
Messages : 16158
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Adam_sfp le Mar 26 Oct - 18:18

Bonjour

Vous pouvez utiliser un script à 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>

et ensuite pour votre image
rajouter la class de cette manière
Code:
<img src="http://i25.servimg.com/u/f25/14/05/20/17/phg10.jpg" alt="test" width="50" height="100" border="0" class="latest_img" />

Cordialement.

Adam_sfp
+ Hyperactif +

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

http://antonyadam.1fr1.net/portal.htm
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Park Ha Gi le Mar 26 Oct - 18:21

Merci beaucoup à vous deux ^^
Ca marche, par contre est-ce que se serait trop vous demander comment faire pour l'encadré ?

Park Ha Gi
**

Féminin
Messages : 76
Inscrit(e) le : 03/12/2009

http://www.mybrowserbar.com/cgi/errors.cgi?q=http%3A%2F%2Fwww.th
Park Ha Gi a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Adam_sfp le Mar 26 Oct - 20:17

Bonsoir
A ce moment la vous pouvez procéder de cette manière
Mettre votre image dans une div

Code:
<div id="images"><a href="#"><img src="http://i25.servimg.com/u/f25/14/05/20/17/phg10.jpg" alt="test" width="50" height="100" border="0" class="latest_img" /></a></div>

*Après href vous pouvez mettre un lien en cliquant sur l'image on est redirigé.

Pour le cadre autour de l'image vous pouvez le personnaliser via la feuille de style CSS

Par exemple coller ceci dans le CSS
Code:

#images {
  width: 50px;
  border: 2px dashed #00A5CD;
  float: center;
}

Que vous pouvez bien sur modifier..
wight --> largeur de l'image
border 2px -->épaisseur du cadre
dashed --> le style du cadre vous pouvez le remplacer par dotted ,
solid , double , groove , ridge ...etc

#00A5CD -->le code couleur du cadre
float: center; -->position de l'image


Cordialement.






Adam_sfp
+ Hyperactif +

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

http://antonyadam.1fr1.net/portal.htm
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Park Ha Gi le Mar 26 Oct - 23:24

Merci beaucoup. Encore une dernière petit question et après j'arrête Wink
Comment faire pour que le contour fasse comme l'image, c'est à dire, avec l'opacité ? Et également, modifier la valeur de l'opacité ?

Park Ha Gi
**

Féminin
Messages : 76
Inscrit(e) le : 03/12/2009

http://www.mybrowserbar.com/cgi/errors.cgi?q=http%3A%2F%2Fwww.th
Park Ha Gi a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Adam_sfp le Mer 27 Oct - 9:28

Bonjour

Je crois bien que l'opacité prend effet uniquement sur l'image.
Pour modifier la valeur de l'opacité il faut éditer le script
http://sd-1.archive-host.com/membres/up/37821634957680146/fade/js/custom.js

Changer les valeurs et l'héberger à nouveau.

Cordialement.

Adam_sfp
+ Hyperactif +

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

http://antonyadam.1fr1.net/portal.htm
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Park Ha Gi le Mer 27 Oct - 10:18

Okay, merci beaucoup Smile

Park Ha Gi
**

Féminin
Messages : 76
Inscrit(e) le : 03/12/2009

http://www.mybrowserbar.com/cgi/errors.cgi?q=http%3A%2F%2Fwww.th
Park Ha Gi a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Codage image

Message par Adam_sfp le Mer 27 Oct - 10:31

Bonjour,

Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à :
  • éditer votre premier message,
  • cocher l'icône résolu
  • Et enregistrer en cliquant sur


Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton

A bientôt sur ForumActif Smile

Adam_sfp
+ Hyperactif +

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

http://antonyadam.1fr1.net/portal.htm
Adam_sfp 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