Joueb.com
Envie de créer un weblog ?
ViaBloga
Le nec plus ultra pour créer un site web.
Débarrassez vous de cette publicité : participez ! :O)
Gamin
«Un imbécile qui marche va plus loin qu'un intellectuel assis.»
Michel Audiard.

Pink Floyd
S'identifier
Nom d'utilisateur
Mot de passe

Mot de passe oublié ?



Divers...
Favicons


free counters



Les stats... Free counter and web stats
La Radio



Pour les pressés, le lien direct (cliquez sur le haut-parleur) :

Ecouter le flux Ipnoze RETRO par le site


Chez moi
Rubik's Cube Etape 3 : la finition du cube... (208)
Pour ceux qui veulent résoudre le Rubik's Cube, la procédure... (28)
Anniversaire Joueb... en retard (41)
Le Rubik's Cube, étape 2 !! (28)
Happy New Year 2008 (32)
Gamin, le retour !! ;-) (42)

MotsCles


Quelques uns que je préfère...
liz : Jamais deux sans trois (0)
liz : La réalité (0)
liz : Jamais aucun auteur (0)
castor : Il y a de meilleures manières de ressembler à un ministre (0)
castor : Le monde est peuplé de génies (1)
castor : Petite devinette (2)
liz : Je vais t'acheter un nouveau (0)
castor : Partie de cache-cahe (0)
liz : J'ai remarqué (0)
castor : La citation du jour (0)
castor : Vous aimez le piano? Vous aimez les chats? (0)
castor : Vous aimez la nature? (2)
castor : La planète de la peur (1)
liz : J'ai regardé American (0)
aide : Java Training in Chennai | Certification | Online Courses (0)
castor : Petit sondage impromptu (3)

P'tits messages...
PierreDesiles : 30 03 2013 Un coucou de mon île à 32°, été austral oblige. Mon Blog est toujours OUT, je ne suis pas le seul. Encore un coup des hackers indésirables, ils n'ont rien à fou... ces gens là ! Biz ne m'a pas contacté. A+ Bjr à tous.

Gamin : 10.04.2013 J'ai restauré ton blog, Pierre, y'a que la mini-shout des commentaires qui ne fonctionne plus chez toi... J'ai averti Biz à ce sujet..
A++ :)

PierreDesiles : Merci pour ton aide, Biz a remis de l'ordre et la colonne de gauche est de nouveau présente. Je t'envoie un mail
@+ :)

PierreDesiles : colonne de droite (pardon)

alberto : Bonjour Gamin. Après avoir posté une vidéo, mon blog a buggé. Les articles ont disparu. Pourrais-tu le restaurer ? Bien à toi. Merci d'avance.

JujuLeBledard : ok ta mer

PierreDesiles : 20 09 2014 Bjr Gamin J'espère que tu vas bien. Mon blog tjrs HS sur les réponses d'articles, on peut encore le sauver? amitiés

Estel : Bonjour Gamin,
Juste pour vous dire un grand MERCI ! Je me suis dit que je devais un jour ou l'autre terminer mon Rubby's cube que je ne sais faire que jusqu'à la 2e couronne... depuis mes 8 ans... j'en ai 45 !! et grâce à vous, j'ai enfin pu le terminer !! J'ai pourtant chercher sur le net... des tutos ce n'est pas ce qui manque... mais franchement le vôtre est super clair. Merci encore à vous ! Estelle.




- ARCHIVES

Article précédent - Article suivant
11/07/2004
10h57
Technique, science...

Effet de roll-over sur une image par Gamin
On me l'avait demandé voici un petit bout de temps, voici la procédure...

Pour ceux qui savent, quand on passe le curseur de la souris sur l'image des Pink Floyd ou sur mon tétoucom (en haut à gauche), l'image change instantanément... Pour ceux qui ne savaient pas, faites donc l'essai !! ;))

On m'avait demandé la procédure voici déjà pas mal de temps... la voici donc !!

Petite précision, il faut que la mise en page soit éditable ! Donc, en clair, ça fonctionne pour tous ceux qui peuvent éditer leur skin personnelle, mais ça ne fonctionnera pas pour ceux qui utilisent encore les skins publiques (elles ne sont pas éditables).

Cet effet de roll-over se fait grâce à un petit javascript, que je vous mets ci-dessous, à placer entre les balises <head> et </head> de votre skin (juste après la balise <head>, ça ira parfaitement) :

