Карусель обрезает изображения

Доброго времени суток, господа и дамы!

У меня возникла проблема с реализацией карусели (слайдера) в шапке форума, предложенной уважаемым Домовым на вот этой страницу: https://help.forum2x2.ru/t20438-topic

В частности, интересует вариант №2 из приведенных им скриптов.

Проблема в том, что картинки обрезаются, хотя подогнаны как надо (в оригинале тоже самое). Первая картинка режется снизу немного, ее соседи режутся по бокам и снизу ну и т.п.

Можно ли как то подправить скрипт, дабы избежать такого эффекта (хотя бы на первых трёх картинках) или заменить такое обрезание каким нибудь плавным размытием по краям?

UP

Скорее всего вы не правильно указали размер картинок в коде CSS

<style>
.roundabout-holder{
padding: 10px;
height: 10em;
width: 90%;
margin: 0 auto;
}
 .roundabout-moveable-item {
height:200px;
 width:151px;
 cursor:pointer;
 background:transparent;
 border:1px solid #999;  
 border:1px solid #999;
 overflow:hidden;
 }
 .roundabout-in-focus{
cursor:auto;
}

 .example .show{
 height:200px;
 width:850px;
 margin-top:0px;
 padding-top:50px;
 overflow:hidden;
 }
</style>

Нет, всё верно указано. Картинки и размеры в CSS, указанные вами, идентичны. Дело в том, что в вашем примере (вариант 2) обрезание происходит точно так, просто там полупрозрачный по краям png использован (деченка с цветами) и там это не так бросается вглаза. Вариант на моем сайте иной, там jpg на вес размер картинки сплошной. Хотя, у вас глаз более наметанный, можете взглянуть сами (вдруг я что то не учел по неопытности?): http://smuta.forumgrad.ru/

Вот я и спрашиваю, можно ли какой то друго эффект туда влупить вместо такого обрезания? Например, размытие плавное или как то так?

Так там все картинки кроме передней обрезаются, так и должно быть.

А можно сделать уменьшения без обрезания?

@Смех пишет:А можно сделать уменьшения без обрезания?

Да легко. Ищите автора этого слайдера и просите его это сделать.
Я то просто выложил сюда этот скрипт, я его не писал.

@Смех пишет:А можно сделать уменьшения без обрезания?

Можно. Попробуйте добавить в стили следующее.

Код:


.size img {
 width: 95%;
 height: 95%;
}


ну и соответственно перед первой картинкой подключить

Код:

<div class="size">

а после последней поставить

Код:

</div>

У меня этот способ работает. Просто 95% надо изменить под тот процент который будет красиво вписывать картинку.

Вот полный стиль если что:

Код:


<style>
.roundabout-holder{
padding: 10px;
height: 10em;
width: 90%;
margin: 0 auto;
}
 .roundabout-moveable-item {
height:200px;
 width:151px;
 cursor:pointer;
 background:transparent;
 border:1px solid #999; 
 border:1px solid #999;
 overflow:hidden;
 }
 .roundabout-in-focus{
cursor:auto;
}

 .example .show{
 height:200px;
 width:850px;
 margin-top:0px;
 padding-top:50px;
 overflow:hidden;
 }
.size img {
 width: 95%;
 height: 95%;
}
</style>


ну и соответственно перед первой картинкой подключить

Код:

<div class="size">

а после последней поставить

Код:

</div>