Bonjour tous le monde et je vous souhaites une bonne année 2016 alors voila j'ai un gros problème tout d'abord je vous donne le lien ou j'ai upload le site (la ou ya le problème sa vous aidera à visualiser) http://www.paulinechantre.com/ alors voila j'utilise orbit pour faire passer des images (sur la pâge d'accueil pas de problème à l'arriver) par contre si je veut charger un autre onglet avec un autre orbit en ajax (ici l'onglet contact) j'ai tous le contenu html des balise mais aucun slider (regarder l'onglet contact). et j'ai beau chercher je ne trouve pas de solution à ce problème je vous envois le code source de ma pâge contact (le template basique orbite) et mon code js
contact.html:
app.js:Code HTML:<div class="orbit" role="region" aria-label="Favorite Space Pictures" data-orbit data-use-m-u-i="false"> <ul class="orbit-container"> <button class="orbit-previous" aria-label="previous"><span class="show-for-sr">Previous Slide</span>◀</button> <button class="orbit-next" aria-label="next"><span class="show-for-sr">Next Slide</span>▶</button> <li class="orbit-slide" > <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20appartement%20Parisien00001.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20appartement%20Parisien00002.jpg" ></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20appartement%20Parisien00003.jpg" ></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20appartement%20Parisien00004.jpg" ></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20appartement%20Parisien00005.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00001.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00002.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00003.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00004.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00005.jpg"></p> </div> </li> <!-- Problème dimension <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00006.jpg" ></p> </div> </li> --> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00007.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00008.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00009.jpg"></p> </div> </li> <li class="orbit-slide"> <div> <p class="text-center"><img src="img/Illustrations/Am%C3%A9nagement%20comble00010.jpg"></p> </div> </li> </ul> <nav class="orbit-bullets"> <button class="is-active" data-slide="0"><span class="show-for-sr">First slide details.</span><span class="show-for-sr">Current Slide</span></button> <button data-slide="1"><span class="show-for-sr">Second slide details.</span></button> <button data-slide="2"><span class="show-for-sr">Third slide details.</span></button> <button data-slide="3"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="4"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="5"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="6"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="7"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="8"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="9"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="10"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="11"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="12"><span class="show-for-sr">Fourth slide details.</span></button> <button data-slide="13"><span class="show-for-sr">Fourth slide details.</span></button> </nav> </div>
Code:$(document).foundation(); $("#home").click(function(){ $(".page").load("vue/home.html"); }); $("#rea").click(function(){ $(".page").load("vue/realisation.html"); }); $("#agence").click(function(){ $(".page").load("vue/agence.html"); }); $("#contact").click(function(){ $(".page").load("vue/contact.html"); }); $("#shop").click(function(){ $(".page").load("vue/shopping.html"); });
Merci à tous ceux qui voudrons m'aider
-----