Commit 292cb39d authored by Michael Iseard's avatar Michael Iseard
Browse files

update demo

parent 506583f5
......@@ -11,12 +11,33 @@
crossorigin="anonymous">
<!-- Skroll-Slider CSS -->
<link rel="stylesheet" type="text/css" href="css/skroll-slider.min.css?v=1.0.0">
<link rel="stylesheet" type="text/css" href="css/skroll-slider.min.css?v=1.0.1">
<!-- highlightjs -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css">
<title>Skroll-Slider Demo</title>
<style>
.btn-primary,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:visited,
.btn-primary:focus {
background-color: #F49E4C;
border-color: #F28A27;
}
#intro {
background-color:#59acff;
color: #fff;
}
#intro hr {
border-top: 1px solid rgba(255, 255, 255, 0.53);
}
</style>
</head>
<body>
......@@ -38,16 +59,16 @@
</div>
</div>
</nav>
<div class="jumbotron jumbotron-fluid" style="background-color:#59acff; color: #fff;">
<div id="intro" class="jumbotron jumbotron-fluid">
<div class="container">
<h1 class="display-3">Skroll Slider</h1>
<p class="lead">A modern JavaScript carousel with no third party requirements.</p>
<hr class="my-4" style="border-top: 1px solid rgba(255, 255, 255, 0.53);">
<hr class="my-4">
<p class="lead">
<a class="btn btn-primary btn-lg" href="https://gitea.iseardmedia.com/michael/Skroll-Slider/archive/1.0.0.zip" role="button">Download</a>
<a class="btn btn-primary btn-lg" href="https://gitea.iseardmedia.com/michael/Skroll-Slider" role="button">Source</a>
</p>
<p>v1.0.0</p>
<p>v1.0.1</p>
</div>
</div>
<div class="container">
......@@ -56,16 +77,14 @@
<div id="slider-demo-1" class="skroll-slider" data-skroll='{"duration" : 5000, "transition" : "zoom-fade"}' style="width:100%; height: 400px;">
<div>
<img src="img/1.jpg">
<h2>Slide 1</h2>
<p>First slide with some sample text</p>
<h2>Light, fast and free</h2>
</div>
<div>
<img src="img/2.jpg">
<h2>Slide 2</h2>
<h2>You can put any text here you want.</h2>
</div>
<div>
<img src="img/3.jpg">
<h2>Slide 3</h2>
</div>
</div>
</section>
......@@ -83,7 +102,7 @@
&lt;/div&gt;
</code>
</pre>
<h3>With Text</h3>
<h3>With text</h3>
<pre>
<code class="html">
&lt;div class="skroll-slider"&gt;
......@@ -121,7 +140,7 @@
crossorigin="anonymous"></script>
<!-- Skroll-Slider JS -->
<script src="js/skroll-slider.min.js?v=1.0.0"></script>
<script src="js/skroll-slider.min.js?v=1.0.1"></script>
<!-- highlight.js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment