From 274c5c30f28a1fdb3d2ab4ded384463a966a63f0 Mon Sep 17 00:00:00 2001 From: ectasy663 Date: Wed, 4 Jun 2025 22:20:54 +0530 Subject: [PATCH] Update corporate training workflow and animation improvements - Replace 'Innovate with us' with 'Assessment of current skillset' in corporate training workflow - Adjust tech cards animation speed (5s to 8s duration) - Reduce testimonials section spacing and container height - Add hover pause functionality for tech and testimonial marquees - Various layout and animation optimizations --- Education/corporate-trainings.html | 22 ++--- Education/individual-trainings.html | 19 ++-- Education/workshops.html | 21 ++--- Industries/case-studies.html | 5 +- Industries/marketing.html | 5 +- Industries/media-entertainment.html | 5 +- Industries/retail.html | 5 +- Industries/travel.html | 5 +- contact.html | 5 +- css/components.css | 130 +++++++++++++++++----------- css/core.css | 95 +++++++++++++++----- css/pages.css | 36 ++++---- css/responsive.css | 49 +++++++---- index.html | 29 ++++--- js/main.js | 4 +- js/tech-marquee.js | 75 ++++++++-------- js/testimonials-marquee.js | 58 +++++++++++++ 17 files changed, 350 insertions(+), 218 deletions(-) create mode 100644 js/testimonials-marquee.js diff --git a/Education/corporate-trainings.html b/Education/corporate-trainings.html index 2c25389..bbc131f 100644 --- a/Education/corporate-trainings.html +++ b/Education/corporate-trainings.html @@ -23,9 +23,8 @@

Free AI Webinars

Supercharge your AI journey with expert-led live sessions and our rich library of past webinars — all designed to transform your skills from basics to mastery.

- Chat With AI Experts
+ + Get Free AI Consultation +
@@ -96,8 +97,7 @@ Dive deep into the world of Generative AI, exploring cutting-edge models like GPT, DALL-E, and their real-world applications. Learn how to implement these technologies in your business workflows.

-

Key Takeaways:

-
    +

    Key Takeaways:

    • Understanding Transformer architecture and attention mechanisms
    • Hands-on experience with OpenAI API integration
    • Best practices for prompt engineering and optimization
      • @@ -106,7 +106,6 @@
Register Now - Add to Calendar
@@ -127,8 +126,7 @@ Transform your business data into actionable insights using machine learning algorithms. This session covers practical applications of ML in business decision-making and strategic planning.

-

Key Takeaways:

-
    +

    Key Takeaways:

    • Predictive analytics for sales forecasting and customer behavior
    • Implementing recommendation systems for personalization
    • ROI measurement and KPI tracking for ML initiatives
      • @@ -137,7 +135,6 @@
Register Now - Add to Calendar
@@ -158,8 +155,7 @@ Discover how AI-powered automation can revolutionize your business operations. Learn to identify automation opportunities and implement intelligent workflows that save time and reduce costs.

-

Key Takeaways:

-
    +

    Key Takeaways:

    • Process mapping and automation opportunity identification
    • RPA vs. Intelligent automation: choosing the right approach
    • Integration strategies with existing business systems
      • @@ -168,7 +164,6 @@
Register Now - Add to Calendar
diff --git a/Industries/case-studies.html b/Industries/case-studies.html index 077ea89..1e3ac99 100644 --- a/Industries/case-studies.html +++ b/Industries/case-studies.html @@ -24,9 +24,8 @@ - - -

OUR EXPERTISE

-
-
- Innovation First Icon +
+
+ Innovation First Icon +

Innovation First

We prioritize cutting-edge innovation, staying ahead of industry trends to deliver groundbreaking AI solutions.

- Technical Excellence Icon +
+ Technical Excellence Icon +

Tech Mastery

Our team combines deep technical expertise with practical experience to build robust, scalable AI systems.

- Results Driven Icon +
+ Results Driven Icon +

Results Driven

We deliver measurable business impact through AI solutions that generate real value and maximize ROI.

- Ongoing Support Icon +
+ Ongoing Support Icon +

Ongoing Support

We provide continuous monitoring, updates, and optimization to ensure your AI systems perform at their best.