<SCRIPT LANGUAGE="JavaScript">
/*
on precharge l'image de substitution
*/
i1 = new Image;
i1.src =http://gamin.joueb.com/images/Sylvain2_vignette.jpg;
i2 = new Image;
i2.src =http://gamin.joueb.com/images/Pink_Floyd2.jpg;
</SCRIPT>

Important : il faut impérativement que les deux images (celle d'origine et celle de substitution) aient les mêmes dimensions, sinon ça ne "collera" pas...

Ensuite, il faut aller à l'endroit de la skin où se trouve la commande d'affichage de l'image ou de la photo, et modifier comme suit :

La commande d'origine :

Tetoucom
<a href="http://joueb.com/users/gamin.shtml">
<img src=http://joueb.com/users/gamin_75x90.gif width=75 height=90 alt="Gamin">
</a>

Image Pink Floyd
<td width=262 valign=center>
<img src=http://gamin.joueb.com/images/Visages.gif ALT="Pink Floyd" width=262 height=152>
</td>

La commande modifiée :

Tetoucom
<a href="http://joueb.com/users/gamin.shtml">
<img src=http://joueb.com/users/gamin_75x90.gif width=75 height=90 name="nomimage1" alt="Gamin" onMouseOver="nomimage1.src=i1.src" onMouseOut="nomimage1.src='http://joueb.com/users/gamin_75x90.gif'">
</a>

Image Pink Floyd
<td width=262 valign=center>
<img name="nomimage2" src=http://gamin.joueb.com/images/Visages.gif ALT="Pink Floyd" width=262 height=152 onMouseOver="nomimage2.src=i2.src" onMouseOut="nomimage2.src='http://gamin.joueb.com/images/Visages.gif'">
</td>

Explication en clair :

Je reprends le script :

<SCRIPT LANGUAGE="JavaScript">
/*
on precharge l'image de substitution
*/
i1 = new Image;
i1.src =http://gamin.joueb.com/images/Sylvain2_vignette.jpg;
i2 = new Image;
i2.src =http://gamin.joueb.com/images/Pink_Floyd2.jpg;
</SCRIPT>

L'image de substitution (ma mini-photo) que j'ai mise pour le tétoucom prend l'appellation i1, et on précise que c'est une nouvelle image (i1 = new Image;), dont l'adresse est :
i1.src =http://gamin.joueb.com/images/Sylvain2_vignette.jpg;

Jusque là, rien de bien dur... Allons à la commande modifiée :

<a href="http://joueb.com/users/gamin.shtml">
<img src=http://joueb.com/users/gamin_75x90.gif width=75 height=90 name="nomimage1" alt="Gamin" onMouseOver="nomimage1.src=i1.src" onMouseOut="nomimage1.src='http://joueb.com/users/gamin_75x90.gif'">
</a>

L'adresse de l'image actuelle est indiquée (img src=http://joueb.com/users/gamin_75x90.gif) mais on lui donne tout de même le nom de nomimage1 (name="nomimage1") pour les besoins de l'application (et aussi pour la différencier des autres photos ou images s'il y en a)...
La commande onMouseOver="nomimage1.src=i1.src" signifie que si le curseur se trouve sur l'image, on charge l'image de substitution (i1.src) dont l'adresse a été indiquée dans le script.
La commande onMouseOut="nomimage1.src='http://joueb.com/users/gamin_75x90.gif'" veut dire que tant que la souris se trouve hors du champ de l'image, on affiche l'image d'origine (dont on donne l'adresse).

Ca peut paraître compliqué, mais en fait, c'est relativement simple...

A noter : le script se place TOUJOURS dans la skin, juste après la balise <head>... Par contre, l'affichage de l'image (ou de la photo) peut parfaitement se situer dans un bloc configurable (c'était dans la skin chez moi...)

Si vous avez pas tout compris, dites-le moi, mais j'ai essayé d'être le plus clair possible...

Bonnes modifications !! :))

Mots-clés : ,


Quelque chose à dire ?


Revenir à la page principale

Article précédent - Article suivant


Commentaires:

14/07/2004
17h44

1 - coucou (petit problème ) par ptit-ange-venu-des-enfers

salut je voulais savoir comment faire pour que, lorsque je pointe ma souris sur mon tétoucom on voit ma photo. (comme tu as fait sur ton joueb !) Serait-il possible que tu me le fasse parce que ça n'a pas l'air facile... J'ai lu ton article sur le sujet ;-p



Envie d'ajouter quelque chose ??





14/07/2004
18h43

