Rechercher : dans
Par :

Popup sans être une popup avec window.open

Dernière réponse le 16 oct 2009 à 23:07:46 Pascal_22, le 11 jun 2008 à 19:20:33 
 Signaler ce message aux modérateurs

Bonjour à tous,

Voici mon défis. Ce que j'aimerais faire c'est un formulaire d'inscription mais sur une popup sans être une popup window (windows.open .....).

Ce que je veux c'est comme sur le site www.zellers.com
Si on clique en haut complètement de la page sur l'image en rouge "Voir la carte de jeu 5 minutes pour gagner", quand on clique dessus, c'Est comme une nouvelle fenêtre qui s'ouvre au centre de l'écran mais pas dans un nouvelle fenêtre windows, on dirais soit une DIV ou autre ... et le reste de la page est disable/désactivé tant que la petite fenêtre n'est pas fermé.

Alors moi ce que je veux faire, c'est de mettre mon formulaire d'inscription sur la nouvelle "fenêtre qui s'ouvre" ou DIV. comme celui de www.zellers.com

Car sur le site www.zellers.com, si on trouve les 5 lettres caché sur le site et qu'on les place dans le bon ordre, un formulaire d'enregistrement apparait sur la popup window ( ou DIV).

Est-ce que quelqu'un peut m'aidé SVP ??

Merci beaucoup de m'aider !!

Pascal_22

Configuration: Windows XP
Internet Explorer 7.0

Meilleures réponses pour « Popup sans être une popup avec window.open » dans :
Javascript - Créer une popup VoirProblème Comment créer une fenêtre pop-up qui s'ouvrent à l'ouverture d'une page ? Solution Il suffit d'utiliser le code suivant : window.open("TON SITE"); Notez que les pop-ups seront généralement...
Javascript - L'objet window VoirLes particularités de l'objet window L'objet window est l'objet par excellence dans Javascript, car il est le parent de chaque objet qui compose la page web, il contient donc : l'objet document: la page en elle-même l'objet location: le lieu de...

1

Tiller, le 11 jun 2008 à 20:09:49
  • +8

<div style="z-index: 99; display: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%" id="popup">
	<table border="0" cellpadding="0" cellspacing="0" style="width: 100%; height: 100%">
		<tr>
			<td align="center">
				<div style="width: 300px; height: 300px; border: 1px solid #000000; background: #FFFFFF">Et sa fais une jolie fenetre de 300x300</div>
			</td>
		</tr>
	</table>
</div>

<div onclick="document.getElementById('popup').style.display = 'block'">Affiche la popup</div>


Apres tu peux mettre un effet "semi transparent" autour en faisant:
<div style="z-index: 99; display: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%" id="popup">
	<table border="0" cellpadding="0" cellspacing="0" style="width: 100%; height: 100%; background: url('grille.gif')">
		<tr>
			<td align="center">
				<div style="width: 300px; height: 300px; border: 1px solid #000000; background: #FFFFFF">Et sa fais une jolie fenetre de 300x300</div>
			</td>
		</tr>
	</table>
</div>

<div onclick="document.getElementById('popup').style.display = 'block'">Affiche la popup</div>

grille.gif que tu peux trouver ici:
http://skullandbones.free.fr/grille.gif
On dit que les oiseaux sont libres dans le ciel,
Mais la vraie liberté n'est pas celle d'avoir un endroit où se poser ?

Répondre à Tiller

2

Pascal_22, le 12 jun 2008 à 14:31:31

Salut Tiller,

Merci mille fois, c'est exactement ce que je veux !!

Par contre, j'ai remarquer que la div qu'on ouvre ne veux pas se refermer, donc pour la refermer, si je mets un lien "FERMER", Est-ce qu'il faut que je remettre la propriété display à "none" ??

Merci encore !

Pascal_22

Répondre à Pascal_22

3

Tiller, le 12 jun 2008 à 17:03:17

Ouep

On dit que les oiseaux sont libres dans le ciel,
Mais la vraie liberté n'est pas celle d'avoir un endroit où ­se poser ?

Répondre à Tiller

4

Pascal_22, le 12 jun 2008 à 18:24:33

Tiller !

Merci Mille fois !!

Pascal_22

Répondre à Pascal_22

5

ju0123456789, le 3 mar 2009 à 16:18:33

Je ne comprends pas comment mettre le lien "fermer", je ne peux pas utiliser un evenement javascript window.close puisqu'il s'agit d'un div, et quand je mets display "none" à la place de block il n'y a rien qui s'ouvre quand je clique sur le lien.
Quelqu'un peut il m'eclairer svp ?
MErci

Répondre à ju0123456789

6

M@x, le 7 avr 2009 à 22:34:24

Il faut remettre (dans la div qui s'affiche) avant ou après "Et sa fais une jolie fenetre de 300x300" :

<div onclick="document.getElementById('popup').style.display = 'none'">fermer la popup</div>

et voici un lien pour fermer la div.

Répondre à M@x

7

hamza_bba, le 25 avr 2009 à 21:55:25

Bonsoir,

cette solution pose un problème d'affichage sous IE6, SVP comment le rend compatible avec cette navigateur

Répondre à hamza_bba

8

BartoLoco, le 24 aoû 2009 à 07:04:00

Superbe la méthode
Merci a toi, Tiller

Répondre à BartoLoco

9

alousse, le 22 sep 2009 à 16:53:38

Merci mille fois, c'est exactement ce que je veux !!
et j'ai une petite question c'est que je veut que la fenetre popup s'ouvre en meme temp de chargement de la page sans click ! et merci
j'ai vue cette fonction ( onclick ) mais je sais pa comment changer et quoi mette a sa place!! :)

Répondre à alousse

10

limix429, le 16 oct 2009 à 09:26:17

Bonjour,

Il me semble qu'à la place de "onclick" tu peux mettre "onLoad" tu devrais chercher de ce coté.

Répondre à limix429

11

 alousse, le 16 oct 2009 à 23:07:46

Oui evidement c'est ce que j'ai essayer de faire mais il marche pas . si vous pouvez me donner le code complet pour ce popup serai mieu... par ce que j'ai essayer de modifier mais en vein

Répondre à alousse