ascreen de créer un siteIci nous allons voir comment créer un filtre sur image en utilisant un filtre.
Passez votre souris sur l'image pour voir le résultat.
Code de l'image:

<img class="left" style="filter:alpha(opacity=20); -moz-opacity:0.3" onmouseover="high
(this)" onmouseout="low(this)" alt="ascreen de cr&eacute;er un site" src="ascreen.jpg" 
height="90" width="120" />

Vous avez le choix entre placer directement le code qui suit entre les balises <head> et </head> ou dans un fichier .js . Code de la fonction du filtre à placer entre les balises <head> et </head>:

<script language="JavaScript" type="text/javascript">
function high(which2){
theobject=which2
highlighting=setInterval("highlightit(theobject)",20)
}
function low(which2){
clearInterval(highlighting)
if (which2.style.MozOpacity)
which2.style.MozOpacity=0.3
else if (which2.filters)
which2.filters.alpha.opacity=60
}
function highlightit(cur2){
if (cur2.style.MozOpacity<1)
cur2.style.MozOpacity=parseFloat(cur2.style.MozOpacity)+0.1
else if (cur2.filters&&cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=10
else if (window.highlighting)
clearInterval(highlighting)
}
</script>

Si vous placez le code ci-dessus dans un fichier dont l'extension se termine par .js, il vous faudra alors mettre le code ci-dessous entre les balise <head> et </head>. Supposons que vous nomez votre fichier js en  "effet-image.js", votre code entre <head> et </head> sera alors:

<script language="JavaScript" type="text/javascript" src="effet-image.js"></script>

Note:
Pour effectuer des changements sur le filtre, modifier les valeurs which2.style.MozOpacity=0.3 et which2.filters.alpha.opacity=60 dans le script et style="opacity: 0.3;"  directement dans le code d'affichage de l'image.

Catégorie JavaScript

Commentaire sur : Créer un filtre sur une image avec du javascript
Signaler une erreurSignaler une erreur

Script anti copieScript anti copieCodes et fonctions JavaScript utilesCodes et fonctions JavaScript utiles Compte à rebours JavascriptCompte à rebours Javascript