Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: для новичков > Скрипт не вычитает ширину блока

Автор: DeMONiZ 30.10.2012, 10:04

Здравствуйте, форумчане.

Всегда интересовал один код, который вместо того чтоб вычитать щирину блока наоборот ее увеличивал. Как в данном случае правильно вычитать единицу чтоб блок уменьшал свою ширину?

Код


<style>
#img{
    width:400px;
    height:100px;
    border:1px solid red;
}
</style>
<script>
function lm(){
    movs();
    function movs(){
        widths = parseInt(document.getElementById('img').offsetWidth); 
        widths=widths-1;
            setTimeout(function(){ document.getElementById('img').style.width = widths+"px"; movs();},10);
    }
}
</script>
<div id="img"></div> 
<a href="#" onclick="lm()">--------</a>

Пробовал так:
widths=Number(widths)-Number(1);
и так:
widths=parseInt(widths)-parseInt(1);

Результат все равно неудовлетворительный.

А вот если не единицу вычитать, а к примеру цифру три то все работает как надо.
На сколько я думаю какое то несоответствие типов... Но как это исправить? Как сделать правильно чтоб код заработал?

Автор: CruorVult 30.10.2012, 12:52

offsetWidth = width + border

По-этому ширина будет увеличиваться, т.к. разница в 1 пиксель компенсируется 2 пикселями(бордером)

Код


widths = parseInt(document.getElementById('img').offsetWidth); // 402
widths=widths-1;//401
document.getElementById('img').style.width = widths+"px"//401
document.getElementById('img').offsetWidth//403

Автор: Aliance 30.10.2012, 13:04

Нужно использовать clientWidth. http://jsfiddle.net/Aliance/jVV2q/.

Автор: DeMONiZ 30.10.2012, 19:40

Спасибо большое, буду пробовать!