1. Méthode standard
Copier le code du code comme suit:
<script type = "text / javascript">
Fonction openwin (src, largeur, hauteur, showscroll) {
Window.showmodaldialog (src, "", "Emplacement: non; statut: non; aide: no; dialogwidth:" + width + "; dialogneight:" + height + "; wscroll +"; ";");
}
</cript>
Exemple: <span style = "curseur: pointeur" onclick = "openwin
('//www.vevb.com', '500px', '400px', 'non') "> cliquez sur </span>
2. Il convient de noter que Firefox ne prend pas en charge la fonction.
fenêtre
('Openwin.html', 'newwin', 'modal = oui, largeur = 200, hauteur = 200, résidable = non, barre de défilement = non');
3. Comment juger automatiquement le navigateur
Copier le code du code comme suit:
<input type = "Button" value = "Ouvrir la boîte de dialogue" onClick = "showDialog ('#')" /> />
<Script linguisse = "javascript">
<! -
Fonction showDialog (URL)
{{
if (document.all) // c'est-à-dire
{{
Fonctionnalité = "DialogWidth: 300px; DialogHeight: 200px; statut: non; aide: non";
Window.showmodaldialog (URL, null, caractéristique);
}
autre
{{
// ModelessDialog peut remplacer Modal par Dialog = Oui
Caractéristique = "largeur = 300, hauteur = 200, menuBar = non, barre d'outils = non, emplacement = no," ;;;;;
Fonctionnalité + = "Scrollbars = non, status = non, modal = oui";
Window.Open (URL, NULL, fonctionnalité);
}
}
// ->
</cript>
4. Dans IE, la boîte de dialogue modale masquera la barre d'adresse, tandis que les autres navigateurs ne sont pas nécessairement
[Remarque] Dans Google Browser, l'effet de ce modal échouera également.
5. Généralement, lorsque la boîte de dialogue apparaît, nous espérons tous que l'arrière-plan de la page du père entier deviendra une couleur translucide, afin que les utilisateurs puissent voir qu'ils ne peuvent pas être accessibles plus tard.
Après avoir fermé la boîte de dialogue, j'espère restaurer
Comment cela a-t-il fait?
Copier le code du code comme suit:
/// Affichez les informations détaillées d'un certain ordre, via une boîte de dialogue modale, et l'écran modifiera la couleur
Fonction showerdetails (ordonnance) {
var url = "Details.aspx? OrderId =" + OrderId;
// $ ("corps").
// Filtre: Alpha (opacité = 50)
$ ("corps").
Showdetailsdialog (url, "600px", "400px", "oui");
$ ("corps").
}
De plus, il y a une définition de table de style
.Body1
{{
Color en arrière-plan: # 999999;
Filtre: alpha (opacité = 40);
}
Copier le code du code comme suit:
<% @ Page linguistique = "C #" AutoEventWireup = "True" CodeBehind = "webForm1.aspx.cs" hérites = "webApplication1.webForm1"%>
<!
<html xmlns = "http://www.w3.org/1999/xhtml">
<head runat = "server">
<Title> </Title>
<Style type = "text / css">
.Body1 {{
Color en arrière-plan: # 999999;
Filtre: alpha (opacité = 40);
}
</ style>
<script src = "jquery.js" type = "text / javascript"> </ script>
<script type = "text / javascript">
Fonction showdetailsdialog (src, largeur, hauteur, showscroll) {{
Window.showmodaldialog (src, "", "Emplacement: non; statut: non; aide: no; dialogwidth:" + width + "; dialogneight:" + height + "; scroll +"; ");
}
Fonction showerdetails (ordonnance) {
var url = 'détachs.aspx?
$ ("corps").
Showdetailsdialog (url, '500px', '400px', 'no');
$ ("corps").
}
</cript>
</ head>
<body>
<idoux id = "form1" runat = "server">
<div>
<span style = "curseur: pointeur" onclick = "showOrderDetails (11)"> Cliquez sur </span>
</div>
</ form>
</docy>
</html>