11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
J'ai un conflit entre 2 scripts, popurriez-vous m'aider à le résoudre, svp ?
Le premier est un menu, le second un accordéon. Je crois que le conflit s'opère dans le BODY : si je mets le menu en premier, il ne fonctionne pas et seul l'accordéon foncinne ; si je le mets en second, il fonctionne mais pas l'accordéon.
Qui pourrait aider à coordonner les 2 scripts, svp ?
Merci

SCRIPT 1 (Menu)

<head>
<!-- Bootstrap -->
<link rel="stylesheet" href="script/jquery.sliding_menu.css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --><!-- WARNING: Respond.js doesn't work if you view the page via file:// --><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>

<body>
<!-- Menu -->
<div id="menu" style="display: none;">
<ul>
<li><font face="modern, arial, veranda"><a
href="LIEN">titre</a></font></li>
<li></li>
<li><font face="modern, arial, veranda"><a
href="javascript:history.go(-1)">Page
pr&eacute;c&eacute;dente</a></font></li>
</ul>
</div>
<font face="modern, arial, veranda">
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="script/jquery.sliding_menu.js"></script>
<script>
$(document).ready(function(){
$('#menu ul').sliding_menu_js({
header_title:'Titre',
header_logo: ""
});
});
</script></font>
</body>

SCRIPT 2

<head>
<link href="http://fonts.googleapis.com/css?family=Open+Sans"
rel="stylesheet" type="text/css">
<link href="script/dist/jquery.bbAccordion.css"
rel="stylesheet">
<link href="script/dist/demo.css" rel="stylesheet">
<link href="http://www.jqueryscript.net/css/jquerysctipttop.css"
rel="stylesheet" type="text/css">
<style>
body { font-family:'Open Sans';}
</style>
</head>

<body>
<!-- Accordeon -->
<div class="jquery-script-clear"></div>
<div class="container" style="margin-top: 100px;">
<div class="wrapper">
<h1 style="color: rgb(153, 0, 0);" class="lmb-10"><font
face="modern, arial, veranda"><font
face="modern, arial, veranda">Titre 1</font></font></h1>
<div class="bbAccordion" data-accordion-group="group1">
<div class="accordion-head">
<h2><font face="modern, arial, veranda"><big><big><font
face="modern, arial, veranda">Titre 2</font></big></big></font></h2>
</div>
<div class="accordion-content">
<ul>
<li><font face="modern, arial, veranda">1 </font></li>
<li><font face="modern, arial, veranda">2</font></li>
<li><font face="modern, arial, veranda">3</font></li>
</ul>
</div>
</div>
<font face="modern, arial, veranda"><big><big><font
face="modern, arial, veranda">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="script/dist/jquery.bbAccordion.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.bbAccordion').bbAccordion();
});
</script></font></big></big></font></div>
</div>
</body>
Bonjour...

Déjà pourrais-tu mettre ton code entre les balises script du forum Smiley cligne ça serait plus lisible.

Ensuite je vois que tu appelles 2 versions de jquery l'une derrière l'autre.

Il ne faut appeler qu'une seule version de jquery par page.

Donc choisi la version qui fonctionne pour tes 2 scripts.

Les deux se base sur l'accordion de jqueryUI.
Si tu dois avoir plusieurs accordéons sur la même page, tu devrais peut être plutôt faire le JS avec 2 instances et un seul système d'accordion Smiley smile

Enfin parfois un lien vers la page concernée ça aide aussi, pour voir des erreurs éventuelles Smiley smile

voilà ++
Bonjour,

Merci du message. Tu as raison, j'aurais dû utiliser le formatage, désolé.

J'ai mis la page ici : http://sites.internet.lu/folders/alex_p/essai/page.html

Il s'agit d'un menu est d'un accordéon. ça semble fonctionner après amélioration, sauf que
l'accordéon et le lien ne fonctionne qu'après avoir cliqué une fois sur le menu en haut, ce qui est loin d'être pratique pour un visiteur lambda, ni même en général ("cher visiteur, merci de cliquer sur le menu avant de cliquer sur les liens" ...). Une fois le menu du haut cliqué, l'accordéon et le lien fonctionnent ...

Aurais-tu une idée pour pouvir obtenir un foncionnement normal dès l'ouverture première de la page ?

Merci de ton aide Smiley biggrin
Bonjour

Alors tu peux essayer de charger tes js dans l'autre sens, le bbaccordion en premier par exemple avant le sliding
Et pareil pour les déclarations de lancement.

Ce que tu fais n'a rien d'extraordinaire et la puissance basique de jquery suffit pour faire ça...

regarde cette discussion -> http://forum.alsacreations.com/topic-5-79220-1-RnsoluFermeturemenudnroulantauclicjquery.html
Il s'agit d'un accordion écrit en jquery pur Smiley cligne

et pour le slide de ton menu gauche pareil ça se fait en direct..

Fouille un peu dans le forum tu trouveras du code presque tout prêt. et en plus tu apprendra plus en faisant par toi même plutôt qu'avec des pluggins.
Merci de ta réponse. En fait je suis pressé, ma page doit fonctionner cet après-midi et je n'ai pas le temps de fouiller en cet instant. (je regarderai ce week-end pour le plaisir d'apprendre)

Pourrais-tu avoir la gentillesse de m'aider simplement à faire fonctionner rapidement les codes pour que la page marche aujourd'hui ? Merci de ton aide. Smiley smile

A+
re.

je t'ai donner les pistes à suivre pour le fonctionnement de tes deux pluggins.

je peux difficilement faire plus.