html
Copy code
Adsense Revenue Calculator
Adsense Revenue Calculator
Estimated Monthly Revenue: $0.00
CSS (styles.css):
css
Copy code
body {
background-color: #f8f9fa;
}
h1 {
font-family: 'Arial', sans-serif;
}
form {
background-color: #ffffff;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
button {
background: linear-gradient(45deg, #007bff, #00c6ff);
border: none;
}
button:hover {
background: linear-gradient(45deg, #00c6ff, #007bff);
}
.result h2 {
font-family: 'Arial', sans-serif;
font-weight: bold;
}
JavaScript (script.js):
javascript
Copy code
function calculateRevenue() {
// Get input values
const dailyVisitors = parseFloat(document.getElementById('dailyVisitors').value);
const pageViewsPerVisitor = parseFloat(document.getElementById('pageViewsPerVisitor').value);
const ctr = parseFloat(document.getElementById('ctr').value) / 100; // Convert percentage to decimal
const cpc = parseFloat(document.getElementById('cpc').value);
// Validate inputs
if (isNaN(dailyVisitors) || isNaN(pageViewsPerVisitor) || isNaN(ctr) || isNaN(cpc)) {
alert('Please enter valid numbers for all fields.');
return;
}
// Calculate total page views per day
const totalPageViewsPerDay = dailyVisitors * pageViewsPerVisitor;
// Calculate total clicks per day
const totalClicksPerDay = totalPageViewsPerDay * ctr;
// Calculate daily revenue
const dailyRevenue = totalClicksPerDay * cpc;
// Calculate monthly revenue (assuming 30 days in a month)
const monthlyRevenue = dailyRevenue * 30;
// Display result
document.getElementById('revenueResult').textContent = monthlyRevenue.toFixed(2);
}
