1. Accueil
  2. Question et réponse
  3. JS élément popup pour assombrir le site environnant

JS élément popup pour assombrir le site environnant

2010-07-01 8 views
4

Je ne suis pas vraiment sûr de savoir comment décrire ce que je veux faire, mais je suis sûr que je l'ai déjà vu sur de nombreux sites. Fondamentalement, quand quelqu'un clique sur un lien, il devrait montrer un élément qui contient du texte et assombrit le reste du site afin que les utilisateurs se concentrent sur l'élément. Les utilisateurs ne doivent pas non plus cliquer dans la zone grisée, car la notification doit être confirmée avant de disparaître. J'utilise jQuery sur mon site, je suis donc heureux de l'utiliser si ce serait plus facile.JS élément popup pour assombrir le site environnant

Source

2010-07-01 Matt

Répondre

9

Le widget dialog de jQuery UI utilisera un arrière-plan 'semi-transparent' lorsqu'il sera ouvert en mode 'modal'.

html:

<div id='test' title='test'>Test!</div>

javascript:

$('#test').dialog({modal: true});

Démo here

Source

2010-07-01 11:32:48 sje397

0

Il est ce qu'on appelle souvent "lightbox". J'utilise un plugin appelé nyroModal qui est vraiment flexible et supporte un large navigateur.

Source

2010-07-01 11:30:31 patmortech

2

ajouter un div supplémentaire pour couvrir le contenu. Le masque doit être placé au-dessus de tous les éléments à l'exception du contrôle qui doit apparaître. En utilisant le code jquery ci-dessous, cette fonctionnalité peut être atteinte. En supposant que le contrôle nouvellement ajouté (div) est d'avoir id = 'masque'

......... 
var maskHeight = $(document).height(); 
var maskWidth = $(window).width(); 
//Set heigth and width to mask to fill up the whole screen 
$('#mask').css({'width':maskWidth,'height':maskHeight}); 

//transition effect  
$('#mask').fadeIn(1000);  
$('#mask').fadeTo("slow",0.5); 
......

Source

2010-07-01 12:55:03

 Questions connexes

  • Aucun problème connexe^_^