Проблема с плавной сменой картинки

[lersen]

Дорогие форумчане!

 

Пытаюсь сделать плавную смену одной картинки другой. Использую JQuery. Всё вроде ничего, но почему-то вторая картинка "не понимает", что находится в ячейке. Подозреваю, что это из-за position:absolute;. 

 

Подскажите, как обойти этот момент. 

http://jsfiddle.net/LBRSg/

.image.first,.image.second {margin:0;padding:0;}.image.first {opacity:1px;display:block;position:absolute;/z-index:100;transition-duration:0.96s;-webkit-transition-duration:0.96s;-moz-transition-duration:0.96s;-o-transition-duration:0.96s;-ms-transition-duration:0.96s;}.image.first:hover {opacity:0.00;} div.ImgField {display:inline-block;background-position:center center;background-repeat:no-repeat;margin:0;padding:0;}

<table cellpadding="0" cellspacing="10" border="0" width="100%" align="center">	<tr>		<td width="20%" align="center">			<div class="ImgField"><a href="#">				<img class="image first" src="http://www.instech.kiev.ua/images/sale_20_11_13.jpg" width="100%" style="border: 1px solid #936C0B;">				<img class="image second" src="http://www.instech.kiev.ua/images/sale_20_11_13.jpg" width="100%" style="border: 1px solid #936C0B;">			</a></div>		</td>	</tr></table>

[Zverushka]

Что не так в примере по ссылке? Как должно быть?

[lersen]

Что не так в примере по ссылке? Как должно быть?

Проблема в том, что первая картинка слишком большая. Она должна быть такая же, как и вторая.

На сайте используется резинка, так что все размеры только в процентах...

[npofopr]

Пытаюсь сделать плавную смену одной картинки другой. Использую JQuery.

Что то я не вижу там jquery.

Наверно для .ImgField надо задать position: relative; чтобы от него пляски начинались?

 

А зачем вообще там таблица?

 

В сети же полно готовых, нормальных решений

http://www.sdws.ru/topic.php?t=3&id=20

http://wmdn.ru/javascript/smooth-changing-rotate-images-script-on-jquery/

Резина, это не повод задавать width:100% для картинок, картинки тогда должны быть достойного размера.

[Z1gnet]

ну именно в вашем случае нужно задать .ImgField{position:relative;} и все будет норм.