Очередной слайдер-карусель картинок.

Очередной слайдер - карусель.

Ставить в зависимости от того где хотите видеть.
Будь то виджет, приветствие или html страница

Код:

<script type="text/javascript" src="http://www.patmax.eu/J1/120404181157.js"></script>
<script type="text/javascript" src="http://www.patmax.eu/J1/120330112609.js"></script>
<script type="text/javascript">
      jQuery(function() {
          jQuery(".jMyCarousel").jMyCarousel({
              visible: '100%'
          });
      });
  </script>
<style>
div.jMyCarousel .prev{   
background: url('http://i58.servimg.com/u/f58/14/80/95/87/left10.png') center center no-repeat; /* кнопка влево*/   
width:47px;    /* ширина кнопки */
height:61px; /* высота кнопки */   
border:0px;
}

div.jMyCarousel .next{   
background: url('http://i58.servimg.com/u/f58/14/80/95/87/right10.png') center center no-repeat; /* кнопка вправо */   
width:47px;    /* ширина кнопки */
height:61px; /* высота кнопки */   
border:0px;
}
div.jMyCarousel ul li{
border:1px solid #000; /* рамка на картинках */
line-height:0px;
margin:0 1px; /* отступ картинок друг от друга */
}
</style>

<br/><br/><div class="jMyCarousel">
    <ul>
        <li><img src="ссылка на картинку" width="160" height="107"></li>
        <li><img src="ссылка на картинку" width="160" height="107"></li>
        <li><img src="ссылка на картинку" width="160" height="107"></li>
        <li><img src="ссылка на картинку" width="160" height="107"></li>
        <li><img src="ссылка на картинку" width="160" height="107"></li>
        <li><img src="ссылка на картинку" width="160" height="107"></li>
        <li><img src="ссылка на картинку" width="160" height="107"></li>
        <li><img src="ссылка на картинку" width="160" height="107"></li>
  </ul>
</div>

Добавлять картинки можно размножая строчку

Код:

<li><img src="ссылка на картинку" width="160" height="107"></li>

width="160" height="107" в строчке обозначает ширину и высоту картинки соответственно.
Естественно картинки можно ставить любого размера, соответственно в строчке прописываете свой размер.
Картинки должны быть одинакового размера, иначе будут искажены.

ДЕМО

P.S. Можно использовать для отображения баннеров друзей

Всместо картинок надо вставить коды баннеров таким образом:

Код:

<div class="jMyCarousel">
    <ul>
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>  
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>  
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>  
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>
<li><a href="http://адрес форума" target=_blank title="альтернативный текст"><img src="http://ссылка на картинку баннер" border="0" width= "88"  height= "31"></a></li>
  </ul>
</div>