Как скрывать изображения за границами экрана без скрола?

Здравствуйте.
На сайте имеется некая карусель с изображениями, которые листаются справа налево. К моему сожалению, чтобы все изображения были в ряд нужно задавать ширину всему блоку после чего появляется ненужный мне скрол. Подскажите как сделать так, чтобы эти картинки прятались слева и справа (как бы обрезались) и все умещалось в одну строку. Уменьшать изображения не годится, у них должен быть стандартный размер, а у 3го немного больше.

<section class="screen">
			<div id="screen">
				<img src="img/Screen/Screen-1.jpg" id="img1" height="599" width="351">
				<img src="img/Screen/Screen-2.jpg" id="img2" height="599" width="351">
				<img src="img/Screen/Screen-3.jpg" id="img3" height="599" width="351">
				<img src="img/Screen/Screen-4.jpg" id="img4" height="599" width="351">
				<img src="img/Screen/Screen-5.jpg" id="img5" height="599" width="351">
			</div>
		</section>

<code lang="javascript">
function move(){
		window.strTimer = window.setInterval(timer, 1000);
		}

		function timer(){
		var img1 = document.getElementById('img1');
			var img2 = document.getElementById('img2');
			var img3 = document.getElementById('img3');
			var img4 = document.getElementById('img4');
			var img5 = document.getElementById('img5');
			var img6 = document.getElementById('img6');
			var tmp = img1.src;
			img1.src = img2.src;
			img2.src = img3.src;
			img3.src = img4.src;
			img4.src = img5.src;
			img5.src = tmp;
			img3.style.height = "680px";			
		}
</code>