Jacek Pyziak
ed4ddfd8d8
- Created index.html for the Google Ads campaign landing page with structured sections including navigation, hero, benefits, channels, pricing, and contact information. - Implemented script.js for mobile menu toggle, scroll animations, budget calculator, and smooth scrolling for anchor links. - Developed style.css for styling the landing page, ensuring a modern and responsive layout with animations and hover effects.
69 lines
2.3 KiB
JavaScript
69 lines
2.3 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function () {
|
|
// Mobile menu toggle
|
|
const hamburger = document.querySelector('.nav__hamburger');
|
|
const navLinks = document.querySelector('.nav__links');
|
|
|
|
hamburger.addEventListener('click', function () {
|
|
navLinks.classList.toggle('active');
|
|
hamburger.classList.toggle('open');
|
|
});
|
|
|
|
// Close mobile menu on link click
|
|
navLinks.querySelectorAll('a').forEach(function (link) {
|
|
link.addEventListener('click', function () {
|
|
navLinks.classList.remove('active');
|
|
hamburger.classList.remove('open');
|
|
});
|
|
});
|
|
|
|
// Scroll animations
|
|
const faders = document.querySelectorAll('.fade-in');
|
|
const observer = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (entry) {
|
|
if (entry.isIntersecting) {
|
|
entry.target.classList.add('visible');
|
|
observer.unobserve(entry.target);
|
|
}
|
|
});
|
|
}, { threshold: 0.15 });
|
|
|
|
faders.forEach(function (el) {
|
|
observer.observe(el);
|
|
});
|
|
|
|
// Budget calculator
|
|
var slider = document.getElementById('budgetSlider');
|
|
if (slider) {
|
|
var MIN_FEE = 800;
|
|
|
|
function formatPLN(val) {
|
|
return val.toLocaleString('pl-PL') + ' zł';
|
|
}
|
|
|
|
function updateCalc() {
|
|
var budget = parseInt(slider.value);
|
|
var fee = Math.max(budget * 0.1, MIN_FEE);
|
|
var total = budget + fee;
|
|
|
|
document.getElementById('budgetValue').textContent = formatPLN(budget);
|
|
document.getElementById('calcBudget').textContent = formatPLN(budget);
|
|
document.getElementById('calcFee').textContent = formatPLN(fee);
|
|
document.getElementById('calcTotal').textContent = formatPLN(total);
|
|
}
|
|
|
|
slider.addEventListener('input', updateCalc);
|
|
updateCalc();
|
|
}
|
|
|
|
// Smooth scroll for anchor links
|
|
document.querySelectorAll('a[href^="#"]').forEach(function (anchor) {
|
|
anchor.addEventListener('click', function (e) {
|
|
var target = document.querySelector(this.getAttribute('href'));
|
|
if (target) {
|
|
e.preventDefault();
|
|
target.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
|
}
|
|
});
|
|
});
|
|
});
|