28219 sujets

CSS et mise en forme, CSS3

Bonjour

Il y a bien longtemps que je n'ai pas posté ici, bien que je vienne de temps en temps m'informer.

Sur mon formulaire de réservation, j'utilise un calendrier en javascript pour insérer une date dans un champ. Le script génère un tableau dans un bloc <div id="calendar"> initialement masqué (position:relative;display:none;).

Lors du clic sur le champ, le calendrier apparaît en-dessous du champ. Tout va bien avec explorer 6 et firefox 2.

Mais sous explorer 7, le bloc est positionné plus haut dans la page et n'est même pas visible.

Le script est le DHTML/JavaScript Calendar de dynarch.com.

Quelqu'un aurait-il déjà eu à résoudre ce souci ?

Merci d'avance pour toute piste que vous pourrez me donner, y compris un autre script similaire Smiley smile
Modifié par Clair de Lune (28 Mar 2007 - 19:12)
Salut,

désolé, mais je n'ai pas le courage nécessaire pour me plonger dans un code javascript que je n'ai jamais vu pour dénicher l'erreur. Trop la flemme Smiley cligne

As-tu essayé de demander de l'aide sur le site qui fournit le script ? Ils ont peut-être indiqué une solution, si le problème vient du script, ou proposé une mise à jour ...

Le problème vient peut-être d'un hack CSS utilisé pour corriger un défaut d'IE6 qui a été rectifié sous IE7 ... de là à dire exactement ce qui cloche Smiley decu
Oui, j'ai un peu cherché avant de venir pleurnicher ici Smiley cligne

Je suis allé sur le site de dynarch.com et son forum, et aussi sur le forum de sourceforge qui distribue le script. Les derniers messages, rares, ne traitaient pas de ce problème.

Le script fonctionne, je ne crois pas qu'il soit en cause, c'est son positionnement qui ne va pas. J'ai une page de test qui fonctionne bien avec explorer 7, parce que la page n'est pas très haute.

Le souci est à mon avis dû à une propriété css dont l'interprétation a changé entre IE6 et IE7. J'ai tenté plusieurs modifications de la CSS, notamment en supprimant position:relative, mais sans succès.

Merci quand même

edit : la page où l'on peut voir le problème est maintenant ici.
Modifié par Clair de Lune (24 Mar 2007 - 08:10)
Salut,
je ne connais pas ce script, mais comme ça à première vu de firebug Smiley smile , tu as une erreur de script ligne 185 ou tu appelles calendar qui n'est pas défini, enfin, qui a l'air d'être défini un peu plus haut mais comme Calendar et javascript est case-sensitive, c'est peut-être un début...

Have swing
>virtualgadjo : merci de ton aide, mais comme je le disais je ne crois pas que ce soit la cause, le script fonctionne bien.

Sur ma page de test, en haut, le champ "arrivée" affiche correctement le calendrier lors d'un clic. Un peu plus bas, dans le champ "départ", le clic affiche le calendrier beaucoup trop haut, et seulement avec IE 7.

La partie de la CSS qui semble en cause est :

.calendar {
  position: relative;
  display: none;
  ...
}


La raison de ce décalage reste pour moi un mystère...
Salut,

Je pense que cela vient de ton script, en fonction du navigateur, il positionne en absolute ton calendrier et il ne semble pas tenir compte d'ie7 (qui ne devait pas encore officier à l'époque) et le considère donc comme ie6 alors qu'il semblerait se rapprocher plus de FF en l'occurrence.
Merci ghost, tu m'as mis sur la bonne piste : le script se base sur une détection de navigateur en fonction du userAgent (ce qui est à mon avis une erreur, il serait plus sûr de vérifier les propriétés supportées en javascript) et corrige à tort la position du calendrier.

Bref, il prend IE 7 pour IE 6, et IE 7 ne l'entend pas de cette oreille Smiley biggrin

Je marque ce sujet en [résolu] pour ne pas vous faire perdre plus de temps, mais je ne crois pas que je vais corriger le script : mes visiteurs entrent très bien les dates dans un simple champ texte. Comme je ne récupère pas automatiquement ces dates, contrairement aux autres infos du formulaire, c'était plutôt un gadget...qui ne marche pas.