<script type="text/javascript">
$(document).ready(function(){
  var currentPosition = 0;
  var slideWidth = 680;
  var slides = $('.slide');
  var numberOfSlides = slides.length;
  // С помощью скрипта убираем прокрутку в контейнере.
  $('#slidesContainer').css('overflow', 'hidden');
  // Свернем все вкладки .slides в блок #slideInner 
  slides .wrapAll('<div id="slideInner"></div>')
.css({
      'float' : 'left',
      'width' : slideWidth
    });
  // Проставим блоку #slideInner ширину, равную общей ширине контейнеров
  $('#slideInner').css('width', slideWidth * numberOfSlides);
  $('#slideshow')
    .prepend('<span class="control" id="leftControl">Clicking moves left</span>')
    .append('<span class="control" id="rightControl">Clicking moves right</span>');
  manageControls(currentPosition);
  $('.control')
    .bind('click', function(){
currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
    manageControls(currentPosition);
    $('#slideInner').animate({
      'marginLeft' : slideWidth*(-currentPosition)
    });
  });
  function manageControls(position){
    // Скрыть левую стрелку у первого контейнера
if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
// Скрыть правую стрелку у последнего контейнера
    if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }
  }	
});
</script>

<!-- Cлайдер-->
<style type="text/css">
#slideshow {
margin:0 auto;
width:780px;
height:263px;
background:transparent url() no-repeat 0 0;
position:relative;
}
#slideshow #slidesContainer {
  margin:0 auto;
  width:680px;
  height:263px;
  overflow:auto; /* поддержка прокрутки */
  position:relative;
}
#slideshow #slidesContainer .slide {
  margin:0 auto;
  width:660px; /* На двадцать пикселев меньше чем ширина #slidesContainer */
  height:263px;
}
.control {
  display:block;
  width:39px;
  height:263px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
  z-index:100;
}
#leftControl {
  top:0;
  left:0;
  background:transparent url(http://uploads.ru/i/e/X/1/eX1H7.png) no-repeat 0 0;
}
#rightControl {
  top:0;
  right:0;
  background:transparent url(http://uploads.ru/i/F/7/1/F71vd.png) no-repeat 0 0;
}
.slide h2, .slide p {
  margin:15px;
}
.slide img {
  float:right;
  margin:0 15px;
}
</style>
<div id="slideshow">
    <div id="slidesContainer">
      <div class="slide">
<table border="0" width=100%>
<tr>
    <td align="center"><img src="http://uploads.ru/i/r/X/K/rXKjQ.png"></td>
   <td align="center"><img src="http://uploads.ru/i/9/J/t/9JtZb.png"></td>
</tr>
<tr>
    <td align="right">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td>
   <td><center>
<img src="http://uploads.ru/i/x/A/O/xAOc8.png"> <img src="http://uploads.ru/i/x/A/O/xAOc8.png"> <img src="http://uploads.ru/i/x/A/O/xAOc8.png"></center></td>
</tr>
<tr>
    <td align="right"><img src="http://uploads.ru/i/u/E/Q/uEQqB.png"></td>
   <td><marquee scrollamount="3" onmouseover="this.scrollAmount=0" onmouseout="this.scrollAmount=3" width="305px" height="32px">
<a href="http://colorforum.ru" title="Колорфорум любит тебя!" target=_blank> <img src="https://forumstatic.ru/files/000c/77/06/72214.gif" border="0" alt="COLOR FORUM"></a></marquee></td>
</tr>
    </table>
      </div>
<div class="slide">
<table border="0" width=100%>
<tr>
    <td align="center"><img src="http://uploads.ru/i/7/f/u/7fuqY.png"></td>
   <td align="center"><img src="http://uploads.ru/i/j/R/T/jRTVI.png"></td>
</tr>
<tr>
    <td align="left"><b>Дата:</b> 01/01/2001<br>
<b>Время/погода:</b> вечер, идет дождь</br>
<b>Описание:</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</td>
   <td  align="center"><a href="ссылка">link</a> <a href="ссылка">link</a> <a href="ссылка">link</a> <a href="ссылка">link</a> <a href="ссылка">link</a></td>
</tr>
    </table>
      </div>
<div class="slide">
<table border="0" width=100%>
<tr>
    <td align="center"><img src="http://uploads.ru/i/Y/K/w/YKwrA.png"></td>
   <td align="center"><img src="http://uploads.ru/i/H/g/s/HgsT8.png"></td>
</tr>
<tr>
    <td align="center"><img src="http://uploads.ru/i/M/3/k/M3kub.png"></td>
   <td align="center">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td>
</tr>
    </table>
      </div>
</div></div><!--End// Cлайдер-->