2010-02-18 8 views
5

Je me suis arraché les cheveux (et je suis allé trop loin) pour essayer de comprendre pourquoi Colorbox ne fonctionne pas correctement sur la page suivante: [link removed]Problème Implémentation de Colorbox correctement dans IE (toutes les versions)

J'ai mis en place un lien de test Colorbox en bas à droite qui dit «Web Design By All Web Cafe», ce qui devrait ouvrir une petite image de logo. Dans Firefox, Safari, etc le modal se comporte comme il se doit, en ouvrant le centre du centre au-dessus de tout le contenu existant sur la page. Dans IE, non seulement le modal n'est pas centré, mais il semble qu'il n'obéisse pas au positionnement absolu et pousse tout le contenu existant sur la page ci-dessous. Ajoutez à cela le fait que ce n'est pas l'ouverture à la taille correcte et la création de barres de défilement à côté de l'image modale, et nous avons nous-mêmes un modal laid.

Les barres de défilement avec lesquelles je peux vivre (en redimensionnant simplement la hauteur minimale du modal), mais je n'arrive pas à comprendre pourquoi il ne sera pas centré. Permettez-moi de dire que je n'ai pas codé ce site initialement et qu'il a été complété il y a quelques années, donc il y a probablement de nombreux hacks CSS pour que les choses s'affichent correctement, n'importe lequel pouvant causer ce problème. En revanche, Thickbox est également configuré sur ce site (si vous cliquez sur la légende "Play Video" dans la zone en bleu foncé) et se comporte correctement, mais souffre de problèmes de dimensionnement/padding étranges, d'où le désir de remplacez-le par quelque chose d'un peu plus moderne et extensible. Je peux vérifier qu'il n'y a pas de conflit avec ces deux scripts modaux/fichiers CSS simultanément car le problème persiste avec Colorbox même lorsque Thickbox est entièrement supprimé.

Toute idée ou suggestion serait grandement appréciée.

Répondre

16

GOT IT !!! .. après avoir modifié beaucoup de choses dans mon code (eu le même problème) ...

Il suffit de mettre:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 

.. au début de votre page. Il doit être AVANT inclure ou tout le reste.

Espérons que cela aide. À la votre!

Mariano.

+0

Je vous dois une bière, mon ami. Merci beaucoup pour la réponse. Je n'aurais jamais deviné que c'était un problème de doctype. Il s'avère que vous pouvez réellement utiliser le doctype HTML 4, aussi longtemps que c'est déclaré correctement. J'utilise celui-ci: Andrew

+0

donc si En utilisant une page de master, est-ce que vous le placez simplement en haut de la page? –

+0

Awesome Nano ... Vous êtes excellent .... – Ketan

2

Excellent attrape mon ami. Je travaille avec quelques développeurs sur mon projet web et j'ai eu le même problème. Je ne pouvais pas comprendre pour la vie de moi pourquoi ça fonctionnait dans Firefox et pas IE (toutes les versions). Avez-vous dit et vérifié le doctype et bien sûr ce n'était pas complet. Un des autres développeurs doit avoir copié à partir d'un code existant. Quoi qu'il en soit, nous n'utilisons pas xhtml strict, nous utilisons le langage de transition xhtml et cela permettra à la colorbox de fonctionner correctement dans IE (toutes les versions) et Firefox. Voici mon code je pour obtenir le travail colorbox:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" >

Merci Mariano pour votre aide sur celui-ci. Sauvé de nombreuses heures de frustration! Toby Gutierrez

Questions connexes