Assignment-123/swiper.html

180 lines
9.1 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Digital Marketing Company</title>
<link rel="stylesheet" href="css/swiper.css" />
<link rel="stylesheet" href="css/styles.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css" />
<!-- Swiper JS -->
</head>
<body>
<header>
<div class="container">
<div class="logo">Digital Agency</div>
<nav>
<div class="hamburger" onclick="toggleMenu()">
<div></div>
<div></div>
<div></div>
</div>
<div class="nav-links">
<a href="index.html">Home</a>
<a href="#services">Services</a>
<a href="#pricing">Pricing</a>
<a href="#team">Team</a>
<a href="contact.html">Contact</a>
<a href="swiper.html">Slider</a>
</div>
</nav>
</div>
</header>
<!-- Swiper Start -->
<div class="swipecontainer">
<div class="heading">
<p>Our Featured Services</p>
</div>
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="assets/affiliate.webp" alt="">
<div class="caption">
<h1>Affiliate Marketing</h1>
</div>
</div>
<div class="swiper-slide">
<img src="assets/analytics.jpg" alt="">
<div class="caption">
<h1>Analytics and Reporting</h1>
</div>
</div>
<div class="swiper-slide">
<img src="assets/content.png" alt="">
<div class="caption">
<h1>Content Marketing</h1>
</div>
</div>
<div class="swiper-slide">
<img src="assets/email.png" alt="">
<div class="caption">
<h1>Email Marketing</h1>
</div>
</div>
<div class="swiper-slide">
<img src="assets/influencer.png" alt="">
<div class="caption">
<h1>Influencer Marketing</h1>
</div>
</div>
<div class="swiper-slide">
<img src="assets/payperclick.webp" alt="">
<div class="caption">
<h1>Pay-Per-Click Advertising (PPC)</h1>
</div>
</div>
<div class="swiper-slide">
<img src="assets/social-media.jpg" alt="">
<div class="caption">
<h1>Social Media Marketing</h1>
</div>
</div>
<div class="swiper-slide">
<img src="assets/web.jpeg" alt="">
<div class="caption">
<h1>Web Design and Development</h1>
</div>
</div>
</div>
</div>
</div>
<!-- featured project slider -->
<div class="project-section-title">
<h2> <span>Featured </span> Projects</h2>
<p>Learn how we are delivering cutting-edge solutions and transforming businesses. </p>
</div>
<div class="featured-projects-container">
<!-- Content Slider -->
<div class="content-slider">
<div class="slick-content">
<div class="slide">
<h2>Evil Genius Games</h2>
<p>Evil Genius Games invites players to dive into captivating tabletop RPG experiences, seamlessly
blending strategic depth with immersive gameplay. Our team led the development of their digital
platform, ensuring intuitive interfaces and dynamic mechanics. Our collaboration has solidified
Evil Genius Games as an industry leader in immersive gaming experiences.</p>
</div>
<div class="slide">
<h2>EarthLink Fiber Internet</h2>
<p>Earthlink epitomizes leadership in digital innovation, seamlessly blending advanced technology
with unbeatable connectivity. Our team led the development and design efforts for their digital
infrastructure, ensuring seamless integration and optimal performance. Through meticulous
planning, implementation, and ongoing support, we helped Earthlink maintain its position as a
frontrunner in the digital connectivity landscape.</p>
</div>
<div class="slide">
<h2>Involvely Parenting Resource</h2>
<p> Involvvely functions as a comprehensive Parent Resource and school platform,
fosteringconnections among community parents. Our team played a pivotal role in developing and
designing their platform, ensuring seamless integration and user-friendly interfaces. Our
technical contributions streamlined Involvvely's platform, allowing parents to get more involved
in their children's education using their innovative ideas.</p>
</div>
<div class="slide">
<h2>Data-Driven Insights</h2>
<p>We go beyond simply building software. We leverage data-driven insights and analytics to
continuously monitor and optimize your solutions, maximizing performance and user experience.
This ongoing cycle of measurement, analysis, and improvement ensures your software not only
meets your initial needs but also adapts and evolves alongside your business objectives.</p>
</div>
<div class="slide">
<h2>Collaborative Innovative Solutions</h2>
<p>
We cultivate an environment of co-creation and open communication to design the perfect solution
tailored to your unique needs and goals. This collaborative approach ensures the delivery of
solutions that are not only technically sound but also meet the needs of the business and its
customers.
</p>
</div>
<div class="slide">
<h2>Future Proof Technology Stack
</h2>
<p>
We remain at the forefront of technological advancements, continuously investing in and
integrating the latest tools, frameworks, and methodologies into our development process. This
commitment ensures that your solutions are built on a future-proof foundation, adaptable to the
ever-evolving digital landscape.</p>
</div>
</div>
</div>
<!-- Image Slider -->
<div class="image-slider">
<div class="slick-images">
<div><img src="assets/features/evil.webp" alt="" /></div>
<div><img src="assets/features/elink.webp" alt="" /></div>
<div><img src="assets/features/involv.webp" alt="" /></div>
<div><img src="assets/features/collaborate.webp" alt="" /></div>
<div><img src="assets/features/dataDrivenInsights.webp" alt="" /></div>
<div><img src="assets/features/futureProofTech.webp" alt="" /></div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script src="https://kit.fontawesome.com/d06d270777.js" crossorigin="anonymous"></script>
<script src="js/swiper.js"></script>
</body>
</html>