Effet Image

Statut
N'est pas ouverte pour d'autres réponses.

Onefive

Freddy Tougaux
Voila j aimerai créé une image qui reagi au passage de la souris


quand on ne passe pas dessus l image est pixeliser

quand on passe elle devient net


Merci d avance :oops:
 

Fogiafor

Elite
Red Bull a dit:
Voila j aimerai créé une image qui reagi au passage de la souris


quand on ne passe pas dessus l image est pixeliser

quand on passe elle devient net


Merci d avance :oops:
du parle de quoi sur le un site web???? soit plus explicite
 
R

RedCross

ex membre
Oui, c'est un simple filtre de IE, je te file ça de suite ...
 

k o D

Elite
je sais qu'avec ie on savait faire ce genre de truc facilement, mais je sais plus où j'ai vu çà.
 
1er
OP
Onefive

Onefive

Freddy Tougaux
Et en fait ca marche comment?


J aimerai prendre une image nimporte la quel et savoir fair cette effet c est interessant pour un site :)


(C est pour moi et pour le site de PRIMAL bah oui je le fais puisque personne veut l aidé :) )
 

EINST

⭐⭐⭐⭐⭐
en fait, tu dois avoir les 2 images, 1 pixellisé et l'autre normal.

puis dans ton code html, t'auras un truc qui met tel ou tel image en fonction que la souris se trouve dessus ou non, v rechercher la ligne de code exact...
 

hehe

PANCAKE !
ou alors un simple rollover
2 images: 1 pixellisée, 1 non pixellisée
il ne reste plus qu'à définir le rollover à partir de ces 2 images
mais si un filtre IE existe...
 

♥♥♥

ex membre
hehe a dit:
ou alors un simple rollover
2 images: 1 pixellisée, 1 non pixellisée
il ne reste plus qu'à définir le rollover à partir de ces 2 images
mais si un filtre IE existe...
Je pensais plutôt comme toi... et non à ce filtre IE! :D
 
1er
OP
Onefive

Onefive

Freddy Tougaux
Et je fais ca avec?


flash, editeur de page html, code HTML a ecrire ...
 
Code:
<img src='tonimagenormal.jpg' onMouseOver="this.src="tonimagepixel.jpg" OnMouseOut="this.src='tonimagenormal.jpg'">
 
R

RedCross

ex membre
Grace aux effets IE, c'est automatique et très pratique évidemment :)

Le code de ton image :

Code:
<img src=images.jpg border=0 width=151 height=198  style="filter:progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=100,Duration=1)" onLoad="ejs_img_fx(this)" onMouseOver="ejs_img_fx(this)">
Je pense qu'il faut aussi mettre ce script dans le HEAD de ta page :

Code:
<script>
function ejs_img_fx(img){ 
if(img && img.filters && img.filters[0]){
img.filters[0].apply();
img.filters[0].play();
}
}

</script>
 
RedCross a dit:
Grace aux effets IE, c'est automatique et très pratique évidemment :)

Le code de ton image :

Code:
<img src=images.jpg border=0 width=151 height=198  style="filter:progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=100,Duration=1)" onLoad="ejs_img_fx(this)" onMouseOver="ejs_img_fx(this)">
Je pense qu'il faut aussi mettre ce script dans le HEAD de ta page :

Code:
<script>
function ejs_img_fx(img){ 
if(img && img.filters && img.filters[0]){
img.filters[0].apply();
img.filters[0].play();
}
}

</script>
IE seulement :oops:
 
1er
OP
Onefive

Onefive

Freddy Tougaux
RedCross a dit:
Grace aux effets IE, c'est automatique et très pratique évidemment :)

Le code de ton image :

Code:
<img src=images.jpg border=0 width=151 height=198  style="filter:progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=100,Duration=1)" onLoad="ejs_img_fx(this)" onMouseOver="ejs_img_fx(this)">
Je pense qu'il faut aussi mettre ce script dans le HEAD de ta page :

Code:
<script>
function ejs_img_fx(img){ 
if(img && img.filters && img.filters[0]){
img.filters[0].apply();
img.filters[0].play();
}
}

</script>

je sais j en demande beaucoup mais tu serai pas me donner un exemple? tu fait une image vite fais sur une page html :oops:
 
1er
OP
Onefive

Onefive

Freddy Tougaux
Le code que tu m a donné ne marche pas


Je met ton Script dans le language HTML de dream puis je remplace l image et ca fais rien
 
1er
OP
Onefive

Onefive

Freddy Tougaux
vla le code de la page quand je commence une nouvelle page

Code:
<html>

<head>
<title>Sans titre</title>
<meta name="generator" content="Namo WebEditor v5.0">
</head>

<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<p> </p>
</body>

</html>
Ou dois je mettre vos script?
 
fais comme je t'ai dit qq lignes plus haut, c'est 7 fois plus simple....
 
R

RedCross

ex membre
Bon, c'est quand même pas si compliqué que ça.

Le javascript est à mettre dans le head (donc : avant la balise </head> )
Et le long code, c'est l'image c'est tout. Tu remplace "image.jpg" par le nom de fichier de TON image.

Enfin, c'est clair non ?
Je te confirme que ça fonctionne nickel.
 
1er
OP
Onefive

Onefive

Freddy Tougaux
Code:
<html>

<head>
<img src='file:///D|/Marc/counter_logo.jpg' onMouseOver="this.src=" file:///D|/Marc/counter_logoflou.jpg" OnMouseOut="this.src='file:///D|/Marc/counter_logo.jpg'">
<title>Sans titre</title>
<meta name="generator" content="Namo WebEditor v5.0">
</head>

<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">



<p> </p>
</body>

</html>
vla mon code je comprend pas


(dsl je sais je suis mancho)
 
R

RedCross

ex membre
Ha ouais... je vois ...
Bon, faut quand même les bases de l'html quand on commence à faire ça hein ;)


Code:
<html> 

<head> 
<title>Sans titre</title> 
<meta name="generator" content="Namo WebEditor v5.0"> 
</head> 

<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red"> 

<img src='counter_logo.jpg' onMouseOver="this.src="counter_logoflou.jpg" OnMouseOut="this.src='counter_logo.jpg'"> 

<p> </p> 
</body> 

</html>

oui, et vire ça :
Code:
'file:///D|/Marc/counter_logo.jpg'
Mais fait plutot ça sinon, ca n'ira pas online :
Code:
'counter_logo.jpg'
 
Statut
N'est pas ouverte pour d'autres réponses.
Haut