Scribd
Upload
2 views1 page

script.js

Uploaded by

asadalimanzoor45
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
2 views1 page

script.js

Uploaded by

asadalimanzoor45
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 1

let currentPage = 1;

const productsPerPage = 5; // Number of products per page

// Dummy product data


const products = [
{ name: 'Product 1', description: 'Description of Product 1.', price: '$10' },
{ name: 'Product 2', description: 'Description of Product 2.', price: '$20' },
{ name: 'Product 3', description: 'Description of Product 3.', price: '$30' },
{ name: 'Product 4', description: 'Description of Product 4.', price: '$40' },
{ name: 'Product 5', description: 'Description of Product 5.', price: '$50' },
{ name: 'Product 6', description: 'Description of Product 6.', price: '$60' },
{ name: 'Product 7', description: 'Description of Product 7.', price: '$70' },
{ name: 'Product 8', description: 'Description of Product 8.', price: '$80' },
{ name: 'Product 9', description: 'Description of Product 9.', price: '$90' },
{ name: 'Product 10', description: 'Description of Product 10.', price:
'$100' }
// Add more products as needed
];

function showProducts(page) {
const startIndex = (page - 1) * productsPerPage;
const endIndex = startIndex + productsPerPage;
const productsToDisplay = products.slice(startIndex, endIndex);

const productsSection = document.getElementById('products');


productsSection.innerHTML = '';
productsToDisplay.forEach(product => {
const productDiv = document.createElement('div');
productDiv.classList.add('product');
productDiv.innerHTML = `
<h2>${product.name}</h2>
<p>${product.description}</p>
<p>Price: ${product.price}</p>
`;
productsSection.appendChild(productDiv);
});

const pageSpan = document.getElementById('page');


pageSpan.textContent = `Page ${currentPage}`;
}

function nextPage() {
if (currentPage < Math.ceil(products.length / productsPerPage)) {
currentPage++;
showProducts(currentPage);
}
}

function prevPage() {
if (currentPage > 1) {
currentPage--;
showProducts(currentPage);
}
}

// Display initial products on page load


showProducts(currentPage);

You might also like