deblan/kute.js
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Browse source
This commit is contained in:
thednp 2020-07-02 10:57:32 +00:00
parent 6bfa00da75
commit da4a2108f8
2 changed files with 14 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
demo/assets/css/spicr-theme.css
View file

@ -159,4 +159,14 @@ height:600px
letter-spacing:-1px;
margin:0 0 1.5rem
}
}
}
.background-top-left { background-position: top left !important}
.background-top-center { background-position: top center !important}
.background-top-right { background-position: top center !important}
.background-center-left { background-position: center left !important}
.background-center-center { background-position: center center !important}
.background-center-right { background-position: center right !important}
.background-bottom-left { background-position: bottom left !important}
.background-bottom-center { background-position: bottom center !important}
.background-bottom-right { background-position: bottom right !important}

6
demo/index.html
View file

@ -78,12 +78,12 @@
<div id="SpicrDemo" class="spicr spicr-slider" data-interval="false" >
<div class="spicr-inner">
<div class="item">
<div class="item-bg spicr-layer bg-blue" data-translate="x:-100%" data-duration="700" data-easing="easingCubicInOut" data-src="https://picsum.photos/id/992/1680/720.jpg">
<div class="item-bg spicr-layer bg-blue background-bottom-center" data-translate="x:-100%" data-duration="700" data-easing="easingCubicInOut" data-src="https://picsum.photos/id/992/1680/720.jpg">
<div class="overlay"></div>
</div>
<div class="content-wrap h-100"> <!-- IE9 fix -->
<div class="d-flex align-items-center h-100">
<div class="flex-column w-md-50 text-center" style="margin: 0 auto">
<div class="d-flex align-items-end h-100">
<div class="flex-column w-md-50 text-center mb-5" style="margin: 0 auto">
<div class="spicr-layer" data-translate="x:-250" data-duration="600" data-easing="easingCubicInOut">
<h1>Welcome to KUTE.js!</h1>
</div>