2 - Re: coucou (petit problème ) par Gamin

Je peux te le faire... Seule restriction, il faut que ton tétoucom apparaisse sur ton joueb exactement comme c'est le cas chez moi !!

Autrement dit, ça ne fonctionnera pas dans un article, voire dans un commentaire, mais je peux toujours me pencher sur la question et voir si c'est réalisable, mais je pense que non...

Sinon, c'est possible de faire ça dans un bloc de présentation, avec ton tétoucom affiché, et ta photo qui viendrait derrière dès que la souris passe sur le tétoucom, ça, c'est faisable...

Maintenant que tu sais ce qui est faisable et non faisable, dis-moi ce que tu voudrais...



Envie d'ajouter quelque chose ??





14/07/2004
19h01

3 - Re: Re: coucou (petit problème ) par ptit-ange-venu-des-enfers

Je pense que dans un bloc de présentation ça serai bien ! Comme tu la fais sur le tien

je te remercie



Envie d'ajouter quelque chose ??





17/07/2004
09h59

10 - Re: Re: Re: coucou (petit problème ) par Gamin

C'est fait !! Tu peux aller voir le résultat !! ;))

Bisous...



Envie d'ajouter quelque chose ??





17/07/2004
15h35

11 - Re: Re: Re: Re: coucou (petit problème ) par ptit-ange-venu-des-enfers
merci beaucoup c'est vraiment gentil a toi merci j'aime beaucoup le résultat encore merci ;) bisous

Envie d'ajouter quelque chose ??





17/07/2004
15h37

12 - Re: Re: Re: Re: Re: coucou (petit problème ) par Gamin
Mais de rien... :)

Envie d'ajouter quelque chose ??





15/07/2004
10h15

4 - Mouarf ! par Zoublitou
J'adore quand ça a l'air dur... ;-)

Je me penche dessus dans un mois quand je serais reviendue et que j'aurais plus qu'à penser "skiiiiiiin" et pas "la colo et ma super coupine m'attteeeeendent !!!!!"


Envie d'ajouter quelque chose ??





15/07/2004
12h22

5 - Re: Mouarf ! par Gamin
Je te souhaite à l'avance bien du plaisir, alors... ;))

Envie d'ajouter quelque chose ??





15/07/2004
13h14

6 - Re: et par tgtg
comment faire pour qu'un son prédéfini soit émis lorsqu'on passe avec la souris sur certains mots ou images?

Envie d'ajouter quelque chose ??





15/07/2004
13h30

7 - Re: Re: et par Gamin
Je ne sais pas... Je vais chercher et je te dirai ça...

Envie d'ajouter quelque chose ??





15/07/2004
13h43

8 - Re: Re: Re: et par tgtg
:-)

Envie d'ajouter quelque chose ??





15/07/2004
13h49

9 - Re: Re: Re: Re: et par Gamin

J'ai bien trouvé un petit javascript, mais il a l'air de ne pas fonctionner...

Va falloir que je le teste...



Envie d'ajouter quelque chose ??





25/10/2004
18h48

13 - Re: Re: Re: Re: Re: et par tgtg
en fait... un javascript ne risque-t-il pas de "perturber" l'affichage ou le fonctionnement du joueb?

Envie d'ajouter quelque chose ??





25/10/2004
21h47

14 - Re: Re: Re: Re: Re: Re: et par Gamin

Tout dépend du javascript utilisé... Celui que j'utilise pour le rollover sur les images, et celui de l'horloge (qui n'est pas visible sous Firefox, au passage) ne me causent aucun problème...

Celui que j'utilisais pour afficher une image dans un cadre indépendant, je l'ai viré, il me perturbait le fonctionnement de l'éditeur par exemple...



Envie d'ajouter quelque chose ??





25/10/2004
22h15

15 - Re: Re: Re: Re: Re: Re: Re: et par tgtg
c'est en testant qu'on le sait...:-)

Envie d'ajouter quelque chose ??





25/10/2004
22h33

16 - Re: Re: Re: Re: Re: Re: Re: Re: et par Gamin

Tout à fait, y'a aucun moyen de savoir à l'avance si ça va perturber ou pas...



Envie d'ajouter quelque chose ??





25/10/2004
23h07

17 - Re: Re: Re: Re: Re: Re: Re: Re: Re: et par tgtg
:-)

Envie d'ajouter quelque chose ??





Contenu : Gamin - Moteur de joueb : Niutopia (Biz) - Skin : Liz