Oliver/ODOO4projects.com
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update index.html

Browse Source
This commit is contained in:
oliver
2026-06-23 18:27:45 -03:00
parent 5755a5de4a
commit abb5eff2a9
1 changed files with 37 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+37 -18
View File
@@ -190,15 +190,32 @@
.hero-carousel { .hero-carousel {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
min-height: 400px;
} }
.hero-slide { .hero-slide {
position: relative; position: absolute;
inset: 0;
min-height: 400px; min-height: 400px;
display: flex; display: flex;
align-items: center; align-items: center;
background-size: cover; background-size: cover;
background-position: center; background-position: center;
transition: opacity 0.5s ease; transform: translateX(100%);
opacity: 0;
transition:
transform 0.5s ease,
opacity 0.5s ease;
z-index: 1;
}
.hero-slide.active {
transform: translateX(0);
opacity: 1;
z-index: 2;
}
.hero-slide.prev {
transform: translateX(-100%);
opacity: 0;
z-index: 1;
} }
.hero-slide::before { .hero-slide::before {
content: ""; content: "";
@@ -646,7 +663,7 @@
</div> </div>
<div <div
class="hero-slide" class="hero-slide active"
style="background-image: url(&quot;images/holland.webp&quot;)" style="background-image: url(&quot;images/holland.webp&quot;)"
data-idx="0" data-idx="0"
> >
@@ -672,7 +689,7 @@
</div> </div>
<div <div
class="hero-slide d-none" class="hero-slide"
style=" style="
background-image: url(&quot;images/brazil.webp&quot;); background-image: url(&quot;images/brazil.webp&quot;);
background-position: 50% 100%; background-position: 50% 100%;
@@ -681,7 +698,7 @@
> >
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-10"> <div class="col-lg-5">
<div class="hero-box"> <div class="hero-box">
<h2> <h2>
Startup challenge!<br />From Zero to ERP in Startup challenge!<br />From Zero to ERP in
@@ -708,7 +725,7 @@
</div> </div>
<div <div
class="hero-slide d-none" class="hero-slide"
style="background-image: url(&quot;images/india.webp&quot;)" style="background-image: url(&quot;images/india.webp&quot;)"
data-idx="2" data-idx="2"
> >
@@ -745,7 +762,7 @@
</div> </div>
<div <div
class="hero-slide d-none" class="hero-slide"
style=" style="
background-image: url(&quot;images/england.webp&quot;); background-image: url(&quot;images/england.webp&quot;);
background-position: 50% 15.6182%; background-position: 50% 15.6182%;
@@ -1375,15 +1392,17 @@
var si = 0, var si = 0,
slides = document.querySelectorAll(".hero-slide"), slides = document.querySelectorAll(".hero-slide"),
dots = document.querySelectorAll(".carousel-dot"), dots = document.querySelectorAll(".carousel-dot"),
t; t,
dir = 1;
function show(i) { function show(i, direction) {
for (var j = 0; j < slides.length; j++) { var current = slides[si];
if (j === i) { var next = slides[i];
slides[j].classList.remove("d-none"); current.classList.remove("active");
} else { current.classList.add("prev");
slides[j].classList.add("d-none"); next.classList.remove("prev");
} next.classList.add("active");
for (var j = 0; j < dots.length; j++) {
if (j === i) { if (j === i) {
dots[j].classList.add("active"); dots[j].classList.add("active");
} else { } else {
@@ -1393,15 +1412,15 @@
si = i; si = i;
} }
function nextSlide() { function nextSlide() {
show((si + 1) % slides.length); show((si + 1) % slides.length, 1);
resetTimer(); resetTimer();
} }
function prevSlide() { function prevSlide() {
show((si - 1 + slides.length) % slides.length); show((si - 1 + slides.length) % slides.length, -1);
resetTimer(); resetTimer();
} }
function goSlide(i) { function goSlide(i) {
show(i); show(i, i > si ? 1 : -1);
resetTimer(); resetTimer();
} }
function resetTimer() { function resetTimer() {