Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > JavaScript
JavaScript Forum programmation JavaScript. Lire : Cours JavaScript, FAQ JavaScript, Toutes les FAQ JavaScript et Sources JavaScript
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 29/07/2011, 11h51   #1
Membre à l'essai
 
Inscription : janvier 2011
Messages : 34
Détails du profil
Informations forums :
Inscription : janvier 2011
Messages : 34
Points : 21
Points : 21
Par défaut popup "dans la page"

Bonjour, je cherche a créer une interface qu'il s'ouvre dans la page, voici un exemple :

image

je cherche un tutoriel ou une explication de comment c'est fait, mais avec pupop javascript etc sur google je ne trouve que la pupup classique

merci
Images attachées
Type de fichier : png exemple.png (76,4 Ko, 7 affichages)
manserk est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 29/07/2011, 12h25   #2
Membre Expert
 
Avatar de Watilin
 
Homme Matilin Torre
Étudiant
Inscription : juin 2010
Messages : 679
Détails du profil
Informations personnelles :
Nom : Homme Matilin Torre
Âge : 23
Localisation : France, Ille et Vilaine (Bretagne)

Informations professionnelles :
Activité : Étudiant

Informations forums :
Inscription : juin 2010
Messages : 679
Points : 1 202
Points : 1 202
C'est un dialogue modal (en anglais, modal box). Il s'agit simplement d'un élément HTML généré par JavaScript, positionné au-dessus des autres grâce à un CSS z-index. L'assombrissement de la page est fait grâce à une <div> à fond noir avec une opacité inférieure à 100%, qui recouvre le reste de la page avec un z-index également.

La <div> sombre joue un rôle d'occultation : l'utilisateur ne doit pas pouvoir cliquer sur les éléments recouverts tant qu'il n'a pas fermé la boîte de dialogue. Pour aller jusqu'au bout, il faut également modifier les tabindex pour empêcher l'utilisateur de se déplacer avec la touche tab.

Et bien sûr, il ne faut pas oublier de remettre tout ça comme avant quand l'utilisateur ferme la boîte
__________________
Disposition de clavier ergonomique française : Bépo
Watilin est déconnecté   Envoyer un message privé Réponse avec citation 20
Vieux 29/07/2011, 13h23   #3
Membre à l'essai
 
Inscription : janvier 2011
Messages : 34
Détails du profil
Informations forums :
Inscription : janvier 2011
Messages : 34
Points : 21
Points : 21
Merci ! tu m'a sauvé des heures de recherches

bonne journée
manserk est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité Cette discussion est résolue.
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 14h11.


 
 
 
 
Partenaires

Hébergement Web