<div class="article-desc">
<div class="container">
<div class="static-content">
<h1>Калькулятор расчета OSB(ОСП)</h1>
<p>
Используя онлайн-калькулятор, вы можете рассчитать необходимое количество ОСП (OSB) для строительных работ.
</p>
<div class="wrapper-calculator-block">
<div class="wrapper-calculator-block-text-amount">
<ol>
<li>Для раcчета количества ОСП (OSB) выберите размер из выпадающего списка в калькуляторе или воспользуйтесь размерами из нашего каталога:
<select class="help-value selects mt-1 mb-1" id="select-options-imitation-help">
<option id="val-none" class="val-help">Выберите размер материала</option>
<option id="val-help-1" value="" class="val-help">9*1250*2500</option>
<option id="val-help-2" value="" class="val-help">12*1250*2500</option>
<option id="val-help-3" value="" class="val-help">15*1250*2500</option>
<option id="val-help-4" value="" class="val-help">18*1250*2500</option>
<option id="val-help-5" value="" class="val-help">22*1250*2500</option>
</select>
</li>
<li>Укажите ширину и длину покрываемой поверхности.</li>
<li>Если размер поверхности не является целым числом, можете написать его через точку. Например, 4.2 или 2.8.</li>
<li>Если хотите исключить из расчета элементы, на покрытие которых материал закладывать не нужно (двери, окна и др.), можете это сделать в правом столбце, указав их размер и количество. Будьте внимательны, размер поверхности указывается в метрах, а исключаемая площадь в миллиметрах.</li>
<li>Нажмите на кнопку "Рассчитать".</li>
<li>В правой графе будут общая площадь покрытия, необходимое количество листов ОСП, объем и примерный вес.</li>
</ol>
</div>
<div class="calculator-block amount p-15">
<form name="calc" class="calc-form">
<h2 class="calculator-title">Расчет количества ОСП (OSB)</h2>
<div class="wrapper-calc-timber-imitation">
<div>
<h6 class="calculator-title">Размер поверхности</h6>
<p>
Размер материала
</p>
<select class="aperture-value selects" id="select-options-imitation">
<option id="val1" value="" class="val">6*1250*2500</option>
<option id="val2" value="" class="val">8*1250*2500</option>
<option id="val3" value="" class="val">9*1250*2500</option>
<option id="val4" value="" class="val">9*1220*2440</option>
<option id="val5" value="" class="val">10*1250*2500</option>
<option id="val6" value="" class="val">11*1220*2440</option>
<option id="val7" value="" class="val">11*1250*2500</option>
<option id="val8" value="" class="val">12*1250*1250</option>
<option id="val9" value="" class="val">12*1250*2500</option>
<option id="val10" value="" class="val">12*1250*2800</option>
<option id="val11" value="" class="val">15*1250*2500</option>
<option id="val12" value="" class="val">18*1250*2500</option>
<option id="val13" value="" class="val">22*1220*2440</option>
<option id="val14" value="" class="val">22*1250*2500</option>
<option value="" id="valMarket" class="val" disabled style="display:none"> </option>
</select>
<p class="calculator-text-value">
Ширина поверхности(м)
</p>
<input id="width-room" class="aperture-value important-val">
<p class="calculator-text-value">
Длина поверхности(м)
</p>
<input id="heigth-room" class="aperture-value important-val">
</div>
<div>
<h6 class="calculator-title">Исключаемая площадь</h6>
<div class="block-aperture">
<div>
<p>
Ширина(мм)
</p>
<input id="widthAperture" class="aperture-value important-val-num">
</div>
<div>
<p>
Длина(мм)
</p>
<input id="heightAperture" class="aperture-value important-val-num">
</div>
<div>
<p>
Количество
</p>
<input id="amountAperture" class="aperture-value important-val-num">
</div>
</div>
</div>
</div>
<div class="wrapper-calculator-block-btn">
<button type="button" name="button" class="calculator-block-btn btn-amount" id="button">Рассчитать</button>
</div>
</form>
<div class="wrapper-result result-amount">
<div class="calculator-block-result">
<h3 class="calculator-text-result">Результат</h3>
<p id="room-area-result" class="calculator-value-result">Введите значения</p>
<p id="number-pieces-result" class="calculator-value-result"></p>
<p id="volumeOSB" class="calculator-value-result"></p>
<p id="weight-result" class="calculator-value-result"></p>
</div>
</div>
</div>
</div>
<div>
<p>
Мы рассчитали вес и площадь одного листа ОСП, учитывая размеры пиломатериала из нашего каталога.
</p>
<table class="responsive-table">
<thead>
<tr>
<th>
Размер ОСП
</th>
<th>
Общая площадь 1 шт., м<sup>2</sup>
</th>
<th>
Полезная площадь 1 шт., м<sup>2</sup>
</th>
<th>
Вес 1шт.,кг
</th>
</tr>
</thead>
<tbody>
<tr>
<td data-label="Размер ОСП">
<strong>9*1250*2500</strong>
</td>
<td data-label="Общая площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Полезная площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Вес 1шт.,кг">
<strong>18,3 кг</strong>
</td>
</tr>
<tr>
<td data-label="Размер ОСП">
<strong>12*1250*2500</strong>
</td>
<td data-label="Общая площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Полезная площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Вес 1шт.,кг">
<strong>24,4 кг</strong>
</td>
</tr>
<tr>
<td data-label="Размер ОСП">
<strong>15*1250*2500</strong>
</td>
<td data-label="Общая площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Полезная площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Вес 1шт.,кг">
<strong>30,5 кг</strong>
</td>
</tr>
<tr>
<td data-label="Размер ОСП">
<strong>18*1250*2500</strong>
</td>
<td data-label="Общая площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Полезная площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Вес 1шт.,кг">
<strong>36,5 кг</strong>
</td>
</tr>
<tr>
<td data-label="Размер ОСП">
<strong>22*1250*2500</strong>
</td>
<td data-label="Общая площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Полезная площадь, шт.">
<strong>3,125 м<sup>2</sup></strong>
</td>
<td data-label="Вес 1шт.,кг">
<strong>44,7 кг</strong>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>.d-n {
display: none;
}
.wrapper-calculator-block-text{
width: 40%;
}
.wrapper-calculator-block {
display: flex;
margin: 40px 0px 40px 0px;
}
.wrapper-calc-timber-imitation {
display: flex;
justify-content: space-evenly;
}
.wrapper-aperture {
display: flex;
justify-content: space-around;
width: 60%;
}
.aperture-value {
border: 2px solid #4c514a;
max-width: 135px;
height: 25px;
margin: 0 auto;
}
.wrapper-calculator-block-text-title {
font-weight: bold;
font-size: 1.1rem;
}
div.wrapper-calculator-block-text ol {
list-style-type: auto;
}
.help-value {
border: 5px solid #a4ba9b;
appearance: revert;
}
.help-value:focus {
border: 5px solid #a4ba9b;
}
.calculator-title {
text-align: center;
color: #4c514a;
}
h6.calculator-title {
margin-bottom: 20px;
}
.calculator-block {
display: flex;
justify-content: space-evenly;
margin-top: 1.5rem !important;
border: 5px solid #a4ba9b;
text-align: center;
margin: 0 auto;
}
.options {
width: 65%;
}
.amount {
width: 75%;
}
.user-value-prompt {
margin: 55px 20px;
width: 50%;
}
.wrapper-result {
background-color:#a4ba9b;
display: flex;
justify-content: center;
align-items: center;
}
.calculator-block-result {
padding: 10px;
background-color:#a4ba9b;
min-height: 150px;
}
.calculator-text-value {
margin: 20px 0px 0px 0px;
}
.calculator-text-result {
font-size: 25px;
color: #ffffff;
text-transform: uppercase;
margin: 0px 0px 10px 0px;
font-weight: bold;
}
.calc-form {
width: 100%;
padding: 20px 15px;
}
.calculator-block-btn {
background-color: #a4ba9b;
color: #ffffff !important;
border: none;
text-transform: uppercase;
font-size: 120%;
font-weight: bold;
padding: 5px 50px;
margin: 20px 0px 20px 0px;
}
.calculator-block-btn:hover {
background-color: #599c28;
}
p.calculator-value-result {
margin-bottom: 1rem;
padding: 5px;
margin: 0 auto;
max-width: 220px;
}
.static-content .wrapper-calculator-block p {
margin: 0px 0px 10px 0px;
}
.static-content .block-other {
margin: 30px 0px 30px 0px;
}
.wrapper-meaning-calculation select {
display: flex;
justify-content: center;
width: 70px;
height: 30px;
padding: 0px;
text-align: center;
}
.wrapper-meaning-calculation{
display: flex;
justify-content: center;
margin: 5px 0px;
}
.wrapper-calculator-block {
display: flex;
margin: 40px 0px 40px 0px;
}
.wrapper-calculator-block-text {
width: 50%;
padding: 15px;
}
.wrapper-calculator-block-text-amount{
width: 50%;
padding: 15px;
}
.wrapper-calculator-block-text-title {
margin-top: 140px;
font-weight: bold;
font-size: 1.1rem;
}
div.wrapper-calculator-block-text ol {
list-style-type: auto;
}
.calculator-title {
text-align: center;
color: #4c514a
}
div.calculator-block {
display: flex;
justify-content: space-evenly;
width: 100%;
border: 5px solid #a4ba9b;
text-align: center;
margin: 0 auto;
height: fit-content;
}
.calc-form {
width:120%;
}
.wrapper-result {
background-color:#a4ba9b;
display: flex;
justify-content: center;
align-items: center;
}
.result-amount {
width: 50%;
}
.result-options {
width: 50%;
}
.calculator-block-result {
padding: 10px;
background-color:#a4ba9b;
min-height: 150px;
}
.calculator-text-value {
margin: 20px 0px 5px 0px;
}
.calculator-text-result {
font-size: 25px;
color: #ffffff;
text-transform: uppercase;
margin: 0px 0px 10px 0px;
font-weight: bold;
}
.calculator-value {
margin: 0 auto;
max-width: 220px;
height: 25px;
border: 2px solid #4c514a;
}
.empty {
border-color: red;
}
.calc-form {
width: 90%;
padding: 20px 15px;
}
.calculator-block-btn {
background-color: #a4ba9b;
color: #ffffff;
border: none;
text-transform: uppercase;
font-size: 120%;
font-weight: bold;
padding: 5px 50px;
margin: 20px 0px 20px 0px;
}
.calculator-block-btn:hover {
background-color: #599c28;
}
p.calculator-value-result {
margin-bottom: 1rem;
padding: 5px;
margin: 0 auto;
max-width: 220px;
}
.static-content .wrapper-calculator-block p {
margin: 5px 0px 10px 0px;
}
.static-content .block-other {
margin: 30px 0px 30px 0px;
}
.m-0a {
margin: 0 auto;
}
.wrapper-meaning-calculation select {
display: flex;
justify-content: center;
width: 50px;
height: 25px;
padding: 0px;
text-align: center;
}
.wrapper-meaning-calculation{
display: flex;
justify-content: center;
margin: 5px 0px;
align-items: baseline;
gap: 5px;
}
/*Media*/
/* Large desktops and laptops */
@media (min-width: 1080px) and (max-width: 1200px){
.wrapper-calculator-block-text-amount {
width: 30%;
}
.wrapper-calculator-block-text {
width: 30%;
}
.options {
width: 70%;
}
.wrapper-result {
width: 30%;
}
}
/* Portrait tablets and medium desktops */
@media (min-width: 992px) and (max-width: 1080px) {
.static-content table.responsive-table tr {
border-bottom: 3px solid #f3f3f3;
}
.result-options {
width: 35%;
}
.result-amount {
width: 35%;
}
.calculator-block {
max-width: 800px;
}
.btn-value-transfer {
width: 45px;
}
div.static-content table.responsive-table td {
text-align: end;
}
.wrapper-calculator-block-text {
width: 40%;
}
.wrapper-calculator-block-text-amount {
width: 40%;
}
.wrapper-calculator-block-text-title {
margin-top: 60px;
}
.aperture-value {
width: 120px;
}
}
/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
.static-content table.responsive-table tr {
border-bottom: 3px solid #f3f3f3;
}
.wrapper-result {
width: 35%;
}
.wrapper-calculator-block {
display: block;
}
.wrapper-calculator-block-text {
width: 100%;
}
.wrapper-calculator-block-text-amount {
width: 100%;
}
.wrapper-calculator-block-text-title {
margin-top: 50px;
text-align: center;
}
div.calculator-block {
max-width: 90%;
}
.user-value-prompt {
width: 60%;
}
.wrapper-calc-timber-imitation {
display: block;
}
.wrapper-aperture {
display: block;
width: 100%;
}
.btn-value-transfer:not(:last-child) {
margin-bottom: 2px;
}
div.static-content table.responsive-table td {
text-align: end;
}
.aperture-value {
max-width: 220px;
height: 30px;
}
.calculator-value {
max-width: 220px;
height: 30px;
}
h6.calculator-title {
margin: 30px 0px 5px 0px;
}
}
/* Landscape phones and portrait tablets */
@media (min-width: 481px) and (max-width: 767px) {
.wrapper-calculator-block-text {
width: 100%;
}
.wrapper-calculator-block-text-amount {
width: 100%;
}
.static-content table.responsive-table tr {
border-bottom: 3px solid #f3f3f3;
}
.wrapper-calculator-block {
display: block;
}
div.calculator-block {
max-width: 100%;
display: flex;
overflow: hidden;
}
.wrapper-calculator-block-text {
width: 100%;
}
.wrapper-calculator-block-text-title {
margin-top: 50px;
text-align: center;
}
.user-value-prompt {
display: none;
}
div.static-content table.responsive-table td {
text-align: end;
}
.calculator-value {
max-width: 170px;
}
.calc-form {
width: 60%;
}
.wrapper-result {
width: 40%;
}
.wrapper-aperture {
width: auto;
}
.aperture-value {
max-width: 100px;
height: 25px;
}
.wrapper-calc-timber-imitation {
display: block;
}
.wrapper-aperture {
display: block;
width: 100%;
}
.btn-value-transfer:not(:last-child) {
margin-bottom: 2px;
}
div.static-content table.responsive-table td {
text-align: end;
}
.aperture-value {
max-width: 220px;
height: 30px;
}
.calculator-value {
max-width: 220px;
height: 30px;
}
h6.calculator-title {
margin: 30px 0px 5px 0px;
}
}
/* Landscape phones and smaller */
@media (max-width: 480px) {
.wrapper-calc-timber-imitation {
display: block;
}
.wrapper-aperture {
display: block;
width: 100%;
}
.wrapper-aperture {
display: block;
width: 100%;
}
.static-content table.responsive-table tr {
border-bottom: 3px solid #f3f3f3;
}
.wrapper-calculator-block-text {
width: 100%;
}
h6.calculator-title {
margin: 30px 0px 5px 0px;
}
.wrapper-calculator-block-text-amount {
width: 100%;
}
.wrapper-calculator-block-text-title {
margin-top: 50px;
text-align: center;
}
.wrapper-calculator-block {
display: block;
}
div.calculator-block {
display: grid;
max-width: 90%;
overflow: hidden;
}
.user-value-prompt {
display: none;
}
.calc-form {
margin: 0 auto;
}
.calculator-value {
max-width: 170px;
}
.wrapper-result {
min-width: 400px;
}
.calculator-block-btn {
width: 70%;
}
div.static-content table.responsive-table td {
text-align: end;
}
.calculator-title {
font-size: 18px;
}
.aperture-value {
max-width: 170px;
}
}let meaningCalculation = document.getElementById('meaningCalculation');
/***Функция расчета количества***/
document.getElementsByClassName('btn-amount')[0].addEventListener('click', calculateAmount);
function calculateAmount(){
let importantNum = document.querySelectorAll('.important-val-num');
let important = document.querySelectorAll('.important-val');
let widthRoom = document.getElementById('width-room').value;
let widthRoomValue = Number(widthRoom); //ширина помещения
let heightRoom = document.getElementById('heigth-room').value;
let heightRoomValue = Number(heightRoom); //высота помещения
let heightAperture = document.getElementById('heightAperture').value;
let heightApertureValue = Number(heightAperture);
let widthAperture = document.getElementById('widthAperture').value;
let widthApertureValue = Number(widthAperture);
const humidity = 650; //плотность ОСП
let amountAperture = document.getElementById('amountAperture').value;
let amountApertureValue = Number(amountAperture);
let selectOptionsImitation = document.getElementById('select-options-imitation').selectedIndex;
let optionsImitation = document.getElementById('select-options-imitation').options;
let selectOptionsImitationHelp = document.getElementById('select-options-imitation-help').selectedIndex;
let optionsImitationHelp = document.getElementById('select-options-imitation-help').options;
let wordsAreaRoom = ' м² площадь покрытия';
let wordsPiecesResult = ' шт OSB нужно для отделки указанной площади';
let wordsVolumeOSB = ' м³ объем указанного количества OSB';
let wordsWeigth = ' кг вес полученного количества листов OSB';
important.forEach((el) => {
if(!el.value || !Number(el.value)) el.classList.add('empty');
else
el.classList.remove('empty');
} //проверка заполнены ли значения в полях
)
importantNum.forEach((el) => {
if(!el.value){
el.classList.remove('empty');
}
else if(!Number(el.value)){
el.classList.add('empty');
} else {
el.classList.remove('empty');
}
} //проверка заполнены ли значения в полях для вычитания площади
)
if(selectOptionsImitation >= 0 && selectOptionsImitation != 14){
/*Получаем элементы выпадающего списка*/
let val1 = document.getElementById('val1');
let val2 = document.getElementById('val2');
let val3 = document.getElementById('val3');
let val4 = document.getElementById('val4');
let val5 = document.getElementById('val5');
let val6 = document.getElementById('val6');
let val7 = document.getElementById('val7');
let val8 = document.getElementById('val8');
let val9 = document.getElementById('val9');
let val10 = document.getElementById('val10');
let val11 = document.getElementById('val11');
let val12 = document.getElementById('val12');
let val13 = document.getElementById('val13');
let val14 = document.getElementById('val14');
/*Значения для полученных элементов списка */
val1.val = [6, 1250, 2500];
val2.val = [8, 1250, 2500];
val3.val = [9, 1250, 2500];
val4.val = [9, 1220, 2440];
val5.val = [10, 1250, 2500];
val6.val = [11, 1220, 2440];
val7.val = [11, 1250, 2500];
val8.val = [12, 1250, 1250];
val9.val = [12, 1250, 2500];
val10.val = [12, 1250, 2800];
val11.val = [15, 1250, 2500];
val12.val = [18, 1250, 2500];
val13.val = [22, 1220, 2500];
val14.val = [22, 1250, 2500];
document.getElementById('select-options-imitation').selectedIndex;
let newArr = optionsImitation[selectOptionsImitation].val;
let pieceArea = newArr[1] * newArr[2]/1000000; //переменожаем значения, получая площадь 1 штуки.
let area = (heightApertureValue * widthApertureValue / 1000000) * amountApertureValue; //исключаемая площадь
function weight() {
return (((newArr[0] * (newArr[1] * newArr[2]/1000000)) * humidity) / 1000) * (((widthRoomValue * heightRoomValue) - (area)) / pieceArea);
} //формула расчета веса.
function roomArea() {
return (widthRoomValue * heightRoomValue) - (area);
} //функция-формула, рассчитывающая площадь помещения вместе с исключаемой площадью
function numberPieces(){
return ((widthRoomValue * heightRoomValue) - (area)) / pieceArea;
} //формула расчета количества штук
function volumeOSB() {
return (newArr[0] * newArr[1] * newArr[2] / 1000000000) * (((widthRoomValue * heightRoomValue) - (area)) / pieceArea);
} //функция-формула, рассчитывающая объем
if(widthRoom !== '' && heightRoom !== '' && Number(widthRoom) && Number(heightRoom)) {
if(Number(widthAperture) && Number(heightAperture) && Number(amountAperture) || widthAperture == '' && heightAperture == '' && amountAperture == '' ){
document.getElementById('room-area-result').innerHTML = roomArea() + wordsAreaRoom;
document.getElementById('room-area-result').animate([{opactiy: 0, color: "#a4ba9b" }, {opacity: 1, color: "#4c504a" }], 1500);
document.getElementById('number-pieces-result').innerHTML = numberPieces().toFixed(2) + wordsPiecesResult;
document.getElementById('number-pieces-result').animate([{opactiy: 0, color: "#a4ba9b" }, {opacity: 1, color: "#4c504a" }], 1500);
document.getElementById('weight-result').innerHTML = (weight()).toFixed(1) + wordsWeigth;//выводим результат: рассчет веса.
document.getElementById('weight-result').animate([{opactiy: 0, color: "#a4ba9b" }, {opacity: 1, color: "#4c504a" }], 1500);
document.getElementById('volumeOSB').innerHTML = (volumeOSB()).toFixed(1) + wordsVolumeOSB ;//Выводим объем
document.getElementById('volumeOSB').animate([{opactiy: 0, color: "#a4ba9b" }, {opacity: 1, color: "#4c504a" }], 1500);
}
}
}
else if(selectOptionsImitation == 14){
let valMarket = document.getElementById('valMarket');
console.log(valMarket);
let valHelp1 = document.getElementById('val-help-1');
let valHelp2 = document.getElementById('val-help-2');
let valHelp3 = document.getElementById('val-help-3');
let valHelp4 = document.getElementById('val-help-4');
let valHelp5 = document.getElementById('val-help-5');
valHelp1.val = [9, 1250, 2500];
valHelp2.val = [12, 1250, 2500];
valHelp3.val = [15, 1250, 2500];
valHelp4.val = [18, 1250, 2500];
valHelp5.val = [22, 1250, 2500];
document.getElementById('select-options-imitation-help').selectedIndex;
let newArr = optionsImitationHelp[selectOptionsImitationHelp].val;
console.log(newArr);
let pieceArea = newArr[1] * newArr[2]/1000000; //переменожаем значения, получая площадь 1 штуки.
let area = (heightApertureValue * widthApertureValue / 1000000) * amountApertureValue; //исключаемая площадь
function weight() {
return (((newArr[0] * (newArr[1] * newArr[2]/1000000)) * humidity) / 1000) * (((widthRoomValue * heightRoomValue) - (area)) / pieceArea);
} //формула расчета веса.
function roomArea() {
return (widthRoomValue * heightRoomValue) - (area);
} //функция-формула, рассчитывающая площадь помещения вместе с исключаемой площадью
function numberPieces(){
return ((widthRoomValue * heightRoomValue) - (area)) / pieceArea;
} //формула расчета количества штук
function volumeOSB() {
return (newArr[0] * newArr[1] * newArr[2] / 1000000000) * (((widthRoomValue * heightRoomValue) - (area)) / pieceArea);
} //функция-формула, рассчитывающая объем
if(widthRoom !== '' && heightRoom !== '' && Number(widthRoom) && Number(heightRoom)) {
if(Number(widthAperture) && Number(heightAperture) && Number(amountAperture) || widthAperture == '' && heightAperture == '' && amountAperture == '' ){
document.getElementById('room-area-result').innerHTML = roomArea() + wordsAreaRoom;
document.getElementById('room-area-result').animate([{opactiy: 0, color: "#a4ba9b" }, {opacity: 1, color: "#4c504a" }], 1500);
document.getElementById('number-pieces-result').innerHTML = numberPieces().toFixed(2) + wordsPiecesResult;
document.getElementById('number-pieces-result').animate([{opactiy: 0, color: "#a4ba9b" }, {opacity: 1, color: "#4c504a" }], 1500);
document.getElementById('weight-result').innerHTML = (weight()).toFixed(1) + wordsWeigth;//выводим результат: рассчет веса.
document.getElementById('weight-result').animate([{opactiy: 0, color: "#a4ba9b" }, {opacity: 1, color: "#4c504a" }], 1500);
document.getElementById('volumeOSB').innerHTML = (volumeOSB()).toFixed(1) + wordsVolumeOSB ;//Выводим объем
document.getElementById('volumeOSB').animate([{opactiy: 0, color: "#a4ba9b" }, {opacity: 1, color: "#4c504a" }], 1500);
}
}
}
}
function resetValue(){
var selects = document.getElementsByClassName('selects');
Array.from(selects).forEach((el, i) => {
el.onclick = (e) => {
for (let j = i+1; j < selects.length; j++) {
document.getElementById('valMarket').classList.remove('d-n');
selects[j].selectedIndex = 14;
}
}});
}
resetValue();
//Функция на перенос значения из списка каталога в калькулятор
document.getElementById('select-options-imitation-help').addEventListener('change', function(){
let selectOptionsImitationHelp = document.getElementById('select-options-imitation-help').selectedIndex;
let optionsImitationHelp = document.getElementById('select-options-imitation-help').options;
let valMarket = document.getElementById('valMarket');
let valHelp1 = document.getElementById('val-help-1');
let valHelp2 = document.getElementById('val-help-2');
let valHelp3 = document.getElementById('val-help-3');
let valHelp4 = document.getElementById('val-help-4');
let valHelp5 = document.getElementById('val-help-5');
valHelp1.val = [9, 1250, 2500];
valHelp2.val = [12, 1250, 2500];
valHelp3.val = [15, 1250, 2500];
valHelp4.val = [18, 1250, 2500];
valHelp5.val = [22, 1250, 2500];
document.getElementById('select-options-imitation-help').selectedIndex;
let newArr = optionsImitationHelp[selectOptionsImitationHelp].val;
if(newArr.length == 0){
return false;
} else if(newArr.length > 0){
valMarket.innerHTML = newArr[0] + '*' + newArr[1] + '*' + newArr[2];
}
});
External CSS
This Pen doesn't use any external CSS resources.
External JavaScript
This Pen doesn't use any external JavaScript resources.