Deux slider dans la meme page

Fermé
stophking Messages postés 5 Date d'inscription dimanche 10 juillet 2005 Statut Membre Dernière intervention 20 novembre 2013 - 20 nov. 2013 à 23:21
Ysabe_l Messages postés 12456 Date d'inscription vendredi 12 avril 2013 Statut Contributeur Dernière intervention 25 avril 2024 - 26 nov. 2013 à 23:22
Bonjour,

Voila, je travail sur un site de menuiserie et je me trouve bloquer devant un petit problème c'est que après l'insertion d'une deuxième slider la première affiche seulement la première image .


voila le code de la page :


<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>

<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<title>plancheaccacia.com</title>
<meta name="description" content="l'art du bois sur plancheaccacia.com">
<meta name="author" content="stophking">

<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

<!-- CSS
================================================== -->
<link rel="stylesheet" href="css/zerogrid.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsiveslides.css" />
<link rel="stylesheet" href="css/responsive.css">

<!--[if lt IE 8]>
<div style=' clear: both; text-align:center; position: relative;'>
<a href="https://support.microsoft.com/en-us/office/internet-explorer-help-23360e49-9cd3-4dda-ba52-705336cc0de2?ui=en-US&rs=en-001&ad=US">
<img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
</a>
</div>
<![endif]-->
<!--[if lt IE 9]>
<script src="js/html5.js"></script>
<script src="js/css3-mediaqueries.js"></script>
<![endif]-->
<link href='./images/favicon.ico' rel='icon' type='image/x-icon'/>

<script src="js/jquery.min.js"></script>
<script src="js/responsiveslides.js"></script>
<script>
$(function () {
$("#slider").responsiveSlides({
auto: true,
pager: true,
nav: true,
speed: 500,
maxwidth: 960,
namespace: "centered-btns"
});
});
</script>

<!-- Insert to your webpage before the </head> -->
<script src="sliderengine/jquery.js"></script>
<script src="sliderengine/amazingslider.js"></script>
<script src="sliderengine/initslider-1.js"></script>
<!-- End of head section HTML codes -->


</head>
<body >

<!--------------Header--------------->
<header>
<div class="zerogrid">
<div class="row">
<div class="col05">
<div id="logo"><a href=""><img src="./images/logo.png"/></a></div>
</div>
<div class="col06 offset05">
<div id='search-box'>
<form action='' id='search-form' method='get' target='_top'>
<input id='search-text' name='q' placeholder='type here' type='text'/>
<button id='search-button' type='submit'><span>Search</span></button>
</form>
</div>
</div>
</div>
</div>
</header>

<!--------------Navigation--------------->

<nav>
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="qui_somme_nous.html">Qui sommes nous ?</a></li>
<li><a href="service.html">Nos services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>


<!--------------Content--------------->
<section id="content">
<div class="zerogrid">
<div class="row block">

<div class="featured col16">
<div class="rslides_container">
<ul class="rslides" id="slider">
<li><img src="images/1.jpg"/></li>
<li><img src="images/2.jpg"/></li>
<li><img src="images/3.jpg"/></li>
<li><img src="images/4.jpg"/></li>
</ul>
</div>
</div>
<div class="sidebar col05">
<section>
<div class="heading">Categories</div>
<div class="content">
<ul class="list">
<li><a href="chambre_a_couche.html">chambre à couché</a></li>
<li><a href="plafon_et_fenetre.html">plafon et fenetre</a></li>
<li><a href="portes_et_escalier.html">portes et escalier</a></li>
<li><a href="placard.html">placard</a></li>
<li><a href="cuisine_et_salle_a_manger.html">cuisine et salle à manger</a></li>
<li><a href="salon_et_meridien.html">salon et meridien</a></li>
<li><a href="chemine_et_habillage.html">cheminé et habillage</a></li>

</ul>
</div>
</section>
<section>
<div class="heading">Liens utiles</div>
<div class="content">
<ul class="list">
<li><a href="https://www.artisanat.gov.ma/ar/" target="_blank">Ministère de l'Artisanat</a></li>
<li><a href="http://www.tourisme.gov.ma" target="_blank">Ministère de tourisme</a></li>
<li><a href="https://fesmeknesinvest.ma/" target="_blank">Centre d'investissement</a></li>
<li><a href="https://www.minculture.gov.ma/" target="_blank">Ministère de la Culture</a></li>
</ul>
</div>
</section>
</div>

<div class="main-content col11">

<article>
<div class="heading">
<h2><div style="margin:30px auto;max-width:450px;">

