ie inline-block ou inline

**pierreconeille** · 15/10/2009, 22h33

Bonjours a tous, je suis nouveau dans se forum donc excuser moi si ma mise en page n'est pas dans vos norme ^^.

Voyant que internet explorer n'affiche pas mon inline-block et après recherche sur la "toile", j'ai sorti un script qui ne marche pas.
Notez que les alert() sont valide .

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<head><title>Sandwitch</title>
 
<script language="javascript" >
 
 
function sandwich(spef){
  document.getElementById('gr').className = 'contenu';
  document.getElementById('ca').className = 'contenu';
  document.getElementById('sa').className = 'contenu';
  document.getElementById('mo').className = 'contenu';
  document.getElementById('pa').className = 'contenu';
  document.getElementById('cr').className = 'contenu';
  document.getElementById(spef).className = 'aff';
 
}
 
function navigateur(){
 if(navigator.appName== "Netscape") { 
 alert('netscape'); 
 document.getElementsByName('onglet').stye.display= 'inline-block';
 }
  else if(navigator.appName == "Microsoft Internet Explorer") {
          alert('ie');
		  document.getElementsByName('onglet').stye.display= 'inline';
		  }
		  else return;
 
}
 
</script>
		<STYLE type="text/css">
		.onglet {
 
     border: #6b8e23 2px solid;
     margin: 0px;
     padding : 10px;
     background-color: #a52a2a;
}
 
.contenu {
      display: none;
 
 
}
.aff {
      display :block ;
        border: #6b8e23 2px solid;
 
 
      font-size: 2em;
	  background-color: #8A2BE2; 
}
 
body {
      background-image: url(enseigne-pomme-de-pain.jpg);
 
}
 
li{
 
     margin-left : 500px;
 
}
		</STYLE>
 
</head>
 
 
<body  onload="navigateur();" >
<div align="center" >
<img src="logo_pomme-de-pain.jpg" title="LOGO" alt="pas d'image"           /><br/>
<div class="onglet" name="onglet" ><a  href="javascript:;" onclick="sandwich('gr');">Grilladin</a>
</div>
<div class="onglet" name="onglet"><a  href="javascript:;"onclick="sandwich('ca');" >Capresse</a>
</div>
<div class="onglet" name="onglet"><a  href="javascript:;" onclick="sandwich('sa');">Saveur du Sud</a>
</div>
<div class="onglet" name="onglet"><a  href="javascript:;" onclick="sandwich('mo');">Montagnard</a>
</div>
<div class="onglet" name="onglet"><a  href="javascript:;" onclick="sandwich('pa');">Pays</a>
</div>
<div class="onglet" name="onglet"><a  href="javascript:;" onclick="sandwich('cr');">Craquant</a>
</div>
</div>
 
<br/>
 
 
<div class="contenu"   id="gr"  ><ul>
    <li>bearnesse</li>
    <li>conté</li>
    <li>steak</li>
    <li>Plat secondaire</li>
    <li>icberg</li>
</ul></div>
<div class="contenu "  id="ca"> <ul>
    <li>tapenade</li>
    <li>mozzarella</li>
    <li>tomate confie</li>
    <li>grain de pin</li>
 
</ul>
</div>
<div class="contenu " id="sa">
<ul>
    <li>piono?</li>
    <li> ail</li>
    <li> poulet epicer</li>
    <li> icberg</li>
</ul></div>
<div class="contenu"id="mo" ><ul>
    <li>(creme fraiche, perccil?)</li>
    <li>tomate</li>
    <li> bacon</li>
    <li> fondue</li>
    </ul></div>
<div class="contenu " id="pa"><ul>
    <li>beure</li>
    <li>janbon cru</li>
    <li> cornichon</li>
    </ul>
 
</div>
<div class="contenu" id="cr"><ul>
        <li>(vache ki rie, macedoine,)</li>
		<li> jambon</li>
		<li>cornichon</li>
		<li>salade</li>
</div>
 
</body>

Merci de m'eclairer se forum est une mine d OR

**sebhm** · 15/10/2009, 23h34

Bonjour,

je ne comprends pas l'interet d'utiliser javascript pour affecter des propriétés CSS dès le chargement de la page.
Meme si tu veux gérer une propriété que IE (c'est souvent lui) ne gère pas bien, tu peux utiliser les commentaires conditionnels

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<!--[if lte IE 6]>
<style type="text/css">
 ... ton css special IE6 et versions antérieures dans ce cas là
</style> 
<![endif]-->

de plus, getElementsByName va te retourner un tableau, tu ne peux donc pas faire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

getElementsByName.display

directement.

à la limite, ceci va marcher (j'ai fait que la partie non IE)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 if(navigator.appName== "Netscape") { 
 alert('netscape'); 
 x=document.getElementsByName('onglet');
 for (var i=0;i<x.length;i++)
  x[i].style.display= 'inline-block';
 }

mais, encore une fois, gere le sans javascript

**pierreconeille** · 16/10/2009, 18h38

Merci,

J'ai utiliser Javascript car je ne savais pas comment faire et c'est la première méthode que j'ai trouver.

<!--[if IE ]> marche tres bien merci.

Pour ton code Javascript, cela marche tres bien sur Firefox, opera .. mais pas sur Ie

Breff merci pour ton aide. Si ta la solution Javascript pour ie merci , sinon merci c pas grave

.

**sebhm** · 16/10/2009, 21h23

ben c'est la meme chose dans le else, avec la valeur 'inline' au lieu de 'inline-block'.
C'est pour ça que j'ai précisé

j'ai fait que la partie non IE

**pierreconeille** · 16/10/2009, 22h10

Je sais, mais en changeant sa ne marche pas. de toute façon j'ai "tuer" les problème en supprimant cette parti.

reporte toi a mon autre problème-post:

http://www.developpez.net/forums/d82...javascript-ie/

je pense que les deux problème sont lié

merci de ton attention, sympa

ie inline-block ou inline

JavaScript

Discussions similaires

Partager

Partager