Калькулятор потолков body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
}
.calculator-container {
width: 80%;
max-width: 600px;
margin: 50px auto;
padding: 20px;
background: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
h1 {
text-align: center;
}
form {
display: flex;
flex-direction: column;
}
label {
margin-bottom: 5px;
}
input, select {
margin-bottom: 10px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
}
button {
padding: 10px;
border: none;
border-radius: 4px;
background-color: #28a745;
color: #fff;
font-size: 16px;
cursor: pointer;
}
button:hover {
background-color: #218838;
}
#result {
margin-top: 20px;
font-size: 18px;
font-weight: bold;
}
script.js
function calculate() {
// Получение значений из формы
const length = parseFloat(document.getElementById('length').value);
const width = parseFloat(document.getElementById('width').value);
const material = document.getElementById('material').value;
// Простая проверка валидности
if (isNaN(length) || isNaN(width) || length <= 0 || width <= 0) {
alert('Пожалуйста, введите правильные значения длины и ширины.');
return;
}
// Простейшие расчеты
const area = length * width;
// Здесь вы можете добавить логику для расчета стоимости в зависимости от выбранного материала
const materialCost = material === 'material1' ? 500 : 700; // примерные цены
const totalCost = area * materialCost;
// Отображение результата
document.getElementById('result').innerText = `Площадь: ${area.toFixed(2)} м²\nСтоимость: ${totalCost.toFixed(2)} рублей`;
}