0
Bonsoir, j'utilise cycle2 avec la fonction prev et next, mais je ne peux pas centrer la fonction prev et next sous les images. J'ai regardé autour et je sais que ça va être stupide, mais je ne peux pas le voir. Très frustrant. Merci GaryCycle 2 Précédent et Suivant
<script src="../../respond.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://malsup.github.com/jquery.cycle2.js"></script>
<script src="http://malsup.github.io/jquery.cycle2.center.js"></script>@charset "UTF-8";
/* Simple fluid media
Note: Fluid media requires that you remove the media's height and width attributes from the HTML
http://www.alistapart.com/articles/fluid-images/
*/
img, object, embed, video {
\t max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
\t width:100%;
}
/*
\t Dreamweaver Fluid Grid Properties
\t ----------------------------------
\t dw-num-cols-mobile: \t \t 4;
\t dw-num-cols-tablet: \t \t 8;
\t dw-num-cols-desktop: \t 12;
\t dw-gutter-percentage: \t 25;
\t
\t Inspiration from "Responsive Web Design" by Ethan Marcotte
\t http://www.alistapart.com/articles/responsive-web-design
\t
\t and Golden Grid System by Joni Korpi
\t http://goldengridsystem.com/
*/
.fluid {
\t clear: both;
\t margin-left: 0;
\t width: 100%;
\t float: left;
\t display: block;
}
.fluidList {
list-style:none;
list-style-image:none;
margin:0;
padding:0;
}
/* Mobile Layout: 480px and below. */
.gridContainer {
\t margin-left: auto;
\t margin-right: auto;
\t width: 86.45%;
\t padding-left: 2.275%;
\t padding-right: 2.275%;
\t clear: none;
\t float: none;
}
#div1 {
}
.gallery {
}
.zeroMargin_mobile {
margin-left: 0;
}
.hide_mobile {
display: none;
}
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 481px) {
.gridContainer {
\t width: 90.675%;
\t padding-left: 1.1625%;
\t padding-right: 1.1625%;
\t clear: none;
\t float: none;
\t margin-left: auto;
}
#div1 {
}
.gallery {
}
.hide_tablet {
display: none;
}
.zeroMargin_tablet {
margin-left: 0;
}
}
/* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 769px) {
.gridContainer {
\t width: 88.5%;
\t max-width: 1232px;
\t padding-left: 0.75%;
\t padding-right: 0.75%;
\t margin: auto;
\t clear: none;
\t float: none;
\t margin-left: auto;
}
#div1 {
}
.gallery {
}
.zeroMargin_desktop {
margin-left: 0;
}
.hide_desktop {
display: none;
}<body>
\t <div class="gridContainer clearfix">
\t \t <div id="div1" class="fluid"></div>
<div class="fluid gallery">
<br />
<br />
<div class="cycle-slideshow"
\t data-cycle-fx="scrollHorz"
data-cycle-timeout="0"
data-cycle-prev="#prev"
data-cycle-next="#next"
data-cycle-center-horz=true
data-cycle-center-vert=true
>
<img src="http://malsup.github.io/images/p1.jpg">
<img src="http://malsup.github.io/images/p2.jpg">
<img src="http://malsup.github.io/images/p3.jpg">
<img src="http://malsup.github.io/images/p4.jpg">
</div>
<br />
<br />
<div class="center">
<span style="text-align: center; text-decoration: none; font:open-sans; font-size:12px; color:#000000;">
<a href=# id="prev">Prev</a>
<a href=# id="next">Next</a></span>
</div>
</div>
\t </div>
</body>