Différence entre Chrome, Firefox et IExplorer

Version imprimable

Voir 40 message(s) de cette discussion en une page

04/01/2013, 17h49
jostwind

Différence entre Chrome, Firefox et IExplorer

Bonjour,

Je viens d' installer un lecteur de bande " son mp3 " sur les pages de mon site.

Sur Chrome et Firefox, c' est nickel.
Par contre sur Internet Explorer, ça ne fonctionne pas:
L' écart entre les lignes de texte au dessus et au dessous du lecteur est réduit, et le lecteur semble compressé, il n' apparaît pas complètement en hauteur, et il ne marche pas.

Mon site: http://www.strill.fr

PS: J' ai également des problèmes sur les pages 3, 4 etc du site:
Des espaces entre les blocs images que je n' ai pas avec Chrome et Firefox???

Merci pour vos conseils
04/01/2013, 17h57
NoSmoking

Bonjour,
pour un début je te propose de regarder ce que donne un validateur.
05/01/2013, 15h58
jostwind

Besoin d' aide

Bonjour,

Sans vos conseils, je vais avoir bien du mal, car je suis autodidacte et j' y rentre petit à petit, et que la personne qui a rédigé l' essentiel du code n' exerce plus.

j' essaye donc de reprendre tout cela en main...

Cordialement
05/01/2013, 19h27
NoSmoking

Il existe des erreurs simples qu'il faut éradiquer, non fermeture de balise...

Il existe une solution qui consiste à utiliser un nettoyeur, pluggins pour FireFox par exemple HTML Validator/Tidy si je ne m'abuse il devrait pas mal t'aider pour repartir sur de bonnes bases.

Le principe de base étant de respecter les règles d'écriture du modèle que l'on utilise, HTML/XHTML.

Citation:

Envoyé par jostwind

L' écart entre les lignes de texte au dessus et au dessous du lecteur est réduit, et le lecteur semble compressé, il n' apparaît pas complètement en hauteur, et il ne marche pas.

cela me paraît normal attendu que c'est ce que tu demandes dans ton code
Code:

1 2 3 4 5 6 <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" data="dewplayer.swf" type="application/x-shockwave-flash" name="dewplayer" width="200" height="10" id="dewplayer"> <param name="movie" value="dewplayer-mini.swf"/> <param name="flashvars"mp3=value="http://www.strill.fr/images/liens/interview2"/> <param name="wmode" value="black"/> <embed src="dewplayer-mini.swf" width="200" height="50" flashvars="mp3=http://www.strill.fr/images/liens/interview2" wmode="transparent" name="dewplayer"></embed> </object>
Regardes ce que tu demandes comme height en ligne 1 du code ci dessus.

Il faudra bien que tu décides à mettre à jour ton code tant au niveau du CSS que de la structure comme on te l'avait déjà conseillé.
voir http://www.developpez.net/forums/d12...e-images-page/.

Citation:

Envoyé par jostwind

PS: J' ai également des problèmes sur les pages 3, 4 etc du site:
Des espaces entre les blocs images que je n' ai pas avec Chrome et Firefox???

Une seule question par discussion cela permet de ne pas se disperser et de reste plus concis.

06/01/2013, 19h24
jostwind

Différence entre Chrome et IExplorer

Bonsoir,

Merci pour la réponse.
Plusieurs choses...

- le code du lecteur, je l' ai récupéré sur le net tel quel.

- je l' ai installé sur la 1ère page et ouvert " Chrome " que j' utilise personnellement et ça marchait. Mais je n' ai pas eu le réflexe de vérifier tous les explorateurs, et c' est tout à fait par hasard que j' ai ouvert IExplorer et constaté le problème.D ' autant plus qu' avec Firefox ça marche également.

- Ce serait la valeur " height " donc qui serait responsable, c' est bien cela?, je vais tester pour voir.

- Pour ce qui est de l' ensemble du code, plein de bonne volonté, je vais tenter de faire ce que vous me dites, mais j' aurai besoin sans abuser de votre aide sous forme d' exemple pour comprendre et mettre le tout à niveau " en apprenant ".

Cordialement
06/01/2013, 19h39
jostwind

Une dernière chose.
Pourriez-vous m' indiquer comment être prévenu par mail d' une nouvelle réponse?
J' ai coché différentes " Options " sur mon profil, mais sans succès.

Merci
06/01/2013, 23h51
jostwind

Bonsoir,

Une autre remarque, ce serait les balises " object" dans le code, qui pourraient poser problème sur IExplorer.

Voyez-vous par quoi les changer?

Cordialement
07/01/2013, 00h07
jostwind

