Пример

HTML

<button id="click1">none</button>

<div id="colect_imgs">
<div id="content">
<div class="content">
	<div class="imgs_slide">
		<img class="" src="https://historytime.ru/wp-content/uploads/2016/10/%D0%B2%D0%BE%D0%BB%D0%BA-770x481.jpg">
	</div>
	<div class="imgs_slide">
		<img class="" src="http://www.astromeridian.ru/assets/images/sonnik/volk.jpg">
  </div>
  <div class="imgs_slide">
		<img class="" src="http://лесные.рф/upload/000/u1/de/d3/volk-photo-bigger.jpg">
	</div>
</div>
</div>
</div>

CSS

#colect_imgs {
	height: 130px;
	width: 750px;
	border: 2px solid black;
	position: relative;
}
#content, .content {
  height: 130px;
	width: 750px;
  overflow:hidden;
}

.imgs_slide {
	width: 250px;
	height: 130px;
	float: left;
	display: block;
	overflow: hidden;
}

.imgs_slide img {
	//position: absolute;
	display: block;
	width: 250px;
	height: 130px;
}

JavaScript

var click1 = document.getElementById('click1');

function slidesOut(){
	document.getElementById('content').style.cssText=' width: 0px; transition: 3s;';
}

click1.onclick = slidesOut;