diff --git a/js/main.js b/js/main.js index 0d7f3a8..592e09c 100644 --- a/js/main.js +++ b/js/main.js @@ -73,8 +73,8 @@ function initScrollEffects() { // Animate elements when they enter viewport function initScrollAnimations() { - // Exclude hero content from scroll animations to prevent layout shifts - const animatedElements = document.querySelectorAll('.exp-item, .section-heading, .btn-primary:not(#hero .btn-primary)'); + // Exclude hero content and all purple buttons from scroll animations to prevent layout shifts + const animatedElements = document.querySelectorAll('.exp-item, .section-heading'); // Ensure hero content is always visible and stable const heroContent = document.querySelector('#hero .hero-content'); diff --git a/js/tech-marquee.js b/js/tech-marquee.js index 5de2d73..2d0d4a2 100644 --- a/js/tech-marquee.js +++ b/js/tech-marquee.js @@ -1,23 +1,45 @@ // Tech Cards Animation Enhancement document.addEventListener('DOMContentLoaded', function() { + console.log('Tech marquee script loaded'); + const techCardsContainer = document.querySelector('.tech-cards-container'); + const techCardsTrack = document.querySelector('.tech-cards-track'); const techCards = document.querySelectorAll('.tech-card'); - // No animation delay or dancing effects - techCards.forEach((card) => { - // Just add basic hover interaction - card.addEventListener('mouseenter', function() { - this.style.transform = 'translateY(-10px)'; - }); - - card.addEventListener('mouseleave', function() { - this.style.transform = ''; - }); - }); - // Add 3D tilt effect on mouse move for each tech card - techCards.forEach(card => { + console.log('Tech cards found:', techCards.length); + console.log('Tech track found:', techCardsTrack); + + // Add comprehensive hover functionality for individual tech cards + techCards.forEach((card, index) => { + console.log(`Setting up card ${index}`); const iconWrapper = card.querySelector('.tech-icon-wrapper'); + // Mouse enter - pause animation and lift card + card.addEventListener('mouseenter', function(e) { + console.log('Tech card hover detected'); + e.stopPropagation(); // Prevent event bubbling + this.style.transform = 'translateY(-10px)'; + if (techCardsTrack) { + techCardsTrack.classList.add('paused'); + console.log('Tech animation paused via CSS class'); + } + }); + // Mouse leave - resume animation and reset card + card.addEventListener('mouseleave', function(e) { + console.log('Tech card hover ended'); + e.stopPropagation(); // Prevent event bubbling + this.style.transform = ''; + if (techCardsTrack) { + techCardsTrack.classList.remove('paused'); + console.log('Tech animation resumed via CSS class'); + } + // Reset icon wrapper transform when leaving + if (iconWrapper) { + iconWrapper.style.transform = ''; + } + }); + + // Mouse move - 3D tilt effect (only if icon wrapper exists) if (iconWrapper) { card.addEventListener('mousemove', function(e) { const rect = iconWrapper.getBoundingClientRect(); @@ -32,38 +54,15 @@ document.addEventListener('DOMContentLoaded', function() { iconWrapper.style.transform = `perspective(500px) rotateX(${tiltY}deg) rotateY(${-tiltX}deg) scale3d(1.1, 1.1, 1.1)`; }); - - card.addEventListener('mouseleave', function() { - iconWrapper.style.transform = ''; - }); } }); - - // Add a parallax effect to create depth in the tech cards container - window.addEventListener('mousemove', function(e) { - if (techCardsContainer) { - const depth = 20; - const moveX = (e.clientX - window.innerWidth / 2) / depth; - const moveY = (e.clientY - window.innerHeight / 2) / depth; - - // Limit the movement for a subtler effect - const maxMove = 5; - const limitedMoveX = Math.max(-maxMove, Math.min(maxMove, moveX)); - const limitedMoveY = Math.max(-maxMove, Math.min(maxMove, moveY)); - - techCardsContainer.style.transform = `translate(${limitedMoveX}px, ${limitedMoveY}px)`; - } - }); - - // Add entrance animation for the tech cards container + // Add entrance animation for the tech cards container (opacity only) if (techCardsContainer) { techCardsContainer.style.opacity = '0'; - techCardsContainer.style.transform = 'translateY(20px)'; setTimeout(() => { - techCardsContainer.style.transition = 'opacity 0.8s ease-out, transform 0.8s ease-out'; + techCardsContainer.style.transition = 'opacity 0.8s ease-out'; techCardsContainer.style.opacity = '1'; - techCardsContainer.style.transform = 'translateY(0)'; }, 200); } }); diff --git a/js/testimonials-marquee.js b/js/testimonials-marquee.js new file mode 100644 index 0000000..ee994a1 --- /dev/null +++ b/js/testimonials-marquee.js @@ -0,0 +1,58 @@ +// Testimonials Animation Enhancement +document.addEventListener('DOMContentLoaded', function() { + console.log('Testimonials marquee script loaded'); + + const testimonialsContainer = document.querySelector('.testimonials-track-container'); + const testimonialsTrack = document.querySelector('.testimonials-track'); + const testimonialCards = document.querySelectorAll('.testimonial-card'); + + console.log('Testimonial cards found:', testimonialCards.length); + console.log('Testimonials track found:', testimonialsTrack); + + // Add hover pause functionality for individual testimonial cards + testimonialCards.forEach((card, index) => { + console.log(`Setting up testimonial card ${index}`); + // Pause animation when hovering over individual cards + card.addEventListener('mouseenter', function(e) { + console.log('Testimonial card hover detected'); + e.stopPropagation(); // Prevent event bubbling + if (testimonialsTrack) { + testimonialsTrack.classList.add('paused'); + console.log('Testimonials animation paused via CSS class'); + } + }); + + card.addEventListener('mouseleave', function(e) { + console.log('Testimonial card hover ended'); + e.stopPropagation(); // Prevent event bubbling + if (testimonialsTrack) { + testimonialsTrack.classList.remove('paused'); + console.log('Testimonials animation resumed via CSS class'); + } + }); + }); + // Also pause when hovering over the container + if (testimonialsContainer) { + testimonialsContainer.addEventListener('mouseenter', function() { + if (testimonialsTrack) { + testimonialsTrack.classList.add('paused'); + } + }); + + testimonialsContainer.addEventListener('mouseleave', function() { + if (testimonialsTrack) { + testimonialsTrack.classList.remove('paused'); + } + }); + } + + // Add entrance animation for the testimonials container (opacity only) + if (testimonialsContainer) { + testimonialsContainer.style.opacity = '0'; + + setTimeout(() => { + testimonialsContainer.style.transition = 'opacity 0.8s ease-out'; + testimonialsContainer.style.opacity = '1'; + }, 200); + } +});