Vantive/Rotafilio_Vantive
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
David Martinez
2025-09-23 13:29:12 -06:00
parent b234ae0d22
commit 0fdda4320f
8 changed files with 253 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
contenido/11.html
+83 -2
View File
@@ -14,6 +14,15 @@
.bg-custom {
box-shadow: 0 0 10px rgba(0, 0, 0, .5);
}
.content-cards {
width: 100%;
}
.content-cards .persoSwiper {
width: 326px;
height: 326px;
}
</style>
<div class='page-sco py-2 py-md-0 h-100'>
<div class='container h-100'>
@@ -25,7 +34,7 @@
<hr class="border border-3 border-verde-oscuro hr-style mx-auto my-0">
</div>
<div class="col-12 px-0 mb-1 animate__animated animate__lightSpeedInLeft">
<div class="card bg-white border-0 my-2 rounded-0 bg-custom p-3 text-center">
<div class="card bg-white border-0 my-2 rounded-0 bg-custom px-3 py-2 text-center">
<div class="d-flex justify-content-center align-items-center flex-row gap-2">
<img src="img/3.1.png" class="img-fluid mx-3">
<div class="parrafos text-start">
@@ -41,7 +50,33 @@
<div class="col-12">
<div class="row justify-content-center">
<div class="col-12 mb-2">
<div class="d-flex justify-content-center align-items-center gap-2 flex-row"></div>
<div class="d-flex justify-content-center align-items-center gap-2 flex-row indicadores-avance"></div>
</div>
<div class="col-12">
<div class="position-relative content-cards text-center">
<div class="swiper persoSwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="img/11.0.png" class="img-fluid">
</div>
<div class="swiper-slide">
<img src="img/11.1.png" class="img-fluid">
</div>
<div class="swiper-slide">
<img src="img/11.2.png" class="img-fluid">
</div>
<div class="swiper-slide">
<img src="img/11.3.png" class="img-fluid">
</div>
<div class="swiper-slide">
<img src="img/11.4.png" class="img-fluid">
</div>
<div class="swiper-slide">
<img src="img/11.5.png" class="img-fluid">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@@ -54,5 +89,51 @@
$(function () {
"use strict";
$('.wrap-course-content').addClass('fake');
const feedbackcorrect = CourseNav.createSound('audio/feedback-correct.mpeg');
const feedbackincorrect = CourseNav.createSound('audio/feedback-incorrect.mpeg');
const respuestasCorrectas = ['true','true','false','false','false'];
function shuffleArray(array) {
for (let i = array.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[array[i], array[j]] = [array[j], array[i]];
}
return array;
}
// Shuffle slides and answers
const slides = Array.from(document.querySelectorAll('.swiper-slide'));
const slidesData = slides.map((slide, index) => ({
element: slide,
answer: respuestasCorrectas[index]
}));
const shuffledData = shuffleArray(slidesData);
const wrapper = document.querySelector('.swiper-wrapper');
wrapper.innerHTML = '';
const shuffledAnswers = [];
shuffledData.forEach((item, index) => {
wrapper.appendChild(item.element);
shuffledAnswers[index] = item.answer;
});
const swiper = new Swiper('.persoSwiper', {
effect: 'cards',
grabCursor: true,
centeredSlides: true,
slidesPerView: 'auto',
initialSlide: 0,
cardsEffect: {
slideShadows: false,
perSlideOffset: 10,
perSlideRotate: 2,
},
on: {
slideChange: function () {
}
}
});
});
</script>