Insersion d'un lien dans <input>
Margue
-
Margue -
Margue -
Bonjour,
J'ai créé une page avec des images qui s'agrandissent au passage de la souris. Jusqu'ici tout va bien. Seulement, je voudrais que l'on puisse cliquer sur la grande image qui s'affiche pour pouvoir accèder à une page htm et n'y parviens pas.
Voici le code de l'une des images en question :
<input type="image" name="page" value="main" onMouseOut="src='1ehpad.jpg'" onMouseOver="src='1ehpadbis.jpg'" src="1ehpad.jpg" lowsrc="2vvf.JPG" alt="E.H.P.A.D.">
Tour ceci en une seule ligne.
Merci par avance pour vos réponses.
J'ai créé une page avec des images qui s'agrandissent au passage de la souris. Jusqu'ici tout va bien. Seulement, je voudrais que l'on puisse cliquer sur la grande image qui s'affiche pour pouvoir accèder à une page htm et n'y parviens pas.
Voici le code de l'une des images en question :
<input type="image" name="page" value="main" onMouseOut="src='1ehpad.jpg'" onMouseOver="src='1ehpadbis.jpg'" src="1ehpad.jpg" lowsrc="2vvf.JPG" alt="E.H.P.A.D.">
Tour ceci en une seule ligne.
Merci par avance pour vos réponses.
A voir également:
- Insersion d'un lien dans <input>
- Créer un lien pour partager des photos - Guide
- Lien url - Guide
- Verificateur de lien - Guide
- Faux lien prank - Forum Autoit / batch
- Lien copié - Forum Mobile
14 réponses
Merci pour ton code.
Cela fonctionne mais seulement, cela me met l'image dans une nouvelle cellule de mon tableau dans lequel j'ai mis mes images. Du coup, je perds ma mise en page; est-ce normal ? Comment y remédier ?
Cela fonctionne mais seulement, cela me met l'image dans une nouvelle cellule de mon tableau dans lequel j'ai mis mes images. Du coup, je perds ma mise en page; est-ce normal ? Comment y remédier ?
Merci pour ta réponse. Je viens d'essayer de règler le souci mais cela continue à me désaler tout.
Pour mes images qui grossissent au passage de la souris, je ne connais pas d'autre manière que l'input; il en existe une plus simple qui puisse fonctionner avec un lien ordinaire (a href) ?
Sinon, concrètement, j'ai une mosaïque de 5 images sur 5 et quand je mets le lien sur la première image par exemple, elle reste en haut à gauche et les 4 autres se retrouvent plus bas. Tu vois mieux mon problème ?
Pour mes images qui grossissent au passage de la souris, je ne connais pas d'autre manière que l'input; il en existe une plus simple qui puisse fonctionner avec un lien ordinaire (a href) ?
Sinon, concrètement, j'ai une mosaïque de 5 images sur 5 et quand je mets le lien sur la première image par exemple, elle reste en haut à gauche et les 4 autres se retrouvent plus bas. Tu vois mieux mon problème ?
Merci à vous pour votre précisieuse aide !
J'ai pu résoudre mon souci grâce à vos réponses.
Maintenant, j'ai un dernier souci. Je souhaite que l'on puisse cliquer sur certaines images qui sont petites pour les voir en plus grand dans une fenetre qui fasse la taille de l'image et qui se referme par une croix ou autre. J'ai vu des solutions en java et css mais n'y a t-il pas plus simple ? Sinon, tant pis, merci de m'indiquer la marche à suivre.
Merci encore et d'avance.
PS : il est vrai que si cela pose problème que je reste anonyme, il faudrait ne pas accepter les messages anonymes et demander une inscription avant de poster; ce que j'aurais fait s'il n'était pas possible de rester anonyme...
J'ai pu résoudre mon souci grâce à vos réponses.
Maintenant, j'ai un dernier souci. Je souhaite que l'on puisse cliquer sur certaines images qui sont petites pour les voir en plus grand dans une fenetre qui fasse la taille de l'image et qui se referme par une croix ou autre. J'ai vu des solutions en java et css mais n'y a t-il pas plus simple ? Sinon, tant pis, merci de m'indiquer la marche à suivre.
Merci encore et d'avance.
PS : il est vrai que si cela pose problème que je reste anonyme, il faudrait ne pas accepter les messages anonymes et demander une inscription avant de poster; ce que j'aurais fait s'il n'était pas possible de rester anonyme...
Merci beaucoup pour la méthode window.open qui marche bien.
Maintenant, on me demande s'il ne m'est pas possible de créer un agrandissement sans passer par un pop up comme sur ces sites :
http://www.lm3s.com/ (images dans actualités)
https://axesetsites.com/ (images des dernières réalisations)
Quelle méthode est utilisée pour faire ce genre d'agrandissements, SVP ?
Maintenant, on me demande s'il ne m'est pas possible de créer un agrandissement sans passer par un pop up comme sur ces sites :
http://www.lm3s.com/ (images dans actualités)
https://axesetsites.com/ (images des dernières réalisations)
Quelle méthode est utilisée pour faire ce genre d'agrandissements, SVP ?
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Salut,
<input> est un élément de formulaire. Normalement, les formulaires servent à dialoguer avec le serveur, mais tu peux t'en servir simplement pour faire des liens...
Pour qu'un clic sur ton input amène vers la page alpha.htm (par exemple), il suffit de le placer dans un formulaire dans lequel tu précises l'action, c'est-à-dire traditionnellement le fichier qui reçoit les données dans le cas d'un traitement serveur, et plus simplement la page qui s'affichera.
Le code sera donc le suivant :
Si tu es en html strict ou frameset, n'oublie pas de fermer ton input.
<input> est un élément de formulaire. Normalement, les formulaires servent à dialoguer avec le serveur, mais tu peux t'en servir simplement pour faire des liens...
Pour qu'un clic sur ton input amène vers la page alpha.htm (par exemple), il suffit de le placer dans un formulaire dans lequel tu précises l'action, c'est-à-dire traditionnellement le fichier qui reçoit les données dans le cas d'un traitement serveur, et plus simplement la page qui s'affichera.
Le code sera donc le suivant :
<form action="alpha.htm"> <input ...> </form>
Si tu es en html strict ou frameset, n'oublie pas de fermer ton input.
Le form est un élément de type block, il a peut-être des marges "baladeuses"... J'aimerais avoir un screen pour voir.
Si c'est bien un problème de marge, il suffit de les retirer ^^ avec le CSS :
D'ailleurs tant que j'y suis, j'attire ton attention sur un point délicat : les marges par défaut ne sont pas les mêmes sous tous les navigateurs. Pour être sûr de ta mise en page, commence par toutes les supprimer :
P.S. : J'ai dit une connerie hier, si tu es en strict ou frameset, tu dois mettre obligatoirement un élément block dans ton form, donc pas directement input ! Essaye une div ou un fieldset.
P.S.2 : t'es obligé d'utiliser un input ? Parce que sinon, tu mets une <a href="..."><img machin...></a> en supprimant les bordures sur l'image et c'est bon...
Si c'est bien un problème de marge, il suffit de les retirer ^^ avec le CSS :
form {
padding : 0;
border : none;
margin : 0;
}
D'ailleurs tant que j'y suis, j'attire ton attention sur un point délicat : les marges par défaut ne sont pas les mêmes sous tous les navigateurs. Pour être sûr de ta mise en page, commence par toutes les supprimer :
* {
padding : 0;
border : none;
margin : 0;
} et ajoutes-en sur les éléments qui en ont besoin après.
P.S. : J'ai dit une connerie hier, si tu es en strict ou frameset, tu dois mettre obligatoirement un élément block dans ton form, donc pas directement input ! Essaye une div ou un fieldset.
P.S.2 : t'es obligé d'utiliser un input ? Parce que sinon, tu mets une <a href="..."><img machin...></a> en supprimant les bordures sur l'image et c'est bon...
bonjour
ceci est un forum d'entraide, l'accès y est bien sur totalement libre,
mis ... être inscrit serait la moindre des politesses, ne serait-ce que par égard pour les membres qui vont essayer de vous répondre !
ne restez donc pas anonyme, inscrivez-vous
merci
@mitiés
b g
ceci est un forum d'entraide, l'accès y est bien sur totalement libre,
mis ... être inscrit serait la moindre des politesses, ne serait-ce que par égard pour les membres qui vont essayer de vous répondre !
ne restez donc pas anonyme, inscrivez-vous
merci
@mitiés
b g
Mais si il donner le lien de la page on pourrai mieux comprendre le probleme !!!! Peut être non ??!!
Sinon perso je savais pas qu'on passer par input pour faire une image survolée !!!!!! Input c'est pour les boutons sinon
ESSAYE CA PLUTOT
<IMG onmouseover="this.src='image2.jpg'" src=image1.jpg
onmouseout="this.src='image1.jpg'">
Sinon perso je savais pas qu'on passer par input pour faire une image survolée !!!!!! Input c'est pour les boutons sinon
ESSAYE CA PLUTOT
<IMG onmouseover="this.src='image2.jpg'" src=image1.jpg
onmouseout="this.src='image1.jpg'">
@Margue,
je ne connaissais pas la méthode input donc si ça marche je te fais confiance.
J'attends un screenshot, ou mieux, un lien vers ta page de test pour avoir une idée plus précise :)
Sinon, j'ai retrouvé une page intéressante : effet de zoom css
Edit : Le script direct dans les onMouseMachin, vaut mieux éviter, ça rend le code moins lisible et donc les mises à jour plus difficiles... vaut mieux toujours exporter le javascript.
Par exemple, je déclare une fonction "resize" dans une balise script dans le head, ou mieux dans un fichier externe, et après :
onMouseOver="this.resize()"
Bon, le mieux est encore de passer aux gestionnaires d'évènements, mais c'est une autre histoire... :]
je ne connaissais pas la méthode input donc si ça marche je te fais confiance.
J'attends un screenshot, ou mieux, un lien vers ta page de test pour avoir une idée plus précise :)
Sinon, j'ai retrouvé une page intéressante : effet de zoom css
Edit : Le script direct dans les onMouseMachin, vaut mieux éviter, ça rend le code moins lisible et donc les mises à jour plus difficiles... vaut mieux toujours exporter le javascript.
Par exemple, je déclare une fonction "resize" dans une balise script dans le head, ou mieux dans un fichier externe, et après :
onMouseOver="this.resize()"
Bon, le mieux est encore de passer aux gestionnaires d'évènements, mais c'est une autre histoire... :]
Attention à la confusion : java est un langage à compilateur, il nécessite un support installé sur l'ordinateur ; javascript est un langage de script embarqué, interprété par un navigateur web (le plus souvent). La ressemblance de leurs noms vient du fait qu'ils ont été créés au même moment par Sun Microsystems pour Netscape, ils étaient sensés être complémentaires.
Et effectivement il n'y a pas plus simple que la méthode Javascript, car javascript est le seul moyen de redimensionner la fenêtre.
Perso je ne m'en suis jamais servi car j'ai horreur des popups, mais je sais qu'il faut utiliser la fonction window.open(). A toi de chercher pour le reste ;)
Et effectivement il n'y a pas plus simple que la méthode Javascript, car javascript est le seul moyen de redimensionner la fenêtre.
Perso je ne m'en suis jamais servi car j'ai horreur des popups, mais je sais qu'il faut utiliser la fonction window.open(). A toi de chercher pour le reste ;)
Alors sur le site des écrans plats, ils ont recours à la bibliothèque de scripts scriptaculous qui permet de faire tout un tas d'effets graphiques facilement.
Et pour l'autre, ... euh c'est pareil ^^ c'est une bibliothèque très répandue !
Si tu veux apprendre à te servir de scriptaculous, il te faudra un peu de courage, mais après, tout devient plus simple ;)
Sache qu'elle dépend d'une autre bibliothèque appellée Prototype.
Et pour l'autre, ... euh c'est pareil ^^ c'est une bibliothèque très répandue !
Si tu veux apprendre à te servir de scriptaculous, il te faudra un peu de courage, mais après, tout devient plus simple ;)
Sache qu'elle dépend d'une autre bibliothèque appellée Prototype.
