Как заставить чтобы параметр обновлялся?
 

Как заставить чтобы параметр slideWidth обновлялся при изменении размеров окна браузера в карусельном слайдере http://bxslider.com/?

Сделал как указанно на http://bxslider.com/examples/reload-slider-settings там пример перезагрузки всего слайдера, слайдер вроде как перегружается но параметр slideWidth не обновляется.

Еще пояснение параметр slideWidth должен указыватся в пикселах, я поставил вычисление размера по размеру самого элемента, чтобы можно было сделать этот параметр более гибким, вот так сделал: slideWidth: $( '#front-portfolio .front-item' ).width(),

сам код активации карусельного слайдера:

var slider = $( '#front-portfolio' ).bxSlider({
wrapperClass: 'bx-wrapper-portfolio',
slideWidth: $( '#front-portfolio .front-item' ).width(),
minSlides: 1,
maxSlides: 4,
slideMargin: 0,
infiniteLoop: false,
hideControlOnEnd: true,
adaptiveHeight: true,
pager: true
});
$( window ).on( 'resize', function() {
console.log( 'slider' );
slider.reloadSlider();
});

Подскажите как заставить обновлятся парамерт slideWidth при изменении размеров окна.

Alexsher,
так укажите параметры в reloadSlider

Пробовал не срабатывает :)

Alexsher,
покажите что вы пробовали

var slider = $( '#front-portfolio' ).bxSlider({
wrapperClass: 'bx-wrapper-portfolio',
slideWidth: $( '#front-portfolio .front-item' ).width(),
minSlides: 1,
maxSlides: 4,
slideMargin: 0,
infiniteLoop: false,
hideControlOnEnd: true,
adaptiveHeight: true,
pager: true
});
$( window ).on( 'resize', function() {
console.log( 'slider' );
slider.reloadSlider({
wrapperClass: 'bx-wrapper-portfolio',
slideWidth: $( '#front-portfolio .front-item' ).width(),
minSlides: 1,
maxSlides: 4,
slideMargin: 0,
infiniteLoop: false,
hideControlOnEnd: true,
adaptiveHeight: true,
pager: true
});
});

Alexsher,
ok макет бы конечно -- может ширина того что меряите неизменяется ?

для примера -- перемещайте разделитель в песочнице
http://learn.javascript.ru/play/tRWMr

меняется, если к примеру поставить перезагрузку страницы при изменении окна браузера вместо перезагрузки слайдера, все нормано меняется, но согласитесь перезагрузка всей страницы не есть хорошо, смысл моих манипуляций заставить работать на планшетах - там же частенько для удобства просмотра переворачивается устройство, но также и на компьютерах иногда меняют размер окна браузера...

Alexsher,
непонял ничего -- всё что понял в примере выше

да если поставить в логе
console.log( $( '#front-portfolio .front-item' ).width() );

то по логу получается что размер не меняется... как сделать обновление контейнера "#front-portfolio" ?


я имел ввиду если сделать перезагрузку целиком страницы тогда размер меняется и соответственно слайдер тоже обновляется

$( window ).on( 'resize', function( event ) {
this.location.reload( true );
});

Alexsher,
в примере всё меняется без перезагрузки -- зачем она нужна только вам известно - так меряйте то что изменяется -- продолжаю не понимать в чём ваша проблема