Cloud & DevOps
diff --git a/main.css b/main.css
index c5ebade..8b1d44e 100644
--- a/main.css
+++ b/main.css
@@ -1298,7 +1298,7 @@
.course-category-title {
font-size: 22px;
font-weight: bold;
- margin-bottom: 15px;
+ padding-left: 14px;
}
.course-slider {
@@ -1933,10 +1933,6 @@
margin-left: 15px;
}
- .slide1r-container {
- padding: 20px;
- }
-
.slide1-box {
flex-direction: column;
gap: 15px;
@@ -2060,7 +2056,15 @@
}
.cards_box {
- margin-top: 28px;
+ margin-top: 20px;
+ }
+
+ .slide1 {
+ min-height: 50%;
+ }
+
+ .image-container1 {
+ display: none !important;
}
.buttons {
@@ -2197,6 +2201,11 @@
.mobile-hamburger {
display: none;
}
+
+ .hero_container {
+ padding-top: 0px;
+ margin-top: 0px;
+ }
}
@keyframes fadeInUp {
diff --git a/main.js b/main.js
index d35db19..c09a7a0 100644
--- a/main.js
+++ b/main.js
@@ -11,193 +11,156 @@ function getInTouch() {
window.open("https://wa.me/+919787466226?text=Hi%20KodePilot%20Team%2C%0A%0AI%20came%20across%20your%20website%20and%20would%20like%20to%20know%20more%20about%20your%20Career%20Guidance%20and%20Placement%20support%20services.%20Could%20you%20please%20share%20the%20details%3F%0A%0AThanks%21", "_blank");
}
-(function () {
- if (window.Slide1rSliderLoaded) {
- return;
+class Slide1rSlider {
+ constructor({ trackId = 'slide1rTrack', prevId = 'prevBtn', nextId = 'nextBtn', autoPlayDuration = 5000, invert = true } = {}) {
+ this.trackId = trackId;
+ this.prevId = prevId;
+ this.nextId = nextId;
+ this.autoPlayDuration = autoPlayDuration;
+ this.invert = invert;
+ if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', () => this.initSlider());
+ else this.initSlider();
}
- window.Slide1rSliderLoaded = true;
- class Slide1rSlider {
- constructor() {
- setTimeout(() => {
- this.initSlider();
- }, 100);
- }
+ initSlider() {
+ this.track = document.getElementById(this.trackId);
+ if (!this.track) return console.warn('slide track not found:', this.trackId);
- initSlider() {
- try {
- this.track = document.getElementById('slide1rTrack');
- this.slides = document.querySelectorAll('.slide1');
- this.prevBtn = document.getElementById('prevBtn');
- this.nextBtn = document.getElementById('nextBtn');
+ this.originalSlides = Array.from(this.track.querySelectorAll('.slide1'));
+ if (this.originalSlides.length === 0) return console.warn('no .slide1 found');
- if (!this.track || this.slides.length === 0) {
- console.warn("Slider DOM elements not found. Retrying...");
- setTimeout(() => this.initSlider(), 200);
- return;
- }
+ this.prevBtn = document.getElementById(this.prevId);
+ this.nextBtn = document.getElementById(this.nextId);
- this.currentIndex = 0;
- this.totalSlides = this.slides.length;
- this.autoPlayDuration = 5000;
+ this.setupStructure();
+ this.bindEvents();
- this.init();
- } catch (err) {
- console.error("Slider initialization failed:", err);
+ this.currentIndex = 1;
+ this.updateSlider(false);
+ this.startAutoPlay();
+ }
+
+ setupStructure() {
+ this.track.style.display = 'flex';
+ this.track.style.transition = 'transform 0.5s ease';
+ this.track.querySelectorAll('.slide1').forEach(s => {
+ s.style.minWidth = '100%';
+ s.style.boxSizing = 'border-box';
+ });
+
+ const first = this.originalSlides[0].cloneNode(true);
+ const last = this.originalSlides[this.originalSlides.length - 1].cloneNode(true);
+
+ this.track.insertBefore(last, this.track.firstChild);
+ this.track.appendChild(first);
+
+ this.slides = Array.from(this.track.querySelectorAll('.slide1'));
+ this.totalSlides = this.slides.length;
+ }
+
+ updateSlider(animate = true) {
+ this.track.style.transition = animate ? 'transform 0.5s ease' : 'none';
+ this.track.style.transform = `translateX(-${this.currentIndex * 100}%)`;
+ }
+
+ nextSlide() {
+ if (this.invert) {
+ this.currentIndex--;
+ this.updateSlider(true);
+ if (this.currentIndex === 0) {
+ setTimeout(() => {
+ this.track.style.transition = 'none';
+ this.currentIndex = this.slides.length - 2;
+ this.updateSlider(false);
+ }, 500);
+ }
+ } else {
+ this.currentIndex++;
+ this.updateSlider(true);
+ if (this.currentIndex === this.slides.length - 1) {
+ setTimeout(() => {
+ this.track.style.transition = 'none';
+ this.currentIndex = 1;
+ this.updateSlider(false);
+ }, 500);
}
}
+ this.restartAutoPlay();
+ }
- init() {
- try {
- this.updateSlider();
- this.bindEvents();
- this.startAutoPlay();
- this.bindKeyboardEvents();
- } catch (err) {
- console.error("Slider init error:", err);
+ prevSlide() {
+ if (this.invert) {
+ this.currentIndex++;
+ this.updateSlider(true);
+ if (this.currentIndex === this.slides.length - 1) {
+ setTimeout(() => {
+ this.track.style.transition = 'none';
+ this.currentIndex = 1;
+ this.updateSlider(false);
+ }, 500);
+ }
+ } else {
+ this.currentIndex--;
+ this.updateSlider(true);
+ if (this.currentIndex === 0) {
+ setTimeout(() => {
+ this.track.style.transition = 'none';
+ this.currentIndex = this.slides.length - 2;
+ this.updateSlider(false);
+ }, 500);
}
}
+ this.restartAutoPlay();
+ }
+ startAutoPlay() {
+ this.stopAutoPlay();
+ this.autoPlayInterval = setInterval(() => this.nextSlide(), this.autoPlayDuration);
+ }
- updateSlider() {
- try {
- const translateX = -this.currentIndex * 100;
- this.track.style.transform = `translateX(${translateX}%)`;
+ stopAutoPlay() {
+ if (this.autoPlayInterval) {
+ clearInterval(this.autoPlayInterval);
+ this.autoPlayInterval = null;
+ }
+ }
- } catch (err) {
- console.error("Error updating slider:", err);
- }
+ restartAutoPlay() {
+ this.stopAutoPlay();
+ this.startAutoPlay();
+ }
+
+ bindEvents() {
+ if (this.nextBtn) this.nextBtn.addEventListener('click', () => this.nextSlide());
+ if (this.prevBtn) this.prevBtn.addEventListener('click', () => this.prevSlide());
+
+ const container = this.track.closest('.slide1r-container') || this.track.parentElement;
+ if (container) {
+ container.addEventListener('mouseenter', () => this.stopAutoPlay());
+ container.addEventListener('mouseleave', () => this.startAutoPlay());
}
- nextSlide() {
- try {
- this.currentIndex = (this.currentIndex + 1) % this.totalSlides;
- this.updateSlider();
- this.restartAutoPlay();
- } catch (err) {
- console.error("Error going to next slide:", err);
+ let startX = 0, endX = 0;
+ this.track.addEventListener('touchstart', (e) => { startX = e.touches[0].clientX; this.stopAutoPlay(); });
+ this.track.addEventListener('touchmove', (e) => { endX = e.touches[0].clientX; });
+ this.track.addEventListener('touchend', () => {
+ const delta = startX - endX;
+ if (Math.abs(delta) > 50) {
+ if (delta > 0) this.nextSlide(); else this.prevSlide();
}
- }
-
- prevSlide() {
- try {
- this.currentIndex = this.currentIndex === 0 ? this.totalSlides - 1 : this.currentIndex - 1;
- this.updateSlider();
- this.restartAutoPlay();
- } catch (err) {
- console.error("Error going to previous slide:", err);
- }
- }
-
- goToSlide(index) {
- try {
- this.currentIndex = index;
- this.updateSlider();
- this.restartAutoPlay();
- } catch (err) {
- console.error("Error going to slide:", err);
- }
- }
-
- startAutoPlay() {
- try {
- this.stopAutoPlay();
-
- this.autoPlayInterval = setInterval(() => {
- this.nextSlide();
- }, this.autoPlayDuration);
-
- } catch (err) {
- console.error("Error starting autoplay:", err);
- }
- }
-
- stopAutoPlay() {
- if (this.autoPlayInterval) {
- clearInterval(this.autoPlayInterval);
- this.autoPlayInterval = null;
- }
- }
-
- restartAutoPlay() {
- this.stopAutoPlay();
this.startAutoPlay();
- }
+ });
- bindEvents() {
- try {
- if (this.nextBtn) {
- this.nextBtn.addEventListener('click', () => this.nextSlide());
- }
-
- if (this.prevBtn) {
- this.prevBtn.addEventListener('click', () => this.prevSlide());
- }
-
- const container = document.querySelector('.slide1r-container');
- if (container) {
- container.addEventListener('mouseenter', () => this.stopAutoPlay());
- container.addEventListener('mouseleave', () => this.startAutoPlay());
- }
-
- let startX = 0;
- let endX = 0;
-
- if (this.track) {
- this.track.addEventListener('touchstart', (e) => {
- startX = e.touches[0].clientX;
- this.stopAutoPlay();
- });
-
- this.track.addEventListener('touchmove', (e) => {
- endX = e.touches[0].clientX;
- });
-
- this.track.addEventListener('touchend', () => {
- const deltaX = startX - endX;
- if (Math.abs(deltaX) > 50) {
- if (deltaX > 0) {
- this.nextSlide();
- } else {
- this.prevSlide();
- }
- }
- this.startAutoPlay();
- });
- }
- } catch (err) {
- console.error("Error binding events:", err);
- }
- }
-
- bindKeyboardEvents() {
- const keyHandler = (e) => {
- const container = document.querySelector('.slide1r-container');
- if (container && this.isElementInViewport(container)) {
- if (e.key === 'ArrowLeft') {
- this.prevSlide();
- } else if (e.key === 'ArrowRight') {
- this.nextSlide();
- }
- }
- };
-
- document.addEventListener('keydown', keyHandler);
- }
-
- isElementInViewport(el) {
- const rect = el.getBoundingClientRect();
- return (
- rect.top >= 0 &&
- rect.left >= 0 &&
- rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
- rect.right <= (window.innerWidth || document.documentElement.clientWidth)
- );
- }
+ document.addEventListener('keydown', (e) => {
+ const containerEl = document.querySelector('.slide1r-container');
+ if (!containerEl) return;
+ if (e.key === 'ArrowLeft') this.prevSlide();
+ if (e.key === 'ArrowRight') this.nextSlide();
+ });
}
+}
- new Slide1rSlider();
-})();
+new Slide1rSlider({ invert: true, autoPlayDuration: 4000 });
const statItems = document.querySelectorAll('.stat-item');
+
+ 
+ 
+ 