Image en pop up
3 participants
Page 1 sur 1
Image en pop up
bon c'est effectivement un peu plus technique...
Mais je suis arrivé à saisir le principe (pour info, c'est la première fois que je mets le nez dans du HTML...)
J'ai toutefois encore besoin de quelques précisions supplémentaires.
Dans mon (futur) site, je présente l'équipe pédagogique (il s'agit du site d'un stage musique) sur une page - appelons cette page pageprof., soit une photo et un nom par prof.
L'idée est que, pour accéder à la biographie détaillée d'un prof, l'on puisse cliquer sur son nom et ouvrir une page individuelle (un popup donc) que nous appelerons pagebio.
Question:
Sur quelle page (pageprof ou pagebio) insérer la balise:
a href="javascript:OuvrirPopup('http://ladressedemonpopup', '', 'resizable=no, location=no, width=480, height=360, menubar=no, status=no, scrollbars=yes, menubar=no')">ma super page qui s'ouvrira en pop-up
et sur quelle page
function OuvrirPopup(page,nom,option) {
window.open(page,nom,option);
}
il m'avait semblé comprendre que la première concernait la page qui commandait l'ouverture et la seconde, celle qui était ouverte en popup.
J'ai essayé dans ce sens sans succés...
Ai-je bien compris ?
Merci encore.
M.
Mais je suis arrivé à saisir le principe (pour info, c'est la première fois que je mets le nez dans du HTML...)
J'ai toutefois encore besoin de quelques précisions supplémentaires.
Dans mon (futur) site, je présente l'équipe pédagogique (il s'agit du site d'un stage musique) sur une page - appelons cette page pageprof., soit une photo et un nom par prof.
L'idée est que, pour accéder à la biographie détaillée d'un prof, l'on puisse cliquer sur son nom et ouvrir une page individuelle (un popup donc) que nous appelerons pagebio.
Question:
Sur quelle page (pageprof ou pagebio) insérer la balise:
a href="javascript:OuvrirPopup('http://ladressedemonpopup', '', 'resizable=no, location=no, width=480, height=360, menubar=no, status=no, scrollbars=yes, menubar=no')">ma super page qui s'ouvrira en pop-up
et sur quelle page
function OuvrirPopup(page,nom,option) {
window.open(page,nom,option);
}
il m'avait semblé comprendre que la première concernait la page qui commandait l'ouverture et la seconde, celle qui était ouverte en popup.
J'ai essayé dans ce sens sans succés...
Ai-je bien compris ?
Merci encore.
M.
michaeldian- Simple Membre
- Messages : 15
Inscription : 02/11/2007 Version iWeb : A remplir!
Re: Image en pop up
Je profite de ce fil pour corriger mes erreurs
pour faire un pop-up
Avec l'inspecteur de lien on fait un lien discret (une ponctuation par ex) vers l'image "monimage.png" qui est sur votre ordinateur
Sur la même page , on colle tout dans un HTML widget
Décorticons ensemble le code
une feuille HTML toute simple c'est
mais on rajoute des trucs
ça on le met par tradition
ça pour signaler qu'on va utiliser des caractères accentués
ça pour dire qu'on va mettre un pop-up dans a feuille
[code][code]
changer la largeur "width" et la longueur "height" et le nom de votre image "monimage.png"
ça concerne l'image sur laquelle vous allez cliquer pour faire apparaître le pop-up[code][code]
là encore changer le nom, la largeur, et la longueur. pour pouvez remplacer ce script aussi par un texte genre "cliquer ici pour voir mon pop-up"
pour faire un pop-up
Avec l'inspecteur de lien on fait un lien discret (une ponctuation par ex) vers l'image "monimage.png" qui est sur votre ordinateur
Sur la même page , on colle tout dans un HTML widget
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>votre titre de page</title>
<script language="javascript">
function OuvrirPopup(page,nom,option) {
window.open(page,nom,option);
}
</script>
</head>
<body>
<a href="javascript:OuvrirPopup('monimage.png', '', 'resizable=no, location=no, width=532, height=360, menubar=no, status=no, scrollbars=no ')"><img src="monimage.png"' width="50" height="50" /></a>
</body>
</html>
Décorticons ensemble le code
une feuille HTML toute simple c'est
- Code:
<html><head></head><body></body></html>
mais on rajoute des trucs
ça on le met par tradition
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
ça pour signaler qu'on va utiliser des caractères accentués
- Code:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
ça pour dire qu'on va mettre un pop-up dans a feuille
- Code:
<script language="javascript">
function OuvrirPopup(page,nom,option) {
window.open(page,nom,option);
}
</script>
[code][code]
changer la largeur "width" et la longueur "height" et le nom de votre image "monimage.png"
ça concerne l'image sur laquelle vous allez cliquer pour faire apparaître le pop-up[code][code]
là encore changer le nom, la largeur, et la longueur. pour pouvez remplacer ce script aussi par un texte genre "cliquer ici pour voir mon pop-up"
Re: Image en pop up
Ou alors utiliser un générateur de pop up comme ICI.
Voir Démo.
Voir Démo.
Dernière édition par 27Avenue le 16/4/2008, 20:28, édité 1 fois (Raison : Modifié adresse de mon site)
Invité- Invité
Re: Image en pop up
NE pas oublier que beaucoup active la fonction anti pop-up sur leur navigateur.
@+
@+
zepatente- Membre Accro
- Messages : 689
Inscription : 25/11/2007 Localisation : Québec
Version iWeb : A remplir!
Re: Image en pop up
zepatente a écrit:NE pas oublier que beaucoup active la fonction anti pop-up sur leur navigateur.
@+
Tu veux dire Menu Safari / Bloquer les fenêtres surgissantes, ce qui est différent d'un pop-up qui est ouvert par une action sur un bouton une image ou un lien texte.
Invité- Invité
Sujets similaires
» RollOver - MousOver- Images réactives, effets au passage de la souris
» Image par dessus IFrame?
» Zones réactives sur une image
» Changer du texte en image
» click image et retour...
» Image par dessus IFrame?
» Zones réactives sur une image
» Changer du texte en image
» click image et retour...
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum
|
|