For supporting file is use in online link below :-
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.css"/>
<link rel="stylesheet" type="text/css" href=" https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.0/css/bootstrap.css"/>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<link rel="stylesheet" type="text/css" href=" https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.0/css/bootstrap.css"/>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
For css or js download file link below :-
HTML
<section id="slider">
<div class="tp-banner-container">
<div class="tp-banner">
<ul>
<li data-transition="fade" data-slotamount="7" data-masterspeed="2000" data-thumb="images/slide1.jpg" data-delay="10000">
<img src="assets/img/dummy.png" alt="laptopmockup_sliderdy" data-lazyload="images/slide1.jpg" data-bgposition="right top" data-duration="12000" data-ease="Power0.easeInOut" data-bgfit="115" data-bgfitend="100" data-bgpositionend="center bottom">
<div class="tp-caption sft skewtotop tp-resizeme title start" data-x="center" data-y="center" data-voffset="-90" data-speed="800" data-start="950" data-easing="Power4.easeOut" data-splitin="none" data-splitout="none" data-elementdelay="0.01" data-endelementdelay="0.1" data-endspeed="1000" data-endeasing="Power4.easeIn" style="z-index: 11;">
<h3 style="text-align: center; min-height: 0px; min-width: 0px; line-height: 94px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 2px; font-size: 24px; text-transform: uppercase; font-weight: 700; color: #fff;">Find Your Dream Apartment!</h3>
</div>
<div class="tp-caption largeHeadingWhite sfl str tp-resizeme start" data-x="center" data-y="center" data-voffset="-40" data-speed="1200" data-start="950" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="800" data-endeasing="easeInOutExpo">
<h1 style="text-align: center; min-height: 0px; min-width: 0px; line-height: 94px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 2px; font-size: 50px; text-transform: uppercase; font-weight: 700; color: #fff;">Get Started with <span style="color:yellow!important; font-size: 50px;">EstateX</span></h1>
</div>
<div class="tp-caption detailTextWhiteLarge sfl tp-resizeme start" data-x="center" data-y="center" data-voffset="30" data-speed="1200" data-start="1350" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="300"><p style="min-height: 0px; min-width: 0px; line-height: 30px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 0px; font-size: 14px; color: #fff; text-align: center;">Lorem consectetur adipiscing elit, sed do eiusmod tempor dolor sit amet <br> contetur adipiscing elit, sed do eiusmod tempor incididunt</p>
</div>
<div class="tp-caption sfb tp-resizeme start" data-x="center" data-hoffset="0" data-y="center" data-voffset="90" data-speed="1200" data-start="1750" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="300"><a href="#" class="btn btn-common btn-lg">View Details</a>
</div>
</li>
<li data-transition="fade" data-slotamount="7" data-masterspeed="2000" data-thumb="images/slide2.jpg" data-delay="10000">
<img src="assets/img/dummy.png" alt="laptopmockup_sliderdy" data-lazyload="images/slide2.jpg" data-bgposition="right top" data-duration="12000" data-ease="Power0.easeInOut" data-bgfit="115" data-bgfitend="100" data-bgpositionend="center bottom">
<div class="tp-caption sft skewtotop tp-resizeme title start" data-x="center" data-y="center" data-voffset="-90" data-speed="800" data-start="950" data-easing="Power4.easeOut" data-splitin="none" data-splitout="none" data-elementdelay="0.01" data-endelementdelay="0.1" data-endspeed="1000" data-endeasing="Power4.easeIn" style="z-index: 11;">
<h3 style="text-align: center; min-height: 0px; min-width: 0px; line-height: 94px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 2px; font-size: 24px; text-transform: uppercase; font-weight: 700; color: #fff;">Get Your Dream Office!</h3>
</div>
<div class="tp-caption largeHeadingWhite sfl str tp-resizeme start" data-x="center" data-y="center" data-voffset="-40" data-speed="1200" data-start="950" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="800" data-endeasing="easeInOutExpo">
<h1 style="text-align: center; min-height: 0px; min-width: 0px; line-height: 94px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 2px; font-size: 50px; text-transform: uppercase; font-weight: 700; color: #fff;">Best Apartments to Sale</h1>
</div>
<div class="tp-caption detailTextWhiteLarge sfl tp-resizeme start" data-x="center" data-y="center" data-voffset="30" data-speed="1200" data-start="1350" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="300"><p style="min-height: 0px; min-width: 0px; line-height: 30px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 0px; font-size: 14px; color: #fff; text-align: center;">Lorem consectetur adipiscing elit, sed do eiusmod tempor dolor sit amet <br> contetur adipiscing elit, sed do eiusmod tempor incididunt</p>
</div>
<div class="tp-caption sfb tp-resizeme start" data-x="center" data-hoffset="0" data-y="center" data-voffset="90" data-speed="1200" data-start="1750" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="300"><a href="#" class="btn btn-common btn-lg">View Details</a>
</div>
</li>
<li data-transition="fade" data-slotamount="7" data-masterspeed="2000" data-thumb="images/slide3.jpg" data-delay="10000">
<img src="assets/img/dummy.png" alt="laptopmockup_sliderdy" data-lazyload="images/slide3.jpg" data-bgposition="right top" data-duration="12000" data-ease="Power0.easeInOut" data-bgfit="115" data-bgfitend="100" data-bgpositionend="center bottom">
<div class="tp-caption sft skewtotop tp-resizeme title start" data-x="center" data-y="center" data-voffset="-90" data-speed="800" data-start="950" data-easing="Power4.easeOut" data-splitin="none" data-splitout="none" data-elementdelay="0.01" data-endelementdelay="0.1" data-endspeed="1000" data-endeasing="Power4.easeIn" style="z-index: 11;">
<h3 style="text-align: center; min-height: 0px; min-width: 0px; line-height: 94px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 2px; font-size: 24px; text-transform: uppercase; font-weight: 700; color: #fff;">Find Your Dream Home!</h3>
</div>
<div class="tp-caption largeHeadingWhite sfl str tp-resizeme start" data-x="center" data-y="center" data-voffset="-40" data-speed="1200" data-start="950" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="800" data-endeasing="easeInOutExpo">
<h1 style="text-align: center; min-height: 0px; min-width: 0px; line-height: 94px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 2px; font-size: 50px; text-transform: uppercase; font-weight: 700; color: #fff;">Best Apartments to Rent </h1>
</div>
<div class="tp-caption detailTextWhiteLarge sfl tp-resizeme start" data-x="center" data-y="center" data-voffset="30" data-speed="1200" data-start="1350" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="300"><p style="min-height: 0px; min-width: 0px; line-height: 30px; border-width: 0px; margin: 0px 0px 20px; padding: 0px; letter-spacing: 0px; font-size: 14px; color: #fff; text-align: center;">Lorem consectetur adipiscing elit, sed do eiusmod tempor dolor sit amet <br> contetur adipiscing elit, sed do eiusmod tempor incididunt</p>
</div>
<div class="tp-caption sfb tp-resizeme start" data-x="center" data-hoffset="0" data-y="center" data-voffset="90" data-speed="1200" data-start="1750" data-easing="easeInOutExpo" data-splitin="none" data-splitout="none" data-elementdelay="0.1" data-endelementdelay="0.1" data-endspeed="300"><a href="#" class="btn btn-common btn-lg">View Details</a>
</div>
</li>
</ul>
</div>
</div>
</section>
No comments:
Post a Comment