docs(slides): add swiper prefix in animation usage (#18073)

This commit is contained in:
Liam DeBeasi
2019-04-18 09:51:09 -04:00
committed by GitHub
parent f6524cf8c3
commit c178236e32

View File

@ -84,11 +84,11 @@ const slidesOpts = {
let $shadowBeforeEl = isHorizontal ? $slideEl.find('.swiper-slide-shadow-left') : $slideEl.find('.swiper-slide-shadow-top'); let $shadowBeforeEl = isHorizontal ? $slideEl.find('.swiper-slide-shadow-left') : $slideEl.find('.swiper-slide-shadow-top');
let $shadowAfterEl = isHorizontal ? $slideEl.find('.swiper-slide-shadow-right') : $slideEl.find('.swiper-slide-shadow-bottom'); let $shadowAfterEl = isHorizontal ? $slideEl.find('.swiper-slide-shadow-right') : $slideEl.find('.swiper-slide-shadow-bottom');
if ($shadowBeforeEl.length === 0) { if ($shadowBeforeEl.length === 0) {
$shadowBeforeEl = $(`<div class="swiper-slide-shadow-${isHorizontal ? 'left' : 'top'}"></div>`); $shadowBeforeEl = swiper.$(`<div class="swiper-slide-shadow-${isHorizontal ? 'left' : 'top'}"></div>`);
$slideEl.append($shadowBeforeEl); $slideEl.append($shadowBeforeEl);
} }
if ($shadowAfterEl.length === 0) { if ($shadowAfterEl.length === 0) {
$shadowAfterEl = $(`<div class="swiper-slide-shadow-${isHorizontal ? 'right' : 'bottom'}"></div>`); $shadowAfterEl = swiper.$(`<div class="swiper-slide-shadow-${isHorizontal ? 'right' : 'bottom'}"></div>`);
$slideEl.append($shadowAfterEl); $slideEl.append($shadowAfterEl);
} }
if ($shadowBeforeEl.length) $shadowBeforeEl[0].style.opacity = offsetMultiplier > 0 ? offsetMultiplier : 0; if ($shadowBeforeEl.length) $shadowBeforeEl[0].style.opacity = offsetMultiplier > 0 ? offsetMultiplier : 0;
@ -165,7 +165,7 @@ const slidesOpts = {
} else { } else {
$cubeShadowEl = $el.find('.swiper-cube-shadow'); $cubeShadowEl = $el.find('.swiper-cube-shadow');
if ($cubeShadowEl.length === 0) { if ($cubeShadowEl.length === 0) {
$cubeShadowEl = $('<div class="swiper-cube-shadow"></div>'); $cubeShadowEl = swiper.$('<div class="swiper-cube-shadow"></div>');
$el.append($cubeShadowEl); $el.append($cubeShadowEl);
} }
} }
@ -388,11 +388,11 @@ const slideOpts = {
let shadowBefore = swiper.isHorizontal() ? $slideEl.find('.swiper-slide-shadow-left') : $slideEl.find('.swiper-slide-shadow-top'); let shadowBefore = swiper.isHorizontal() ? $slideEl.find('.swiper-slide-shadow-left') : $slideEl.find('.swiper-slide-shadow-top');
let shadowAfter = swiper.isHorizontal() ? $slideEl.find('.swiper-slide-shadow-right') : $slideEl.find('.swiper-slide-shadow-bottom'); let shadowAfter = swiper.isHorizontal() ? $slideEl.find('.swiper-slide-shadow-right') : $slideEl.find('.swiper-slide-shadow-bottom');
if (shadowBefore.length === 0) { if (shadowBefore.length === 0) {
shadowBefore = $(`<div class="swiper-slide-shadow-${swiper.isHorizontal() ? 'left' : 'top'}"></div>`); shadowBefore = swiper.$(`<div class="swiper-slide-shadow-${swiper.isHorizontal() ? 'left' : 'top'}"></div>`);
$slideEl.append(shadowBefore); $slideEl.append(shadowBefore);
} }
if (shadowAfter.length === 0) { if (shadowAfter.length === 0) {
shadowAfter = $(`<div class="swiper-slide-shadow-${swiper.isHorizontal() ? 'right' : 'bottom'}"></div>`); shadowAfter = swiper.$(`<div class="swiper-slide-shadow-${swiper.isHorizontal() ? 'right' : 'bottom'}"></div>`);
$slideEl.append(shadowAfter); $slideEl.append(shadowAfter);
} }
if (shadowBefore.length) shadowBefore[0].style.opacity = Math.max(-progress, 0); if (shadowBefore.length) shadowBefore[0].style.opacity = Math.max(-progress, 0);