Хочу написать свой велосипед на jquery - листалку картинок, и, возможно, другого контента - текста, видео.
Требование к разметке, соответственно, такое
<div id="slider">
<div class="slider-item"><img src="1.jpg"></div>
<div class="slider-item"><img src="2.jpg"></div>
<div class="slider-item"><img src="3.jpg"></div>
</div>
Возник на первый взгляд абсурдный вопрос: как должен определяться размер плагина - пользователем или по содержимому?
В первом случае будет что-то вроде
$('#slider').superSlider({
width: 800,
height: 600 //по-умолчанию можно и то и то в 100%
})
.slider-item
width: 100%
height: 100%
.slider-item img
max-width: 100%
А во втором
var $slider = $('#slider');
var maxWidth = 0;
$('.slider-item img').each(function(i, element){
if ($(element).outerWidth > maxWidth) {
maxWidth = $(element).outerWidth;
}
$slider.css('width', maxWidth);
})