Je viens de changer la valeur " height " de 10 je suis passé à 20.
Là effectivement le lecteur apparaît en entier.
Mais je n' ai toujours pas de " son sur " IE " alors que ça marche sur Chrome, Firefox, Safari???
Comme je le disais précédemment, quand on propose le code, ce sont les balises " object" qui semblent indésirables sur Iexplorer.
Par quoi pourrais-je les remplacer ?

Merci
07/01/2013, 00h59
thelvin

Citation:

Envoyé par jostwind

- le code du lecteur, je l' ai récupéré sur le net tel quel.

En même temps le lecteur en question c'est Dewplayer. Ça aurait été une bonne idée d'aller chercher le code directement sur le site. C'est encore eux qui savent le mieux.

Des exemples, ils en donnent. Sur le site, et avec Dewplayer lui-même.

Citation:

Envoyé par jostwind

Une autre remarque, ce serait les balises " object" dans le code, qui pourraient poser problème sur IExplorer.

Voyez-vous par quoi les changer?

<object> est effectivement un méchant sac de nœuds. Mais, IE n'est pas plus perturbé par lui que n'importe quel navigateur.
Et c'est la seule manière de faire jouer une applet Flash, et donc marcher Dewplayer.

Comme dit sur leur site, c'est effectivement plus simple, ou du moins plus sûr, d'utiliser <swfobject> de Google plutôt que la balise <object> toute simple. Un exemple est fourni avec.

Merci pour votre réponse.

je m' y perd un peu.

Avec " <swfobject> " vous verriez le code:

Code:

1
2
3
4
5
6
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" data="dewplayer.swf" type="application/x-shockwave-flash" name="dewplayer" width="200" height="20" id="dewplayer">
                            <param name="movie" value="dewplayer-mini.swf" />
                            <param name="flashvars"mp3=value="http://www.strill.fr/images/liens/interview2"/>
                            <param name="wmode" value="black" />
                            <embed src="dewplayer-mini.swf" width="200" height="20" flashvars="mp3=http://www.strill.fr/images/liens/interview2" wmode="transparent" name="dewplayer"></embed>
            </object>

comment ?

Merci

07/01/2013, 11h13
thelvin

Dewplayer donne un exemple, Google donne des exemples... Pourquoi je devrais en donner aussi ?

Je recommande son utilisation, qui évite de trop compliquer les choses.
09/01/2013, 16h39
jostwind

ça avance!!!!!!!!!

Bonjour,

Pour le lecteur : "dewplayer-mini.swf" ça y est c' est ok...sur les trois navigateurs.
Je n' avais pas bien spécifié le MP3 sur deux lignes de code.

Mon autre souci
Au début, je pensais que le problème du lecteur et le décalage des blocs image sur IExplorer étaient liés car le lecteur marchait sur les deux autres navigateurs et il n' y avait pas de décalage non plus. Soit tous les problèmes sur IExplorer et aucun sur Chrome et Firefox. Maintenant il reste ce léger décalage sur toutes les pages que sur IE???

Merci pour vos conseils

Une page su site:http://www.strill.fr/formation-1.htm
pour exemple.

PS: Je suis en train d' essayer de comprendre et de réparer les erreurs disséminées sur les pages

Tant que tu n'auras pas mis de l'ordre dans ton code tu sera confronté à ce genre de problème

allez un morceau choisi de la page en question

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
</tr><!-- MANQUE BALISE FERMANTE -->
 
<tr>
      <td height="60" colspan="6"><br />
      <div align="justify">
<span><!-- MANQUE BALISE OUVRANT -->
          </span> </div>
<!-- A SUPPRIMER ne sert à RIEN
<blockquote>
              <blockquote>
                <blockquote>
                  <blockquote>
                    <blockquote>
-->
                      <p align="center"><span class="Style4"><strong><font color="#0066FF">Interview sur RCF</font></strong></span> <font color="#0066FF"><strong><span class="Style2">:</span></strong></font><strong> <span class="Style13">" Libres Echanges "avec le Sculpteur...</span></strong>
                        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" data="dewplayer.swf" type="application/x-shockwave-flash" name="dewplayer" width="200" height="20" id="dewplayer">
                            <param name="movie" value="dewplayer-mini.swf" />
                            <param name="flashvars" value="mp3=http://www.strill.fr/images/liens/interview2.mp3"/>
                            <param name="wmode" value="black" />
                            <embed src="dewplayer-mini.swf" width="200" height="20" flashvars="mp3=http://www.strill.fr/images/liens/interview2.mp3" wmode="transparent" name="dewplayer"></embed>
            </object>
                        <br/>
                      </p>
<!-- A SUPPRIMER ne sert à RIEN
                    </blockquote>
                  </blockquote>
                </blockquote>
              </blockquote>
            </blockquote>
-->

et Jean passe ;)

10/01/2013, 00h21
jostwind

Bonjour,

