<!-- html -->
<img src="main.png" id="mainImg">
<img src="" data-src="notmain1.png" class="notmain">
<img src="" data-src="notmain2.png" class="notmain">
<img src="" data-src="notmain3.png" class="notmain">
/*** javascript ***/
$("#mainImg").load(function() {
$(".notmain").attr('src', function() {
return $(this).attr("data-src");
});
});
Пишу одну аппликуху на JS
$(el).off('mouseenter.my_name_space');
<div class="carousel">
<div class="wrap">
<div class="item-1"></div>
<div class="item-2"></div>
<div class="item-3"></div>
</div>
</div>
.carousel {
width: 300px;
border: 1px solid red;
}
.wrap {
white-space: nowrap;
}
.wrap > div {
vertical-align: middle;
display: inline-block;
width: 300px;
}
.item-1 {
height: 250px;
background: red;
}
.item-2 {
height: 350px;
background: blue;
}
.item-3 {
height: 300px;
background: green;
}