95 lines
3.3 KiB
JavaScript
95 lines
3.3 KiB
JavaScript
const pages = ['home','problem','why','features','how','roi','pricing','who','trust','roadmap','faq','signin','apply'];
|
|
|
|
function openPage(pageId) {
|
|
if (!pages.includes(pageId)) {
|
|
console.warn(`Attempted to navigate to a non-existent page: ${pageId}`);
|
|
return; // Do not proceed if the page is not in the allowed list
|
|
}
|
|
|
|
// Hide all pages
|
|
document.querySelectorAll('.page').forEach(p => {
|
|
p.classList.add('hidden');
|
|
});
|
|
|
|
// Show the active page
|
|
const activePage = document.getElementById('page-' + pageId);
|
|
if (activePage) {
|
|
activePage.classList.remove('hidden');
|
|
} else {
|
|
// If no specific page content, default to home
|
|
document.getElementById('page-home').classList.remove('hidden');
|
|
}
|
|
|
|
// Update active link styling
|
|
document.querySelectorAll('.navlink').forEach(link => {
|
|
if (link.dataset.page === pageId) {
|
|
link.classList.add('active');
|
|
} else {
|
|
link.classList.remove('active');
|
|
}
|
|
});
|
|
|
|
// Smooth scroll to top
|
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const navLinksContainer = document.getElementById('nav-links');
|
|
const mobileMenuContainer = document.getElementById('mobile-menu');
|
|
const menuButton = document.getElementById('menu-button');
|
|
|
|
// Generate navigation links
|
|
let navHTML = '';
|
|
pages.forEach(page => {
|
|
navHTML += `<a href="#${page}" class="navlink px-3 py-2 rounded-full hover:bg-gray-100" data-page="${page}">${page.charAt(0).toUpperCase() + page.slice(1)}</a>`;
|
|
});
|
|
navLinksContainer.innerHTML = navHTML;
|
|
mobileMenuContainer.innerHTML = navHTML.replace(/class="/g, 'class="block w-full text-left ');
|
|
|
|
// Handle navigation clicks
|
|
document.querySelectorAll('.navlink').forEach(link => {
|
|
link.addEventListener('click', (e) => {
|
|
e.preventDefault();
|
|
openPage(link.dataset.page);
|
|
});
|
|
});
|
|
|
|
// Toggle mobile menu
|
|
menuButton.addEventListener('click', () => {
|
|
mobileMenuContainer.classList.toggle('hidden');
|
|
});
|
|
|
|
// Open page based on hash or default to 'home'
|
|
const initialPage = window.location.hash.substring(1) || 'home';
|
|
openPage(initialPage);
|
|
|
|
// Tab functionality for 'Why FinMox' page
|
|
const whyTabs = document.querySelectorAll('.why-tab');
|
|
const whyContents = document.querySelectorAll('.why-content');
|
|
|
|
whyTabs.forEach(tab => {
|
|
tab.addEventListener('click', () => {
|
|
const tabId = tab.dataset.tab;
|
|
|
|
// Update tab styles
|
|
whyTabs.forEach(t => {
|
|
if (t.dataset.tab === tabId) {
|
|
t.classList.add('bg-black', 'text-white');
|
|
t.classList.remove('bg-gray-200', 'text-black');
|
|
} else {
|
|
t.classList.remove('bg-black', 'text-white');
|
|
t.classList.add('bg-gray-200', 'text-black');
|
|
}
|
|
});
|
|
|
|
// Show/hide content
|
|
whyContents.forEach(content => {
|
|
if (content.id === tabId) {
|
|
content.classList.remove('hidden');
|
|
} else {
|
|
content.classList.add('hidden');
|
|
}
|
|
});
|
|
});
|
|
});
|
|
}); |