Page: http://www.strill.fr/formation-1.htm

J' ai apporté vos corrections, plus quelques autres.

Dans une page comme celle-là, il y a encore autant de fautes que cela???

Merci

indente correctement ton code est tu devrait encore en trouver

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<tr>
  <td width="192" height="173">
    <!-- ATTRIBUT widtheight EXISTE ??? -->
    <img src="images/trame/2007/menu_up4.jpg" widtheight="173" border="0" usemap="#Map3"/>
  </td>
  <td colspan="3" rowspan="3" background="images/trame/2007/content.jpg">
    <div align="center">
      <a href="formation-2.htm"><img src="images/trame/2007/accueil_formations.jpg" alt="sculpture, cours, stages, formation continue" title="sculpture, cours de sculpture, stages de sculpture, formation continue de sculpture"width="504" height="395" border="0"/></a>
    </div>
  </td>
<!-- NE MANQUERAIT-IL PAS QUELQUE CHOSE ICI ? -->
<tr>
  <td width="192" height="42">
    <img src="images/trame/2007/menu_center.jpg" width="192" height="42" border="0" usemap="#Map4"/>
  </td>
  <td width="4">
    &nbsp;
  </td>
  <td width="141" height="42" bgcolor="#FFFFFF">
    &nbsp;
    <div align="left">
    </div>
  </td>
</tr>

le validateur pourra encore te rendre de grand service ;).

Les conseils que l'on t'a donnés devrait te faciliter la tâche.

Prochaine étape supprimer le CSS inline, lui préférer une feuille de style.

11/01/2013, 18h06
jostwind

Bonjour,

Comme je vous l' ai dit, je suis autodidacte, pour ce qui est de la programmation, ma profession est celle de " sculpteur " et je récupère le site en l' état, ayant perdu mon prestataire. Donc j' apprend en faisant., pour prendre en main mon site depuis quelques années, n' ayant pas encore le langage approprié, mais cela me passionne.

Tant qu' à échanger et je vous en remercie; ne pourriez-vous pas me montrer les erreurs de toute une page et les solutions que vous préconisez, par exemple celle-ci:
http://www.strill.fr/creations-rhapsodie.htm

Cela me permettrait de comprendre et de mettre en pratique en enlevant au passage toutes les erreurs.

Ce serait " productif "qu' en pensez-vous ?

Cordialement

Citation:

...je suis autodidacte...

grand veinard je ne suis que vélodidacte :mrgreen:

Citation:

...ne pourriez-vous pas me montrer les erreurs de toute une page...

un petit tour du coté d'un validateur, comme déjà indiqué, te donne les erreurs, certaines sont préjudiciable au rendu de la page d'autre non.

Je le répètes une bonne indentation aide souvent à débusquer des bizarreries

un dernier exemple issu de la page en référence

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<div align="center">
  <font size="2" face="Arial">
    <strong>
      <font color="#FFFFFF">
        <em>
          <font color="#000066">
            <strong>
              <font color="#FFFFFF">
                <em>
                  <font color="#000066">
                    <font color="#000099">
                    </font>
                  </font>
                </em>
              </font>
            </strong>
          <font color="#000099">
            Galerie 1 - Cliquez les Vignettes pour agrandir ou passez à Galerie suivante
          </font>
        </font>
        </em>
      </font>
    </strong>
  </font>
</div>
<div align="center">
</div>

peu s'écrire simplement

Code:

1
2
3
<div style="font-family:Arial; font-size:13px;font-style:italic;font-weight:bold;color:#009;text-align:center">
  Galerie 1 - Cliquez les Vignettes pour agrandir ou passez à Galerie suivante
</div>

la partie style pouvant être mise dans la partie STYLE de la page

Code:

1
2
3
4
5
6
7
8
div {
  font-family:Arial;
  font-size:13px;
  font-style:italic;
  font-weight:bold;
  color:#009;
  text-align:center;
}

Citation:

Ce serait " productif "qu' en pensez-vous ?

j'ai l'impression que je l'ai été ;).

16/01/2013, 12h45
jostwind

suite.....

Merci tout d' abord d' avoir pris en compte mes " carences ",

Sauf erreur, j' ai donc mis en pratique les changements que vous m' avez conseillé sur la page:
http://www.strill.fr/creations-rhapsodie.htm

J' ai inséré le " STYLE " entre " HEAD ET HEAD ".
16/01/2013, 12h52
jostwind

C 'est effectivement beaucoup plus simple.

Mais pour ce qui est de mes décalages entre les blocs images sur la page ouverte avec IExplorer ce n' est pas encore cela. Et c' est mon problème " premier ".

Avez-vous une idée?

PS: merci de m' aider à mettre mon code aux normes

Voir 40 message(s) de cette discussion en une page