From 801998155b7c9e15db254cc23a4824f63dfa4ca1 Mon Sep 17 00:00:00 2001 From: Gary Date: Tue, 13 May 2025 11:55:58 +0100 Subject: [PATCH] added photo reel --- css/style.css | 19 ++++++ includes/footer.php | 139 ++++++++++++++++++++++-------------------- includes/header.php | 43 ++++++------- js/script.js | 49 +++++++++++++++ sections/about-us.php | 94 ++++++++++++++-------------- sections/counter.php | 42 ++++++++++--- 6 files changed, 246 insertions(+), 140 deletions(-) create mode 100644 js/script.js diff --git a/css/style.css b/css/style.css index 6fd8b94..3cce3fd 100644 --- a/css/style.css +++ b/css/style.css @@ -9759,3 +9759,22 @@ textarea.form-control { .acorn a:hover { color: var(--blue); } + + + +.carousel-container { + overflow: hidden; +} +.image-row { + display: flex; + transition: transform 0.5s ease-in-out; /* Adjust duration and easing to match slideDuration */ +} +.col-md-3 { + flex: 0 0 auto; + width: 25%; /* Adjust based on numberOfVisible */ +} +.image-item { + width: 100%; + height: auto; + display: block; +} diff --git a/includes/footer.php b/includes/footer.php index 3899769..73cf1ba 100644 --- a/includes/footer.php +++ b/includes/footer.php @@ -1,30 +1,30 @@ - - - - -
+ +
+
+

Copyright © All rights reserved - Hosted & Managed by Acorn Media

+
+
+ + - - - - - - - - - - - - - - - - - - + + +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/includes/header.php b/includes/header.php index b9c0f97..551ff6b 100644 --- a/includes/header.php +++ b/includes/header.php @@ -1,23 +1,24 @@ - - - - - - - - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/js/script.js b/js/script.js new file mode 100644 index 0000000..b8546e9 --- /dev/null +++ b/js/script.js @@ -0,0 +1,49 @@ +const carouselContainer = document.querySelector('.carousel-container'); +const imageRow = document.querySelector('.image-row'); +let imageItems = imageRow.querySelectorAll('.col-md-3'); +const numberOfVisible = 4; // Number of images to show at a time +let scrollPosition = 0; +let imageWidth; +const slideDuration = 1000; // Time in milliseconds for one slide (adjust as needed) +const slideInterval = 5000; // Time in milliseconds between slides (adjust as needed) +let isAnimating = false; + +function updateCarousel() { + if (imageItems.length > 0) { + imageWidth = imageItems[0].offsetWidth; + } +} + +function slideCarousel() { + if (!isAnimating && imageWidth) { + isAnimating = true; + scrollPosition += imageWidth; + imageRow.style.transform = `translateX(-${scrollPosition}px)`; + + setTimeout(() => { + const firstItem = imageRow.firstElementChild; + imageRow.appendChild(firstItem); + imageRow.style.transition = 'none'; // Temporarily disable transition for the reset + imageRow.style.transform = `translateX(0px)`; + scrollPosition = 0; + // Force reflow to apply the style change immediately + imageRow.offsetHeight; + imageRow.style.transition = ''; // Re-enable the transition + imageItems = imageRow.querySelectorAll('.col-md-3'); + isAnimating = false; + }, slideDuration); + } +} + +function startSlidingCarousel() { + setInterval(slideCarousel, slideInterval); +} + +function initializeCarousel() { + updateCarousel(); + startSlidingCarousel(); + + window.addEventListener('resize', updateCarousel); +} + +initializeCarousel(); \ No newline at end of file diff --git a/sections/about-us.php b/sections/about-us.php index 9768007..b377060 100644 --- a/sections/about-us.php +++ b/sections/about-us.php @@ -1,51 +1,51 @@
-
-
-
-
-
-

Established in 2003

-

For over two decades, since 2003, we've been keen on providing exceptional roofing services. Our journey in the trade has equipped us with a wealth of knowledge and skill that allows us to deliver results that stand alongside the very best. We value the trust our domestic and commercial clients place in us, and we strive to go the extra mile on every job. Our process kicks off with a detailed survey, where we take the time to explain everything clearly and provide photographic evidence for your peace of mind. You'll also receive a comprehensive written estimate, ensuring complete transparency. We're confident in our work and are happy to provide references.

-
-
-
-
- -
-
-

Our mission is simple: to provide top-quality roofing solutions, delivered with expertise, reliability, and a commitment to customer satisfaction. We aim to ensure every project, big or small, is completed to the highest standard, using quality materials and skilled workmanship. We're here to protect your property and provide you with a roof you can rely on, come rain or shine.

-
-
-

Our vision is to be a leading roofing contractor, recognised for our exceptional standards, our trustworthy reputation, and our dedication to innovation within the trade. We aspire to continuously improve our services, embrace new technologies, and build lasting relationships with our clients and the wider community. We see ourselves as the go-to experts for all roofing needs.

-
-
-

At the heart of our business are a few core values that guide everything we do:

-
    -
  • Quality Craftsmanship
    • -
  • Reliability and Trust
    • -
  • Customer Focus
    • -
  • Safety First
    • -
  • Integrity
    • -
-
+
+
+
+
+
+

Established in 2003

+

For over two decades, since 2003, we've been keen on providing exceptional roofing services. Our journey in the trade has equipped us with a wealth of knowledge and skill that allows us to deliver results that stand alongside the very best. We value the trust our domestic and commercial clients place in us, and we strive to go the extra mile on every job. Our process kicks off with a detailed survey, where we take the time to explain everything clearly and provide photographic evidence for your peace of mind. You'll also receive a comprehensive written estimate, ensuring complete transparency. We're confident in our work and are happy to provide references.

+
+
+
+
+ +
+
+

Our mission is simple: to provide top-quality roofing solutions, delivered with expertise, reliability, and a commitment to customer satisfaction. We aim to ensure every project, big or small, is completed to the highest standard, using quality materials and skilled workmanship. We're here to protect your property and provide you with a roof you can rely on, come rain or shine.

+
+
+

Our vision is to be a leading roofing contractor, recognised for our exceptional standards, our trustworthy reputation, and our dedication to innovation within the trade. We aspire to continuously improve our services, embrace new technologies, and build lasting relationships with our clients and the wider community. We see ourselves as the go-to experts for all roofing needs.

+
+
+

At the heart of our business are a few core values that guide everything we do:

+
    +
  • Quality Craftsmanship
    • +
  • Reliability and Trust
    • +
  • Customer Focus
    • +
  • Safety First
    • +
  • Integrity
    • +
-
- About Us Image -
-
- -
-
-
\ No newline at end of file + + + \ No newline at end of file diff --git a/sections/counter.php b/sections/counter.php index 851adb6..d9d36e2 100644 --- a/sections/counter.php +++ b/sections/counter.php @@ -42,13 +42,41 @@ --> -
-
-
-
-

2,500+ Roofs Restored Since 2003

-

From emergency repairs to full re-roofs, we’ve helped hundreds of families stay safe and dry.

+ + +
+
+
+
+
+
+
+ Image 1 +
+
+ Image 2 +
+
+ Image 3 +
+
+ Image 4 +
+
+ Image 5 +
-
+
+
+
\ No newline at end of file