Добавить плавности смене по select.
Добрый день,
есть поле список с ценами, при смене значения, меняется отображаемая цена. Как сделать, чтобы эта смена происходила плавно?
<form method="post" action="" id="formMain" name="formMain">
<div id="cena">25 150</div>
<select name="razmer_vorota" id="razmer_vorota">
<option data-price="25 150" value="2500 x 2115">2500 x 2115</option>
<option data-price="30 200" value="3350 x 2390">3350 x 2390</option>
</select>
</form>
var formMain = document.forms.formMain;
formMain.oninput = formMain.onchange = function() {
cena.innerHTML = this.razmer_vorota[this.razmer_vorota.selectedIndex].getAttribute('data-price');
};
|
Цитата:
|
<form method="post" action="" id="formMain" name="formMain">
<div id="cena">25 150</div>
<select name="razmer_vorota" id="razmer_vorota">
<option data-price="25 150" value="2500 x 2115">2500 x 2115</option>
<option data-price="30 200" value="3350 x 2390">3350 x 2390</option>
</select>
</form>
<script>
razmer_vorota.onchange = function() {
var i = 1;
var timer = setInterval(function() {
i = i - 0.1;
cena.style.opacity= i;
if (i < 0.1) {
clearInterval(timer);
cena.innerHTML = this.razmer_vorota[this.razmer_vorota.selectedIndex].getAttribute('data-price');
timer = setInterval(function() {
i = i + 0.1;
cena.style.opacity= i;
if (i > 1) clearInterval(timer);
},100);
}
},100);
};
</script>
|
Dilettante_Pro,
ТО, что нужно СПАСИБО!!! |
| Часовой пояс GMT +3, время: 12:04. |