Cet article explique comment écrire des fenêtres contextuelles en utilisant JavaScript
Identification de chaque fenêtre pop-up
var x =0;
var idzt = nouveau Array();
var Window = function(config){
L'ID n'est pas répété
idzt[x] = "zhuti" x; ID de la fenêtre contextuelle
Initialisation, réception des paramètres
this .config = {
largeur : config.width || 300, largeur
hauteur : config.height || 200, hauteur
boutons : config.buttons || '' , pas de bouton par défaut
title : config.title || 'title', title
content : config.content || 'content', content
isMask : config.isMask == false ?false:config. isMask || true, s'il faut masquer
isDrag : config.isDrag == false?false:config.isDrag || true, s'il faut déplacer
};
Load pop -up window
var w = ($(window).width()-this.config.width)/2;
var h = ($(window).height()-this.config.height) /2;
var nr = "
";
$("corps ").app
end (nr);
Charger le titre de la fenêtre pop-up
var content ="
" this.config.title "
×
p>";
Chargement de la fenêtre contextuelle Contenu
var nrh = this.config.height - 75;
content = content "
" this.config.content "
";
Bouton de chargement
content = content "
Créer un calque de masque
if
(this.config.isMask)
{
var zz = ""; $("body").append(zz);
$("#zz").css('
display
','block');
} Restrictions maximales et minimales pour éviter de sortir de la page
var maxX = $(window).width()-this.config .width;
var maxY = $(window).height()-this.config.height;
var minX = 0,
minY = 0;
Mouvement de la fenêtre
if(this.config.isDrag)
{
Fenêtre contextuelle de mouvement de la souris
$(".title").bind( "mousedown", fonction(e){
$(this).attr("bs"); Obtenir l'identifiant
,3);
$('#' idzt[n]).css( "z-index",4);
$('#' idzt[n]).css("top")), la coordonnée Y initiale du calque contextuel
downX = e .clientX, lorsque la souris est enfoncée, la coordonnée X de la souris
double = e.clienty; Lorsque la souris est enfoncée, la coordonnée Y de la souris
Lie la souris pour se déplacer
Incident $ ("corps") ES) {<.>
ENDX = ES.Clientx -DOWNX Startx ; mouvement des coordonnées X
Endy = ES.Clienty -DOWNY Starty ; endX)
{
endX = 0;
}
;
; (); Supprimer le masque
🎜>
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!