performance updates
This commit is contained in:
parent
ffd96af2ad
commit
8e3f88cfce
8 changed files with 49 additions and 23 deletions
File diff suppressed because one or more lines are too long
|
@ -1 +1 @@
|
|||
function r(){var e=$(".hero__slider");e&&(e.on("init",function(a,o){var i=$(".movie-slide:first-child").find("[data-animation]");t(i)}),e.on("beforeChange",function(a,o,i,s){var n=$('.movie-slide[data-slick-index="'+s+'"]').find("[data-animation]");t(n)}),e.slick({autoplay:!0,autoplaySpeed:3e3,lazyLoad:"ondemand",dots:!0,fade:!1,arrows:!1,responsive:[{breakpoint:1024,settings:{slidesToShow:1,slidesToScroll:1,infinite:!0}},{breakpoint:991,settings:{slidesToShow:1,slidesToScroll:1,arrows:!1}},{breakpoint:767,settings:{slidesToShow:1,slidesToScroll:1,arrows:!1}}]}));function t(a){var o="webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend";a.each(function(){var i=$(this),s=i.data("delay"),n="animated "+i.data("animation");i.css({"animation-delay":s,"-webkit-animation-delay":s}),i.addClass(n).one(o,function(){i.removeClass(n)})})}}r();$(".movie-slider-one").slick({lazyLoad:"ondemand",autoplay:!0,slidesToShow:7,slidesToScroll:1,infinite:!0,speed:700,dots:!1,arrows:!0,nextArrow:'<div class="next"><svg class="si"><use href="#si-long-arrow-right"></svg></i></div>',prevArrow:'<div class="prev"><svg class="si"><use href="#si-long-arrow-left"></svg></i></div>',responsive:[{breakpoint:1650,settings:{slidesToShow:5}},{breakpoint:1200,settings:{slidesToShow:4}},{breakpoint:992,settings:{slidesToShow:3}},{breakpoint:768,settings:{slidesToShow:2}},{breakpoint:512,settings:{slidesToShow:2}}]});(function(e){"user strict"})(jQuery);document.addEventListener("readystatechange",e=>{});
|
||||
function r(){var e=$(".hero__slider");e&&(e.on("init",function(a,o){var i=$(".movie-slide:first-child").find("[data-animation]");t(i)}),e.on("beforeChange",function(a,o,i,s){var n=$('.movie-slide[data-slick-index="'+s+'"]').find("[data-animation]");t(n)}),e.slick({autoplay:!1,autoplaySpeed:3e3,lazyLoad:"ondemand",dots:!0,fade:!1,arrows:!1,responsive:[{breakpoint:1024,settings:{slidesToShow:1,slidesToScroll:1,infinite:!0}},{breakpoint:991,settings:{slidesToShow:1,slidesToScroll:1,arrows:!1}},{breakpoint:767,settings:{slidesToShow:1,slidesToScroll:1,arrows:!1}}]}));function t(a){var o="webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend";a.each(function(){var i=$(this),s=i.data("delay"),n="animated "+i.data("animation");i.css({"animation-delay":s,"-webkit-animation-delay":s}),i.addClass(n).one(o,function(){i.removeClass(n)})})}}r();$(".movie-slider-one").slick({lazyLoad:"ondemand",autoplay:!0,slidesToShow:7,slidesToScroll:1,infinite:!0,speed:700,dots:!1,arrows:!0,nextArrow:'<div class="next"><svg class="si"><use href="#si-long-arrow-right"></svg></i></div>',prevArrow:'<div class="prev"><svg class="si"><use href="#si-long-arrow-left"></svg></i></div>',responsive:[{breakpoint:1650,settings:{slidesToShow:5}},{breakpoint:1200,settings:{slidesToShow:4}},{breakpoint:992,settings:{slidesToShow:3}},{breakpoint:768,settings:{slidesToShow:2}},{breakpoint:512,settings:{slidesToShow:2}}]});(function(e){"user strict"})(jQuery);document.addEventListener("readystatechange",e=>{});
|
|
@ -1 +1 @@
|
|||
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:none}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-track,.slick-slider .slick-list{transform:translateZ(0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:before,.slick-track:after{display:table;content:""}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}.slick-track{height:auto}*,*:before,*:after{box-sizing:border-box}@media (max-width: 1199px){.hero{margin-top:70px}}.hero .hero__slider{display:flex;flex-direction:row;width:auto;flex-wrap:nowrap}.hero .movie-slide{padding-top:50px;padding-bottom:50px;position:relative;z-index:1;display:flex!important;flex-wrap:wrap;align-items:center;height:695px}@media (max-width: 1199px){.hero__slider .movie-slide{height:600px}}@media (max-width: 991px){.hero__slider .movie-slide{height:450px}}@media (max-width: 767px){.hero__slider .movie-slide{height:400px}}@media (max-width: 575px){.hero__slider .movie-slide{height:290px}}@media (max-width: 400px){.hero__slider .movie-slide{height:195px}}
|
||||
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:none}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-track,.slick-slider .slick-list{transform:translateZ(0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:before,.slick-track:after{display:table;content:""}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}.slick-track{height:auto}*,*:before,*:after{box-sizing:border-box}#preloader{position:fixed;width:100%;height:100vh;z-index:99999;overflow:visible;background:#1b1b3f;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;top:0;left:0}@media (max-width: 1199px){.hero{margin-top:70px}}.hero .hero__slider{display:flex;flex-direction:row;width:auto;flex-wrap:nowrap;overflow:hidden}.hero .movie-slide{padding-top:50px;padding-bottom:50px;position:relative;z-index:1;display:flex!important;flex-wrap:wrap;align-items:center;height:695px}.hero .movie-slide:after{position:absolute;content:"";top:0;left:0;width:100%;height:100%;background-color:#000;opacity:.56;z-index:-1}@media (max-width: 1199px){.hero__slider .movie-slide{height:600px}}@media (max-width: 991px){.hero__slider .movie-slide{height:450px}}@media (max-width: 767px){.hero__slider .movie-slide{height:400px}}@media (max-width: 575px){.hero__slider .movie-slide{height:290px}}@media (max-width: 400px){.hero__slider .movie-slide{height:195px}}
|
|
@ -6,7 +6,7 @@
|
|||
"isEntry": true
|
||||
},
|
||||
"resources/js/home.js": {
|
||||
"file": "assets/home-BWWQaQZ-.js",
|
||||
"file": "assets/home-D7U-g6of.js",
|
||||
"name": "home",
|
||||
"src": "resources/js/home.js",
|
||||
"isEntry": true
|
||||
|
@ -41,7 +41,7 @@
|
|||
"isEntry": true
|
||||
},
|
||||
"resources/scss/app.scss": {
|
||||
"file": "assets/app-BYCjvQk9.css",
|
||||
"file": "assets/app-DdHnhRIO.css",
|
||||
"src": "resources/scss/app.scss",
|
||||
"isEntry": true
|
||||
},
|
||||
|
@ -51,7 +51,7 @@
|
|||
"isEntry": true
|
||||
},
|
||||
"resources/scss/home.scss": {
|
||||
"file": "assets/home-BGX3ALD4.css",
|
||||
"file": "assets/home-DVemXKfY.css",
|
||||
"src": "resources/scss/home.scss",
|
||||
"isEntry": true
|
||||
},
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
doAnimations($animatingElements);
|
||||
});
|
||||
BasicSlider.slick({
|
||||
autoplay: true,
|
||||
autoplay: false,
|
||||
autoplaySpeed: 3000,
|
||||
lazyLoad: 'ondemand',
|
||||
dots: true,
|
||||
|
|
|
@ -1697,7 +1697,7 @@ a:hover {
|
|||
// }
|
||||
// }
|
||||
|
||||
.movie-slide:before {
|
||||
.movie-slide:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: 0;
|
||||
|
|
|
@ -2,10 +2,26 @@
|
|||
.slick-track {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
@import "../vendor/css/slick.css";
|
||||
*,*:before,*:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#preloader {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
z-index: 99999;
|
||||
overflow: visible;
|
||||
background: #1b1b3f;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
top: 0;
|
||||
left: 0
|
||||
}
|
||||
@media (max-width: 1199px) {
|
||||
.hero {
|
||||
margin-top: 70px;
|
||||
|
@ -17,6 +33,7 @@
|
|||
flex-direction: row;
|
||||
width: auto;
|
||||
flex-wrap: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.movie-slide {
|
||||
|
@ -31,13 +48,22 @@
|
|||
// display: block;
|
||||
height: 695px;
|
||||
|
||||
&::before {
|
||||
// display: none;
|
||||
// height: 695px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.movie-slide:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #000000;
|
||||
opacity: 0.56;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
|
|
|
@ -15,7 +15,8 @@
|
|||
<section class="hero">
|
||||
<div class="hero__slider">
|
||||
@foreach ($hero as $slider)
|
||||
<div class="movie-slide lazy bg_img" data-bg="{{ $slider['backdrop'] }}" >
|
||||
<div class="movie-slide"{{-- data-bg="{{ $slider['backdrop'] }}" --}} >
|
||||
<img style="object-fit: cover; object-position: center; z-index:-1;position:absolute; width: 100%; height:100%; pointer-events: none;" alt="{{ __($slider['title']) }} image" class="lazy" data-src="{{ $slider['backdrop'] }}" width="780" height="439" src="data:image/svg+xml,%3Csvg width='780' height='439' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='780' height='439' x='0' y='0' fill='%231B1B3F' /%3E%3C/svg%3E">
|
||||
<div class="movie-slide__content">
|
||||
<h2 class="movie-name" data-animation="fadeInUp" data-delay=".2s">{{ __($slider['title']) }}</h2>
|
||||
<ul class="movie-meta justify-content-lg-start justify-content-center" data-animation="fadeInUp" data-delay=".4s">
|
||||
|
@ -32,15 +33,14 @@
|
|||
</ul>
|
||||
<p data-animation="fadeInUp" data-delay=".7s">{{ __($slider['overview']) }}</p>
|
||||
<div class="btn-area justify-content-lg-start justify-content-center align-items-center mt-lg-5 mt-sm-3 mt-2" data-animation="fadeInLeft" data-delay="1s">
|
||||
{{-- @if ($slider->item->item_type == 3) --}}
|
||||
<a class="video-btn justify-content-lg-start justify-content-center" href="{{ route('movie', ['slug' => $slider['slug'], 'id' => $slider['id']]) }}">
|
||||
<div class="icon">
|
||||
<svg class="si">
|
||||
<use href="#si-play"></use>
|
||||
</svg>
|
||||
</div>
|
||||
<span>@lang('Watch')</span>
|
||||
</a>
|
||||
<a class="video-btn justify-content-lg-start justify-content-center" href="{{ route('movie', ['slug' => $slider['slug'], 'id' => $slider['id']]) }}">
|
||||
<div class="icon">
|
||||
<svg class="si">
|
||||
<use href="#si-play"></use>
|
||||
</svg>
|
||||
</div>
|
||||
<span>@lang('Watch')</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue