Проблема со слайдером

[macbeth9]

Здравствуйте есть еще одна проблема.Имеется слайдер но не работают переключатели фото.Нужно сделать чтобы при нажатии на одну из стрелок переключалось фото назад и вперед

вот код слайдера

<div id="screen">

<div class="prev"></div>

<div id="navigation">

<ul>

<li><a><img src="slider/foto_01_thumb.jpg" alt=""></a></li>

<li><a><img src="slider/foto_02_thumb.jpg" alt=""></a></li>

<li><a><img src="slider/foto_03_thumb.jpg" alt=""></a></li>

<li><a><img src="slider/foto_04_thumb.jpg" alt=""></a></li>

<li><a><img src="slider/foto_05_thumb.jpg" alt=""></a></li>

</ul>

</div>

<div id="sections">

<ul>

<li><img src="slider/foto_01.jpg" alt=""></li>

<li><img src="slider/foto_02.jpg" alt=""></li>

<li><img src="slider/foto_03.jpg" alt=""></li>

<li><img src="slider/foto_04.jpg" alt=""></li>

<li><img src="slider/foto_05.jpg" alt=""></li>

</ul>

</div>

<div class="next"></div>

</div>

[DjTarik]

а слайдер у вас на чистом HTML работает? O_o

[macbeth9]

jquery и css

css

#screen {
	width: 495px;
	height: 310px;
	background: url('slider/fon.png') no-repeat;
	text-align: left;
	position: relative;
	z-index: 1000;
}

#navigation {
	width: 400px;
	height: 36px;
	position: absolute;
	top: 280px;
	left: 10px;
}

#navigation li {
	list-style-type: none;
	margin-right: 7px;
	float: left;
}

#screen .prev, #screen .next {
	display: block;
}

#screen .prev {
	width: 16px;
	height: 18px;
	background: url('slider/arrow.png') no-repeat;
	position: absolute;
	top: 283px;
	left: 430px;
	cursor: pointer;
}

#screen .next {
	width: 16px;
	height: 18px;
	background: url('slider/arrow.png') -16px 0px no-repeat;
	position: absolute;
	top: 283px;	
	left: 450px;
	cursor: pointer;
}

#sections {
	width: 493px;
	height: 273px;
	clear: left;
	overflow: hidden;
	margin-left: 1px;
	padding-top: 1px;
}

#sections ul {
	width: 2465px;
}

#sections li {
	float: left;
	overflow: hidden;
}

Edited March 24, 2010 by macbeth9