Discussion :

[Walcure]

Bonjour tout le monde,

J'utilise le plugin jQuery UI 1.8.21, et jQuery 1.7.2.

Comme expliqué dans le titre j'utilise des composants de jQuery UI, ils fonctionnent parfaitement sur Firefox, et Chrome mais, il n'affiche rien du tout sur Internet Explorer... C'est comme s'ils n'existaient pas...

J'utilise les composants "Tabs" et "Accordion"

Voila la code que j'utilise dans un fichier externe :

Code jQuery :

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

1
2
3
4
5
6
7
8
$(function() {	
	$( "#tabs" ).tabs();
});
 
$(document).ready(function(){
	$('.accordion').accordion();
 
});

Les import :

Code HTML :

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

1
2
3
4
5
6
7
8
9
10
11
 
 
   <link rel="stylesheet" href="../js/css/ui-lightness/jquery-ui-1.8.21.custom.css" type="text/css" >
		<link rel="stylesheet" href="../css/style.css" type="text/css" >
 
     	<script type="text/javascript" src="../js/js/jquery-1.7.2.min.js"></script>
        <script type="text/javascript" src="../js/js/jquery-ui-1.8.21.custom.min.js"></script>	
        <script type="text/javascript" src="../js/jquery.easing.1.3.js"></script>
        <script type="text/javascript" src="./js/function.js"></script>
        <script type="text/javascript" src="../js/function.js"></script> 
       <script type="text/javascript" src="../plugins/ckeditor/ckeditor.js"></script>

Code HTML :

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
 <div id="tabs" class="tab">
        <ul>
            <li><a href="#tabs-1">Gestion des news</a></li>
            <li><a href="#tabs-2">Gestion des galeries</a></li>
            <li><a href="#tabs-3">Gestion des médias</a></li>
 
        </ul>
        <div id="tabs-1">
 
   <div class="accordion">
        	<h3 class="head"><a href="#"><img src="../images/france.png" alt="Français"/>Traduction Française</a></h3>
        		<div>                    
                	Titre : <br/><input style="width:100%" type="text" name="titreFR" /><br/>
					Description :<br/><input style="width:100%" name="descriptionFR" /><br/>
					Contenu :<br/>					  
					<textarea id="contenuFR" name="contenuFR" class="ckeditor"></textarea>
 
            	</div>
        	<h3 class="head"><a href="#"><img src="../images/allemagne.png" alt="Allemande">Deutsch Übersetzung</a></h3>
        		<div>
                	Titel : <br/><input style="width:100%" type="text" name="titreDE" /><br/>
					Beschreibung :<br/><input style="width:100%" name="descriptionDE" /><br/>
					Inhalt :<br/>                    	
					<textarea id="contenuDE" name="contenuDE" class="ckeditor"></textarea><br/>
                </div>
 
    </div>
 
 
</div>
        <div id="tabs-2">
 
[... Du code PHP ...]
 
 </div>
 
         <div id="tabs-3">
</div>

Si quelqu'un est déjà tomber sur ce problème... Je vous remercie par avance !

PS: désolé si toutes mes balises sont décalés, elles ne le sont pas dans mon code...

[Walcure]

J'ai trouvé une solution :

J'ai rajouté cette ligne dans mes balises head :

Code html :

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

<meta http-equiv="X-UA-Compatible" content="IE=8" />

Ca force le navigateur à se mettre en mode compatibilité pour IE8 si j'ai bien compris

[Shikiryu]

Code jQuery :

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

1
2
3
4
5
6
7
8
$(function() {	
	$( "#tabs" ).tabs();
});
 
$(document).ready(function(){
	$('.accordion').accordion();
 
});

Déjà, comprends-tu ce que tu fais là ?
Ensuite, as-tu regardé les erreurs JS dans la console d'IE 8 ?

[Walcure]

Merci de ta réponse Shikiryu.

Oui je sais ce que je fais. Si tu préfères j'ai rechangé le

Code :

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

$(document).ready(function(){

en

Code :

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

$(function(){

Depuis que j'ai modifier ceci, il m'annoncer une erreur dans une de mes fonctions :

Identificateur, chaîne ou nombre attendu

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
$(function(){
	$('.accordion').accordion();
 
});
 
function checkLength( o, n, min, max ) {
			if ( document.getElementById(n).length > max || document.getElementById(n).length < min ) {
				//document.getElementById(n).className = "ui-state-error";
				//updateTips( "Length of " + n + " must be between " +
					//min + " and " + max + "." );
				return false;
			} else {
				return true;
			}
		}
 
//Tabs
 
$(function() {
	$( "#dialog:ui-dialog" ).dialog( "destroy" );	
	$( "#tabs" ).tabs();
});
 
function ajouteChamp(num){
	if($('.fichier'+num).val()==""){
	$('.fichier'+num).after('<br/> <input class="fichier'+(num+1)+'" style="width:100%" type="file" name="fichier'+(num+1)+'" onClick="ajouteChamp('+(num+1)+')">');
	}
}
 
function renameGalerie(id){
	$('#contenuRename').css('display','block');
 
		$('#dialRename').dialog({
			autoOpen : true,
			position : new Array('center',150),
			resizable : true,
			draggable : true,
			modal : true,
			title:"Modification du nom d'une galerie",
			close: function(){
				$('#error').css('display','none');
			},
 
			buttons: {
					Rename: function() {
						var bValid = true;
						//allFields.removeClass( "ui-state-error" );
 
						bValid = (document.getElementById("rename").value.length>0);
 
						if ( bValid ) {
							$('#formRename').attr('action',"renameGalerie.php?id="+id);
							$('#formRename').submit();
						}else{
							$('#error').css('display','block');
						}
					},
					Cancel: function() {
						$( this ).dialog( "close" );
					}
 
			}	//<<<<<<<			
		});
 
}
 
 
function ouvreGalerie(id){
	$('#vueGalerie').css('display','none');
	$('#contenuGalerie').css('display','block');
	$('#contenuGalerie').text("Chargement...");
	$('#contenuGalerie').load('contenuGalerie.php?id='+id);	
}
 
function fermeGalerie(){
	$('#vueGalerie').css('display','block');
	$('#contenuGalerie').empty();
	$('#contenuGalerie').css('display','none');
 
}
 
function toutCocher(){
	$('.checkBox').each(function(index, element) {
       	$(element).attr('checked','checked'); 
    });	
}

Par ailleurs j'ai retiré une virgule qui n'avait rien a faire la juste au dessus de cette ligne. Depuis l'affichage des accordions et tabs fonctionnent même sans la solution que j'ai trouvé précédemment, mais j'ai toujours l'erreur.