Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Michael Iseard
Citrus-Slider-Website
Commits
9b45d6e9
Commit
9b45d6e9
authored
Apr 19, 2018
by
Michael Iseard
Browse files
bootstrap 4.1 and new slides
parent
1a585625
Changes
1
Hide whitespace changes
Inline
Side-by-side
index.html
View file @
9b45d6e9
...
...
@@ -20,8 +20,7 @@
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1, shrink-to-fit=no"
>
<!-- Bootstrap CSS -->
<link
rel=
"stylesheet"
href=
"https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity=
"sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
crossorigin=
"anonymous"
>
<link
rel=
"stylesheet"
href=
"https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css"
integrity=
"sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4"
crossorigin=
"anonymous"
>
<!-- Citrus-Slider CSS -->
<link
rel=
"stylesheet"
type=
"text/css"
href=
"css/citrus-slider.min.css?v=1.0.6"
>
...
...
@@ -34,17 +33,18 @@
<!-- OpenSans font -->
<link
href=
"https://fonts.googleapis.com/css?family=Open+Sans"
rel=
"stylesheet"
>
<link
href=
"https://fonts.googleapis.com/css?family=Libre+Franklin"
rel=
"stylesheet"
>
<title>
Citrus Slider - A modern JavaScript carousel.
</title>
<style>
body
{
font-family
:
'
Open Sans
'
,
sans-serif
;
font-family
:
'
Libre Franklin
'
,
sans-serif
;
}
.slide-text
>*
{
font-weight
:
7
00
;
.slide-text
h2
{
font-weight
:
9
00
;
text-shadow
:
1px
1px
1px
#222
;
}
...
...
@@ -65,7 +65,7 @@
}
#intro
{
background-color
:
#5
9acff
;
background-color
:
#5
1bfd6
;
color
:
#fff
;
padding-bottom
:
264px
;
}
...
...
@@ -98,26 +98,26 @@
<span
class=
"navbar-toggler-icon"
></span>
</button>
<div
class=
"collapse navbar-collapse"
id=
"navbarSupportedContent"
>
<ul
class=
"navbar-nav mr-auto"
>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"#installation"
>
Installation
</a>
</li>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"#settings"
>
Settings
</a>
</li>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"#methods"
>
Methods
</a>
</li>
</ul>
<ul
class=
"navbar-nav ml-auto"
>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"https://www.iseardmedia.com"
>
Iseard Media
</a>
</li>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"https://gitea.iseardmedia.com/michael"
>
Gitea
</a>
</li>
</ul>
</div>
<ul
class=
"navbar-nav mr-auto"
>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"#installation"
>
Installation
</a>
</li>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"#settings"
>
Settings
</a>
</li>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"#methods"
>
Methods
</a>
</li>
</ul>
<ul
class=
"navbar-nav ml-auto"
>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"https://www.iseardmedia.com"
>
Iseard Media
</a>
</li>
<li
class=
"nav-item"
>
<a
class=
"nav-item nav-link"
href=
"https://gitea.iseardmedia.com/michael"
>
Gitea
</a>
</li>
</ul>
</div>
</div>
</nav>
<div
id=
"intro"
class=
"jumbotron jumbotron-fluid"
>
...
...
@@ -147,32 +147,21 @@
<div
id=
"slider-demo-1"
class=
"citrus-slider"
data-citrus=
'{"height" : "400px", "slideTransition" : "zoom-fade"}'
>
<div>
<img
src=
"img/1.png?v=1.0.0"
>
<!-- <h2>Light, fast and free</h2> -->
<h2>
Fast, light and free
</h2>
<div
style=
"text-align: center;"
>
<a
class=
"btn btn-primary"
href=
"#installation"
>
Installation
</a>
</div>
</div>
<div>
<img
src=
"img/2.png?v=1.0.0"
>
<!-- <h2>Highly configurable</h2>
<br>
<div style="text-align: center;">
<a class="btn btn-primary" href="#settings">Settings</a>
</div> -->
</div>
<div>
<img
src=
"img/3.png?v=1.0.0"
>
<!-- <h2>Put any text here you want</h2> -->
</div>
<div>
<img
src=
"img/4.png?v=1.0.0"
>
<!-- <h2>Find out more below</h2>
<br>
<div style="text-align: center;">
<a class="btn btn-primary" href="#installation">Installation</a>
</div> -->
</div>
</div>
<p
class=
"small text-right"
>
Images courtesy of
<a
target=
"_blank"
href=
"https://www.junkanoomedia.com"
>
Junkanoo Media
</a>
</p>
<div
id=
"demo-settings"
class=
"row justify-content-center d-none d-lg-flex"
>
<div
class=
"btn-group col-md-auto"
>
<button
class=
"btn btn-outline-dark dropdown-toggle"
type=
"button"
id=
"transitionButton"
data-toggle=
"dropdown"
aria-haspopup=
"true"
...
...
@@ -465,12 +454,9 @@
</footer>
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script
src=
"https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity=
"sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin=
"anonymous"
></script>
<script
src=
"https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity=
"sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin=
"anonymous"
></script>
<script
src=
"https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity=
"sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin=
"anonymous"
></script>
<script
src=
"https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity=
"sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin=
"anonymous"
></script>
<script
src=
"https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"
integrity=
"sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ"
crossorigin=
"anonymous"
></script>
<script
src=
"https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"
integrity=
"sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm"
crossorigin=
"anonymous"
></script>
<!-- citrus-Slider JS -->
<script
src=
"js/citrus-slider.min.js?v=1.0.6"
></script>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment