Реализовать карусельку

[DynkanMaclaud]

Решил я заморочиться и сделать каррусельку ( контейнер и кнопка (вперед)).

<div id="carusel">
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
	</div>
	
	<div id="next" onclick="next()">></div>
	
	
	
	
	</body>

#carusel{

width:2000px;

height:100px;

border:1px solid black;

position:absolute;

left:-1000px;


}


#next{

width:50px;

height:100px;

border:1px solid black;

position:absolute;

right:50px;

text-align:center;

}.box{

background-color:green;
width:200px; 
height:80px;
float:left;

var nextslide=document.getElementById('next');
		
		
		 function next(){
		var box=document.getElementById('carusel'),
			
		box.style.left=-1000+100+"px";
		
		
		
		
		
		
		
		
		};

Только вот не пойму как вместо '-1000' подставить значение left ??? Подскажите пожалуйста

[Viral]

function next(){
  var box=document.getElementById('carusel');
  var leftnow = Number(box.style.left.replace('px',''));
  box.style.left = leftnow+100+"px";
};

[WorM32]

Viral,

var leftnow = Number(box.style.left.replace('px',''))

проще делать так:

var leftnow = parseFloat(box.style.left);

[Viral]

JrWorM32, ок) спасибо)

[DynkanMaclaud]

Работает странно, поидее он должен прибавлять 100 к значению что в left (-1000), тоесть клик -900 кдик -800 а он сразу left:100px; клик ;left 200((

а если использовать

function next(){
  var box=document.getElementById('carusel');
  var leftnow = parseFloat(box.style.left);

  box.style.left = leftnow+100+"px";
};

я так понял в переменную leftnow, заносится число находящиеся в left; поставвил

alert(leftnow)

вывел NaN , тоесть не работает(( должен же число вывести

Viral поясни с replace а то я читал на js чето не понял ниче(((( что мы делаем им??

[рони]

я так понял в переменную leftnow, заносится число находящиеся в left

а у вас ничего нет в box.style поэтому и NaN все коды выше заработают если в style что-то будет -- но лучше читать доки

Свойство style позволяет читать эту информацию, но лишь ту, которая доступна напрямую из свойства/атрибута "style":

http://learn.javascript.ru/styles-and-classes

[DynkanMaclaud]

Спасибо

[Viral]

DynkanMaclaud,

var leftnow = Number(box.style.left.replace('px',''))

str.replace(var1, var2) берет строку str, ищет в ней подстроку var1 (в нашем случае 'px') и заменяет ее на var2 (в нашем случае ни на что не заменяет, просто убирает, т.к. кавычки пустые)

но WorM32 тут прав, в этом случае правильнее использовать parseFloat, это я неуч не вспомнил про этот метод