<!-- Insert to your webpage where you want to display the slider -->
<div id="amazingslider-1" style="display:block;position:relative;margin:16px auto 86px;">
<ul class="amazingslider-slides" style="display:none;">
<li><img src="images\chambre_a_couche/cac.jpg" alt="Chambre a couché " /></li>
<li><img src="images\chambre_a_couche/cac1.jpg" alt="Chambre a couché 2" /></li>
<li><img src="images\chambre_a_couche/cac2.jpg" alt="Chambre a couché 3" /></li>
<li><img src="images\chambre_a_couche/cac4.jpg" alt="Chambre a couché 5" /></li>
<li><img src="images\chambre_a_couche/cac5.jpg" alt="Chambre a couché 6" /></li>
<li><img src="images\chambre_a_couche/cac6.jpg" alt="Chambre a couché 7" /></li>
<li><img src="images\chambre_a_couche/cac8.jpg" alt="Chambre a couché 9" /></li>
<li><img src="images\chambre_a_couche/cac9.jpg" alt="Chambre a couché 10" /></li>
<li><img src="images\chambre_a_couche/cac10.jpg" alt="Chambre a couché 11" /></li>
<li><img src="images\chambre_a_couche/cac11.jpg" alt="Chambre a couché 12" /></li>
<li><img src="images\chambre_a_couche/cac12.jpg" alt="Chambre a couché 13" /></li>
<li><img src="images\chambre_a_couche/cac13.jpg" alt="Chambre a couché 14" /></li>
</ul>
<ul class="amazingslider-thumbnails" style="display:none;">
<li><img src="images\chambre_a_couche/cac-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac1-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac2-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac3-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac5-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac6-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac7-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac9-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac10-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac11-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac12-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac13-tn.jpg" /></li>
</ul>

</div>
<!-- End of body section HTML codes -->

</div>
</h2>
<div class="content"><center>Sté planche accacia <br>
Tel/fax : 05 35 61 67 07<br>
GSM : 06 61 99 25 06 ,
06 68 20 83 56 <br>
Email : Info@plancheaccacia.com<br>
Adresse : 3 Lot. Rezkia Mtfleurie II Mag.N°2 - Fès
Maroc</center></div>
</div>
</article>
</div>

</div>



</div>
</section>
<!--------------Footer--------------->
<footer></footer>

<div id="copyright">
<p>Copyright © 2013 - Plachaccacia.com<br></p>
<p></p>
<p> </p>
</div>

</body></html>



--
A voir également:

2 réponses

aucune réponse jusqu'à maintenant ???
0
Ysabe_l Messages postés 12456 Date d'inscription vendredi 12 avril 2013 Statut Contributeur Dernière intervention 25 avril 2024 274
26 nov. 2013 à 23:22
Bonjour,

Difficile à dire sans le code du slider, mais à première vue je dirais de faire ça

<div id="amazingslider-1" style="display:block;position:relative;margin:16px auto 86px;">
<ul class="amazingslider-slides" style="display:none;">
<li><img src="images\chambre_a_couche/cac.jpg" alt="Chambre a couché " /></li>
<li><img src="images\chambre_a_couche/cac1.jpg" alt="Chambre a couché 2" /></li>
<li><img src="images\chambre_a_couche/cac2.jpg" alt="Chambre a couché 3" /></li>
<li><img src="images\chambre_a_couche/cac4.jpg" alt="Chambre a couché 5" /></li>
<li><img src="images\chambre_a_couche/cac5.jpg" alt="Chambre a couché 6" /></li>
<li><img src="images\chambre_a_couche/cac6.jpg" alt="Chambre a couché 7" /></li>
<li><img src="images\chambre_a_couche/cac8.jpg" alt="Chambre a couché 9" /></li>
<li><img src="images\chambre_a_couche/cac9.jpg" alt="Chambre a couché 10" /></li>
<li><img src="images\chambre_a_couche/cac10.jpg" alt="Chambre a couché 11" /></li>
<li><img src="images\chambre_a_couche/cac11.jpg" alt="Chambre a couché 12" /></li>
<li><img src="images\chambre_a_couche/cac12.jpg" alt="Chambre a couché 13" /></li>
<li><img src="images\chambre_a_couche/cac13.jpg" alt="Chambre a couché 14" /></li>
</ul>
</div>
<div id="amazingslider-2" style="display:block;position:relative;margin:16px auto 86px;">

<ul class="amazingslider-thumbnails" style="display:none;">
<li><img src="images\chambre_a_couche/cac-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac1-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac2-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac3-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac5-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac6-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac7-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac9-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac10-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac11-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac12-tn.jpg" /></li>
<li><img src="images\chambre_a_couche/cac13-tn.jpg" /></li>
</ul>

</div>

(sinon pour info bien que ça n'ai aucun rapport avec la question, on écrit "chambre à coucher")
0