Skip to content

Commit

Permalink
Merge branch 'master' of https://github.com/nolimits4web/Swiper
Browse files Browse the repository at this point in the history
nolimits4web committed Feb 22, 2019
2 parents a02e0dc + 3e0fc2d commit 353a910
Showing 2 changed files with 39 additions and 6 deletions.
15 changes: 15 additions & 0 deletions demos/410-virtual-slides.html
Original file line number Diff line number Diff line change
@@ -69,15 +69,19 @@
<div class="swiper-button-prev"></div>
</div>
<p class="append-buttons">
<a href="#" class="prepend-2-slides">Prepend 2 Slides</a>
<a href="#" class="slide-1">Slide 1</a>
<a href="#" class="slide-250">Slide 250</a>
<a href="#" class="slide-500">Slide 500</a>
<a href="#" class="append-slide">Append Slide</a>
</p>
<!-- Swiper JS -->
<script src="../dist/js/swiper.min.js"></script>

<!-- Initialize Swiper -->
<script>
var appendNumber = 1;
var prependNumber = 1;
var swiper = new Swiper('.swiper-container', {
slidesPerView: 3,
centeredSlides: true,
@@ -112,6 +116,17 @@
e.preventDefault();
swiper.slideTo(499, 0);
});
document.querySelector('.prepend-2-slides').addEventListener('click', function (e) {
e.preventDefault();
swiper.virtual.prependSlide([
'<div class="swiper-slide">Slide ' + (--prependNumber) + '</div>',
'<div class="swiper-slide">Slide ' + (--prependNumber) + '</div>'
]);
});
document.querySelector('.append-slide').addEventListener('click', function (e) {
e.preventDefault();
swiper.virtual.appendSlide('<div class="swiper-slide">Slide ' + (++appendNumber) + '</div>');
});
</script>
</body>
</html>
30 changes: 24 additions & 6 deletions src/components/virtual/virtual.js
Original file line number Diff line number Diff line change
@@ -116,24 +116,42 @@ const Virtual = {
if (params.cache) swiper.virtual.cache[index] = $slideEl;
return $slideEl;
},
appendSlide(slide) {
appendSlide(slides) {
const swiper = this;
swiper.virtual.slides.push(slide);
if (typeof slides === 'object' && 'length' in slides) {
for (let i = 0; i < slides.length; i += 1) {
if (slides[i]) swiper.virtual.slides.push(slides[i]);
}
} else {
swiper.virtual.slides.push(slides);
}
swiper.virtual.update(true);
},
prependSlide(slide) {
prependSlide(slides) {
const swiper = this;
swiper.virtual.slides.unshift(slide);
const activeIndex = swiper.activeIndex;
let newActiveIndex = activeIndex + 1;
let numberOfNewSlides = 1;

if (typeof slides === 'object' && 'length' in slides) {
for (let i = 0; i < slides.length; i += 1) {
if (slides[i]) swiper.virtual.slides.unshift(slides[i]);
}
newActiveIndex = activeIndex + slides.length;
numberOfNewSlides = slides.length;
} else {
swiper.virtual.slides.unshift(slides);
}
if (swiper.params.virtual.cache) {
const cache = swiper.virtual.cache;
const newCache = {};
Object.keys(cache).forEach((cachedIndex) => {
newCache[cachedIndex + 1] = cache[cachedIndex];
newCache[cachedIndex + numberOfNewSlides] = cache[cachedIndex];
});
swiper.virtual.cache = newCache;
}
swiper.virtual.update(true);
swiper.slideNext(0);
swiper.slideTo(newActiveIndex, 0);
},
};

0 comments on commit 353a910

Please sign in to comment.