J'ai une application Web interne, c'est-à-dire spécifique et utilise beaucoup de boîtes modales spécifiques à savoir: (fenêtre.showmodaldialog).
J'ai récemment reçu une demande de supprimer le "flash" lors de la navigation entre les pages de le site. Pour accomplir cela, je viens d'ajouter une balise de transition Meta à ma page maître: p> Cela fonctionne parfaitement à l'exception des cases modales. Lorsque vous lancez une boîte modale, puis déplacez-la, la page Web de la page conserve une piste de la boîte modale au lieu de re-dessiner le contenu de la page Web. Cela empêche l'utilisateur de déplacer la boîte modale pour lire tout ce qui était derrière elle. P> existe un moyen d'empêcher le "flash" entre les pages d'un site IE spécifique et que le site fonctionne toujours avec des cases modales ? p> Veuillez noter que ceci est un site volumineux et complexe, ce qui le recélère donc pour ne pas utiliser de boîtes modales n'est pas une option. p> Ceci est un ASP.NET, C # Application Web, et tous mes utilisateurs utilisent IE 7 et IE 8 si cela fait toute différence. p> -edit - p> Pour en double place, placez ce qui suit dans une page HTML, et ouvrez-le dans Internet Explorer: P> <html>
<head>
<title>Test</title>
<meta content="blendTrans(duration=0.0)" http-equiv="Page-Exit">
</head>
<body>
<script language="javascript">
window.showModalDialog('modal.htm', window);
</script>
</body>
</html>
3 Réponses :
Avez-vous essayé les solutions de Cette page ? Il vous dit que vous devez ajouter un élément
aussi de Les meilleures pratiques de Yahoo : P>
La spécification HTML indique clairement que les feuilles de style doivent être incluses dans la tête du Page: "Contrairement à A, [Link] ne peut apparaître que dans la section principale d'un document, bien qu'il puisse paraître un nombre de fois." Ni des alternatives, l'écran blanc blanc ou le flash de contenu non collé, valent le risque. La solution optimale consiste à suivre la spécification HTML et à charger vos feuilles de style dans la tête du document. P>
Assurez-vous d'avoir un élément dans la tête de toutes vos pages et assurez-vous que vous Mettez ces feuilles de style au niveau Je sais que vous avez dit que vous ne pouvez pas utiliser les modaux, mais je pensais partager cet exemple de Modal JS en utilisant JQuery et Facebox . Vous n'avez même pas besoin de modifier vos appels vers "ShowModaldialog" (si vous finissez par utiliser cette méthode modale, vous pouvez toujours utiliser votre truc de transition de la page de sortie de la page Meta Page de sortie). P>
window.showModalDialog = function(a){
$.get(a,function(html){
$.facebox(html);
});
};
window.showModalDialog('linkOnSameDomain.htm', window);
Merci pour la réponse, mais je ne vois pas comment les feuilles de style sont liées à cela. Si vous regardez la page d'échantillonnage, je monte, il n'y a pas de feuilles de style (ni de styles de quelque nature que ce soit) impliquée. Comment puis-je modifier la page d'échantillon que j'ai fournie avec l'une de ces solutions ou les meilleures pratiques pour résoudre le problème?
Supprimer le Pièce (qui provoque le problème de ré-dessin) entièrement. Vous ne devriez pas en avoir besoin si vous avez vos feuilles de style et vos scripts dans le bon ordre.
En outre, j'ai fait une double vérification et toutes les feuilles de style externes sont référencées au-dessus de l'en-tête de notre page maître. J'ai mal compris que vous abordiez la question fondamentale et non les problèmes spécifiques causés par la transition de la page que j'ai ajoutée.
Yah, désolé je n'étais pas clair sur ça. Sont tous vos éléments de script après les feuilles de style? Est-ce que l'une de vos feuilles de style utilisez @import?
Ma tête de page rendue ressemble à ceci: titre, références à 5 feuilles de style utilisant: , liens vers une JavaScript externe, une javascript en ligne, puis de 10 ou deux lignes de Styles en ligne qui sont ajoutés par des contrôles tiers.
hm, ça sonne bien. Vous pouvez essayer de déplacer le JS sur le pied de page.
J'ai trouvé que les fichiers .CSS étaient également liés dans certains contrôles utilisateur. Cela a abouti à être inclus plus d'une fois, dans l'en-tête et en ligne. Si je supprimais ces licenciements et déplacez tous les liens .js vers le bas, le flash s'en va pour quelques pages, mais pas à chaque fois. Je reçois aussi un groupe d'erreurs JS car les scripts en ligne ont besoin des fichiers externes, qu'ils ne peuvent plus se rendre. Cela me mène dans la bonne direction pour la cause fondamentale, mais peut-être trop pour aborder en ce moment. Donc, pour le moment, je devrai voir si je peux obtenir le tour de la transition de la page pour travailler. Merci!
Je t'en prie. On dirait que le projet est un peu géré et difficile à entretenir. Alors bonne chance! ------------ Remarque: Vous pouvez toujours simplement charger un iframe dans la teneur en fibre-fécule (par exemple: '' au lieu de $ ..get (...) );
Oui, c'est un projet qui a été externalisé avant de commencer ici et a été ramené à la maison. J'essaie toujours de nettoyer des choses comme ça. J'ai essayé d'utiliser votre code JQuery pour remplacer comment nous gérons des boîtes modales, mais parce que les boîtes modales ont leur propre poteau et lancent également d'autres boîtes modales, cela ne fonctionnera pas. Merci encore.
Yikes, ça sonne douloureux. Vous pouvez essayer de faire une recherche sur tout votre code source pour remplacer la fenêtre.Showmodaldialog avec $ .Facebox.
Accepter comme la bonne réponse. Je crois que le problème root avec le flash est le résultat de la manière dont les fichiers externes (.js, .cs) sont organisés et référencés sur la page principale. Exécution de quelques tests a montré que les déplacements autour de ceux-ci corrigent le flash pendant quelques pages. Je vais juste avoir besoin de faire fonctionner cela pour tout dans l'ensemble du projet. Merci encore pour votre aide.
Votre problème est que ShowModaldialog ne manipule pas les surfaces DirectX (qui vous retrouvent lorsque vous vous déconnectez avec des filtres et des transitions). C'est-à-dire que vous n'effectuez pas de mises à jour d'écran sur les surfaces sous-jacentes tandis que la boîte de dialogue existe. Vous n'avez d'autre choix que d'arrêter de créer ces surfaces (arrêtez d'utiliser des transitions) ou d'utiliser une fenêtre contextuelle comme indiqué ci-dessous. La seule différence réelle est que la nouvelle fenêtre ne bloque pas la page sous-jacente (qui est généralement une bonne chose, mais vous devrez peut-être empêcher d'éviter d'autres scripts en cours d'exécution si votre application s'appuie dessus) et vous devrez peut-être gérer tous les boutons de la boîte de dialogue. Différemment si vous retourniez des résultats au parent (comme OK / Annuler).
Sachez que les paramètres de sécurité IE8 peuvent limiter la quantité de chrome que vous pouvez cacher. Si vous devez absolument masquer la barre d'adresse, vous devez définir "Autoriser les sites Web d'ouvrir Windows sans adresse d'adresse ou d'état" dans la zone de sécurité correspondante pour chaque ordinateur utilisateur. P>
<html>
<head>
<title>Test</title>
<meta content="blendTrans(duration=0.0)" http-equiv="Page-Exit">
</head>
<body style="background: transparent url(/images/backgrounds/brushed_aluminium.jpg) scroll repeat top left">
<script language="javascript">
var modal = window.open('modal.htm', '_blank', 'height=500,width=600,status=no,toolbar=no,menubar=no,location=no,resizable=no,titlebar=no');
</script>
</body>
</html>
Merci pour la réponse. Malheureusement, comme je l'ai mentionné dans mon message d'origine, ré-architecture du site pour ne pas utiliser de boîtes modales n'est pas une option à ce stade.
Je voudrais éviter les transitions de page intégrées si possible.
Si le "flash" que vous référez à la page rechargée entre les demandes. Je regarderais deux domaines différents:
envisagez de placer des images dans des sprites CSS et / ou de vous assurer de disposer de longues dates d'expiration sur vos fichiers de contenu. Si votre page clignote, c'est parce que le navigateur doit saisir des charges de substance du serveur sur chaque demande.
sprites CSS - Les sprites CSS sont des images contenant plusieurs images plus petites dans un fichier, qui sont ensuite référencées à l'aide de la propriété CSS de position de fond. Les avantages de cette technique sont les suivants:
Exputation de contenu - Si votre page clignote, mais les dispositions de la page sont similaires entre pages. Cela pourrait être un symptôme que votre serveur oblige votre navigateur à expirer du contenu entre les demandes et rétablier tout chaque fois. Regardez les en-têtes définis sur votre contenu par IIS ou envisagez de configurer un CDN.
Un CDN est un objectif de site Web intégré pour la fourniture de contenu pour un autre site. La principale caractéristique d'un CDN est cependant que les en-têtes et les cookies sont désactivés qui rend les demandes plus rapides et laisse entièrement la mise en cache du navigateur.
ajax
Si vous souhaitez éviter complètement la page Flash, vous devez commencer à mettre vos demandes de page via les demandes de style Ajax. Parce que vous utilisez ASP.NET, vous avez un certain nombre d'options à votre disposition, ci-dessous sont deux d'entre elles:
Panneaux de mise à jour - Update Panneaux Balayez assez bien, en ce que vous pouvez mettre un panneau de mise à jour autour d'un seul bouton ou d'une page entière. Tout dans le panneau Update est affiché sur le serveur à l'aide d'une demande AJAX et le panneau est ensuite mis à jour avec les résultats. Aucune page clignote du tout! Je n'utilise pas les panneaux de mise à jour en faveur de l'option suivante, qui fournit plus de contrôle, mais est plus avancé.
JQUERY & Web Services - Ce que j'ai décrit ci-dessus, mais contrôler le processus à l'aide de services Web (ou méthodes de page) et les méthodes Ajax de JQuery.
J'espère que cela vous aidera,
riche
Pas exactement un traitement, mais une solution intermédiaire: essayez de redessiner manuellement la page lorsque l'utilisateur arrête de faire glisser la fenêtre modale - réglage de la fenêtre "Zoom: 1" à la balise de corps. Je suggère de ne pas redessiner la page tout en faisant glisser - ce serait une overcive à IE. Peut-être que vous pourriez mettre en place un exemple sur jsfiddle.net afin que nous puissions jouer et voir s'il y a une solution.
J'ai mis à jour ma question avec le code qui peut être utilisé pour dupliquer le problème.