bachir/grav-lecampus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fixe gal et devis

Browse Source
This commit is contained in:
Kevin Tessier
2019-06-24 19:53:10 +02:00
parent 189ef8909a
commit 58d16cb1ba
74 changed files with 8671 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
user/themes/lecampus/js/Slides-SlidesJS-3/examples/callbacks/index.html Normal file
View File

@@ -0,0 +1,120 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>SlidesJS Basic 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 -->
<!-- SlidesJS Required: These styles are required if you'd like a responsive slideshow -->
<style>
/* Prevent the slideshow from flashing on load */
#slides {
display: none
}
/* Center the slideshow */
.container {
margin: 0 auto
}
/* Show active item in the pagination */
.slidesjs-pagination .active {
color:red;
}
/* Media quires for a responsive layout */
/* For tablets & smart phones */
@media (max-width: 767px) {
body {
padding-left: 10px;
padding-right: 10px;
}
.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/">
</div>
<div id="slidesjs-log">Slide <span class="slidesjs-slide-number">1</span> of 4</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,
callback: {
loaded: function(number) {
// Use your browser console to view log
console.log('SlidesJS: Loaded with slide #' + number);
// Show start slide in log
$('#slidesjs-log .slidesjs-slide-number').text(number);
},
start: function(number) {
// Use your browser console to view log
console.log('SlidesJS: Start Animation on slide #' + number);
},
complete: function(number) {
// Use your browser console to view log
console.log('SlidesJS: Animation Complete. Current slide is #' + number);
// Change slide number on animation complete
$('#slidesjs-log .slidesjs-slide-number').text(number);
}
}
});
});
</script>
<!-- End SlidesJS Required -->
</body>
</html>