Bonjour,
J'aimerais commencer à réaliser un slideshow, mes flèches sont positionnées, elles détectent la gauche et la droite. En revanche quand je clique vers la droite pour passer à la seconde image cela ne fonctionne pas.
Ce serait vraiment sympa si quelqu'un pouvait m'aider
J'aimerais commencer à réaliser un slideshow, mes flèches sont positionnées, elles détectent la gauche et la droite. En revanche quand je clique vers la droite pour passer à la seconde image cela ne fonctionne pas.
Ce serait vraiment sympa si quelqu'un pouvait m'aider
<html>
<body>
<!-- CONTAINER -->
<div id="container">
<div class="project" style="position: relative; z-index:1;">
<div class="slideshow_component" rel="started" id="slideshow_component_8962324_0" style="height: 1184px; width: 1579px;">
<div class="slideshow_nav above" id="slideshow_nav_8962324_0">
<a id="prev_8962324_0" class="slide_prev_8962324 slide_prev" href="#"></a>
<span class="slide_slash"></span>
<a id="next_8962324_0" class="slide_next_8962324 slide_next" href="#"></a>
</div>
<div class="slideshow_wrapper" id="slideshow_wrapper_8962324_0" style="width: 1579px; height: 1184px;">
<a href="#" id="slideclick_8962324_0" class="slideclick">
<div class="slideshow_container" id="slideshow_container_8962324_0" style="height: 1184px; position: relative; width: 1579px;">
<img src="../images/skopia/skopia01.png">
<img src="../images/skopia/skopia02.png">
</div>
<!-- close slideshow_container -->
</a> <!-- close slideclick -->
</div>
</div>
</div>
<div class="project" style="position: relative;z-index:1;">
<div id="texte">
<br>SKOPIA
<p>
Site web + application
</div>
</div>
</div>
<script type="text/javascript" src="/_jsapps/_libs/cargo.rail.package.js"></script>
<script type="text/javascript" src="/_jsapps/rail/rail.app.js"></script>
<script type="text/javascript" src="/_jsapps/rail/rail.jquery.js"></script>
</body>
</html>
.portfolio {
margin: 90px 50px;
text-align:center;
}
.work {
display:inline-block;
vertical-align: top;
position:relative;
z-index:1;
margin:-3.5px;
}
#container {
margin-top: 50px;
margin-bottom:100px;
color:#000;
}
.project {
display:block;
margin:auto;
padding-top:50px;
position:relative;
z-index:1;
max-width:1000px;
}
#texte{
border-top:1px solid #000;
height:35px;
text-align:center;
line-height:20px;
}
img{
max-width:100%;
height:auto;
}
iframe{
max-width:100%;
}
.slideshow_component {
position: relative;
min-height: 10px;
margin: 0 15px 0 0;
z-index: 99;
}
div {
display: block;
}
.slideshow_nav {
color: #000;
}
.slideshow_nav a {
color: #000;
text-decoration: none;
}
.slideshow_clash {
color: #000;
text-decoration: none;
}
.slide_prev {
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 50%;
cursor: url("http://i.imgur.com/2yjgTTg.png"), auto;
z-index: 99999;
background: none!important;
}
.slide_next {
display: block;
right: 0;
width: 50%;
position: absolute;
top: 0;
bottom: 0;
cursor: url("http://i.imgur.com/jus5QnD.png"), auto;
z-index: 99999;
background: none!important;
}
.slideshow_wrapper {
clear: both;
padding: 0;
}
user agent stylesheetdiv {
display: block;
}
.slideshow_wrapper a, .slideshow_wrapper a:hover, .slideshow_wrapper a:active {
background: none !important;
}
user agent stylesheeta:-webkit-any-link {
color: -webkit-link;
text-decoration: underline;
cursor: auto;
}
element.style {
position: relative;
}