fixe gal et devis
This commit is contained in:
@@ -0,0 +1,212 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>SlidesJS Standard Code Example</title>
|
||||
<meta name="description" content="SlidesJS is a simple slideshow plugin for jQuery. Packed with a useful set of features to help novice and advanced developers alike create elegant and user-friendly slideshows.">
|
||||
<meta name="author" content="Nathan Searles">
|
||||
|
||||
<!-- SlidesJS Required (if responsive): Sets the page width to the device width. -->
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<!-- End SlidesJS Required -->
|
||||
|
||||
<!-- CSS for slidesjs.com example -->
|
||||
<link rel="stylesheet" href="css/example.css">
|
||||
<link rel="stylesheet" href="css/font-awesome.min.css">
|
||||
<!-- End CSS for slidesjs.com example -->
|
||||
|
||||
<!-- SlidesJS Optional: If you'd like to use this design -->
|
||||
<style>
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font: normal 15px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
color: #232525;
|
||||
padding-top:70px;
|
||||
}
|
||||
|
||||
#slides,
|
||||
#slides2,
|
||||
#slides3 {
|
||||
display: none;
|
||||
margin-bottom:50px;
|
||||
}
|
||||
|
||||
.slidesjs-navigation {
|
||||
margin-top:3px;
|
||||
}
|
||||
|
||||
.slidesjs-previous {
|
||||
margin-right: 5px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.slidesjs-next {
|
||||
margin-right: 5px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.slidesjs-pagination {
|
||||
margin: 6px 0 0;
|
||||
float: right;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.slidesjs-pagination li {
|
||||
float: left;
|
||||
margin: 0 1px;
|
||||
}
|
||||
|
||||
.slidesjs-pagination li a {
|
||||
display: block;
|
||||
width: 13px;
|
||||
height: 0;
|
||||
padding-top: 13px;
|
||||
background-image: url(img/pagination.png);
|
||||
background-position: 0 0;
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.slidesjs-pagination li a.active,
|
||||
.slidesjs-pagination li a:hover.active {
|
||||
background-position: 0 -13px
|
||||
}
|
||||
|
||||
.slidesjs-pagination li a:hover {
|
||||
background-position: 0 -26px
|
||||
}
|
||||
|
||||
a:link,
|
||||
a:visited {
|
||||
color: #333
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:active {
|
||||
color: #9e2020
|
||||
}
|
||||
|
||||
.navbar {
|
||||
overflow: hidden
|
||||
}
|
||||
</style>
|
||||
<!-- End SlidesJS Optional-->
|
||||
|
||||
<!-- SlidesJS Required: These styles are required if you'd like a responsive slideshow -->
|
||||
<style>
|
||||
#slides {
|
||||
display: none
|
||||
}
|
||||
|
||||
.container {
|
||||
margin: 0 auto
|
||||
}
|
||||
|
||||
/* For tablets & smart phones */
|
||||
@media (max-width: 767px) {
|
||||
body {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.container {
|
||||
width: auto
|
||||
}
|
||||
}
|
||||
|
||||
/* For smartphones */
|
||||
@media (max-width: 480px) {
|
||||
.container {
|
||||
width: auto
|
||||
}
|
||||
}
|
||||
|
||||
/* For smaller displays like laptops */
|
||||
@media (min-width: 768px) and (max-width: 979px) {
|
||||
.container {
|
||||
width: 724px
|
||||
}
|
||||
}
|
||||
|
||||
/* For larger displays */
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
width: 1170px
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<!-- SlidesJS Required: -->
|
||||
</head>
|
||||
<body>
|
||||
<!-- SlidesJS Required: Start Slides -->
|
||||
<!-- The container is used to define the width of the slideshow -->
|
||||
<div class="container">
|
||||
<div id="slides">
|
||||
<img src="img/example-slide-1.jpg" alt="Photo by: Missy S Link: http://www.flickr.com/photos/listenmissy/5087404401/">
|
||||
<img src="img/example-slide-2.jpg" alt="Photo by: Daniel Parks Link: http://www.flickr.com/photos/parksdh/5227623068/">
|
||||
<img src="img/example-slide-3.jpg" alt="Photo by: Mike Ranweiler Link: http://www.flickr.com/photos/27874907@N04/4833059991/">
|
||||
<img src="img/example-slide-4.jpg" alt="Photo by: Stuart SeegerLink: http://www.flickr.com/photos/stuseeger/97577796/">
|
||||
<a href="#" class="slidesjs-previous slidesjs-navigation"><i class="icon-chevron-left"></i></a>
|
||||
<a href="#" class="slidesjs-next slidesjs-navigation"><i class="icon-chevron-right"></i></a>
|
||||
</div>
|
||||
|
||||
<div id="slides2">
|
||||
<img src="img/example-slide-1.jpg" alt="Photo by: Missy S Link: http://www.flickr.com/photos/listenmissy/5087404401/">
|
||||
<img src="img/example-slide-2.jpg" alt="Photo by: Daniel Parks Link: http://www.flickr.com/photos/parksdh/5227623068/">
|
||||
<img src="img/example-slide-3.jpg" alt="Photo by: Mike Ranweiler Link: http://www.flickr.com/photos/27874907@N04/4833059991/">
|
||||
<img src="img/example-slide-4.jpg" alt="Photo by: Stuart SeegerLink: http://www.flickr.com/photos/stuseeger/97577796/">
|
||||
<a href="#" class="slidesjs-previous slidesjs-navigation"><i class="icon-chevron-left"></i></a>
|
||||
<a href="#" class="slidesjs-next slidesjs-navigation"><i class="icon-chevron-right"></i></a>
|
||||
</div>
|
||||
|
||||
<div id="slides3">
|
||||
<img src="img/example-slide-1.jpg" alt="Photo by: Missy S Link: http://www.flickr.com/photos/listenmissy/5087404401/">
|
||||
<img src="img/example-slide-2.jpg" alt="Photo by: Daniel Parks Link: http://www.flickr.com/photos/parksdh/5227623068/">
|
||||
<img src="img/example-slide-3.jpg" alt="Photo by: Mike Ranweiler Link: http://www.flickr.com/photos/27874907@N04/4833059991/">
|
||||
<img src="img/example-slide-4.jpg" alt="Photo by: Stuart SeegerLink: http://www.flickr.com/photos/stuseeger/97577796/">
|
||||
<a href="#" class="slidesjs-previous slidesjs-navigation"><i class="icon-chevron-left"></i></a>
|
||||
<a href="#" class="slidesjs-next slidesjs-navigation"><i class="icon-chevron-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End SlidesJS Required: Start Slides -->
|
||||
|
||||
<!-- SlidesJS Required: Link to jQuery -->
|
||||
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
|
||||
<!-- End SlidesJS Required -->
|
||||
|
||||
<!-- SlidesJS Required: Link to jquery.slides.js -->
|
||||
<script src="js/jquery.slides.min.js"></script>
|
||||
<!-- End SlidesJS Required -->
|
||||
|
||||
<!-- SlidesJS Required: Initialize SlidesJS with a jQuery doc ready -->
|
||||
<script>
|
||||
$(function() {
|
||||
$('#slides').slidesjs({
|
||||
width: 940,
|
||||
height: 528,
|
||||
navigation: false
|
||||
});
|
||||
|
||||
/*
|
||||
To have multiple slideshows on the same page
|
||||
they just need to have separate IDs
|
||||
*/
|
||||
$('#slides2').slidesjs({
|
||||
width: 940,
|
||||
height: 528,
|
||||
navigation: false,
|
||||
start: 3,
|
||||
play: {
|
||||
auto: true
|
||||
}
|
||||
});
|
||||
|
||||
$('#slides3').slidesjs({
|
||||
width: 940,
|
||||
height: 528,
|
||||
navigation: false
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<!-- End SlidesJS Required -->
|
||||
</body>
|
||||
</html>
|
Reference in New Issue
Block a user