Image placée sur l'index réactive à la souris

2 participants

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

Résolu Image placée sur l'index réactive à la souris

Message par Pilatus Ven 25 Nov 2016, 10:33

Détails techniques


Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://fredo-aeromodelisme.forumnormandie.com/

Description du problème

Bonjour, j'ai placé en mode "toutes les pages" sur mon forum quelques images à l'aide de ces codes javascript:

Code:
$(function(){
          $("body").append('<div style="position: absolute; top: 250px; right: 350px"><a  href=""><img  src="https://i37.servimg.com/u/f37/19/13/84/37/planeu11.png"  border="0" alt=""  /></a></div> /></a></div>');
});

Le petit soucis c'est qu'elles sont réactives au survol de la souris, quand on clique dessus cela actualise la page en cours. Comment modifier ce code pour que l'image ne soit plus cliquable, qu'elle soit complètement confondue avec le fond de page?
En plus elles changent de place suivant la résolution de l'écran et le zoom du navigateur, alors je me demande si c'est bien en javascript qu'il fallait placer ces petites images (l'avion, le planeur, le pilote et les combinés d'instruments).
Merci d'avance...


Dernière édition par Pilatus le Ven 25 Nov 2016, 21:35, édité 1 fois
Pilatus

Pilatus
**

Masculin
Messages : 89
Inscrit(e) le : 09/10/2016

https://fredo-aeromodelisme.forumnormandie.com/
Pilatus a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image placée sur l'index réactive à la souris

Message par lmc38510 Ven 25 Nov 2016, 18:26

Pilatus a écrit:

Code:
$(function(){
          $("body").append('<div style="position: absolute; top: 250px; right: 350px"><a  href=""><img  src="https://i37.servimg.com/u/f37/19/13/84/37/planeu11.png"  border="0" alt=""  /></a></div> /></a></div>');
});

Le petit soucis c'est qu'elles sont réactives au survol de la souris, quand on clique dessus cela actualise la page en cours. Comment modifier ce code pour que l'image ne soit plus cliquable, qu'elle soit complètement confondue avec le fond de page?.
Bonsoir "Pilatus"
Pour qu'elle ne soit plus réactive -> modifier le script comme suit:
Code:
$(function(){
          $("body").append('<div style="position: absolute; top: 250px; right: 350px"><img  src="https://i37.servimg.com/u/f37/19/13/84/37/planeu11.png"  border="0" alt=""  /></div> />');
});

Comme elle est placée -> difficile d'avoir une position identique suivant la résolution écran
La seule solution au lieu d'avoir deux images:

Image placée sur l'index réactive à la souris 877961outputVkJGXZ

et

Image placée sur l'index réactive à la souris Planeu11 Superposer les 2 et n'en faire qu'une Very Happy




lmc38510

lmc38510
*****

Masculin
Messages : 912
Inscrit(e) le : 22/02/2012

https://newparadigme.forumactif.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image placée sur l'index réactive à la souris

Message par Pilatus Ven 25 Nov 2016, 21:34


Grand merci, les images ne sont plus cliquables c'est impeccable!

Pour le fait qu'elles changent de place avec le zoom navigateur, je me doutais que ça allait être chaud Smile
J'ai déjà galéré à faire un gif animé avec transparence (faire les transparences sur CHAQUE png AVANT de créer le gif), ça va être encore plus dur d'y incorporer d'autres images sur les côtés mais je peux toujours tenter le coup.
En tout cas merci beaucoup.
Pilatus

Pilatus
**

Masculin
Messages : 89
Inscrit(e) le : 09/10/2016

https://fredo-aeromodelisme.forumnormandie.com/
Pilatus a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image placée sur l'index réactive à la souris

Message par lmc38510 Ven 25 Nov 2016, 21:39

Pilatus a écrit:
Grand merci, les images ne sont plus cliquables c'est impeccable!

Pour le fait qu'elles changent de place avec le zoom navigateur, je me doutais que ça allait être chaud Smile
J'ai déjà galéré à faire un gif animé avec transparence (faire les transparences sur CHAQUE png AVANT de créer le gif), ça va être encore plus dur d'y incorporer d'autres images sur les côtés mais je peux toujours tenter le coup.
En tout cas merci beaucoup.
pas si dur que cela Very Happy

Image placée sur l'index réactive à la souris 37f2d3bd2b36ebb22222
lmc38510

lmc38510
*****

Masculin
Messages : 912
Inscrit(e) le : 22/02/2012

https://newparadigme.forumactif.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image placée sur l'index réactive à la souris

Message par Pilatus Ven 25 Nov 2016, 21:48

elles sont pas à la bonne place Ptdr

en théorie ça doit donner ça:

Image placée sur l'index réactive à la souris Bannie10
Pilatus

Pilatus
**

Masculin
Messages : 89
Inscrit(e) le : 09/10/2016

https://fredo-aeromodelisme.forumnormandie.com/
Pilatus a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image placée sur l'index réactive à la souris

Message par lmc38510 Ven 25 Nov 2016, 21:51

Oui j'ai repris ta 1ère implantation Tssss

Au plaisir "Pilatus" Clin d\'oeil



lmc38510

lmc38510
*****

Masculin
Messages : 912
Inscrit(e) le : 22/02/2012

https://newparadigme.forumactif.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image placée sur l'index réactive à la souris

Message par Pilatus Ven 25 Nov 2016, 21:57

Si je réussi, je remontrais ce sujet pour vous en faire part.

Le plaisir est pour moi, comme à chaque fois que j'ai eu recours au FdF :thanks:
Pilatus

Pilatus
**

Masculin
Messages : 89
Inscrit(e) le : 09/10/2016

https://fredo-aeromodelisme.forumnormandie.com/
Pilatus a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image placée sur l'index réactive à la souris

Message par lmc38510 Ven 25 Nov 2016, 22:06

Si tu veux je te monte le "gif" ... le problème c'est qu'il fait déjà 1Mo Shocked

Pour mettre tes images sur la droite et que l'ensemble soit centré ... va falloir qu'il soit très large et je crains que le poids dépasse largement > 1Mo
lmc38510

lmc38510
*****

Masculin
Messages : 912
Inscrit(e) le : 22/02/2012

https://newparadigme.forumactif.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

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