2015-06-03 1 views
2

У меня проблема с относительными размерами контейнера слайдера в IE11 (Jssor 18.0).Jssor Slider - Относительные размеры вызывают ошибку в IE11

HTML-структура:

  • Там же внешний DIV с абсолютных размеров (ширина и высота в пикселях).
  • Существует внутренний div, тот, для которого создан слайдер, с относительными размерами (width = height = 100%).

Слайдер хорошо работает в Firefox 38 и Chrome 43. В IE11 происходит следующая ошибка (ну - любой IE, я попытался IE9, IE10 и IE11):

Не можете масштабировать jssor ползунок, «измерение 'внешнего контейнера' недействительны. Укажите «размерность» в пикселях. например 'dimension: 600px;' '

С полными размерами ползунок работает одинаково во всех браузерах.

Вопрос в том, можно ли использовать относительные размеры контейнера слайдера в IE11?

CSS и HTML:

.npw-banner { 
 
     width: 720px; 
 
     height: 480px; 
 
    } 
 
    .npw-banner .npw-slider-container { 
 
     width: 100%; 
 
     height: 100%; 
 
    }
<!-- outer div with absolute dimensions --> 
 
    <div class="npw-banner"> 
 
     <!-- slider div with relative dimensions --> 
 
     <div id="banner_slider_container" class="npw-slider-container"> 
 
      <div class="npw-slides" u="slides">...</div> 
 
      <div u="navigator" class="npw-navigator">...</div> 
 
     </div> 
 
    </div>

Вот fiddle.

+0

Пожалуйста, всегда указывать 'ширина/height' в пикселе. – jssor

ответ

2

Jssor Slider requries ширина/высота, указанная в пикселях. Подробнее см. Документацию - http://www.jssor.com/development/reference-ui-definition.html.

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

Пример:

var $container = $("#" + containerId); 

var containerWidth = $container.width(); 
var containerHeight = $container.height(); 

$container.width(containerWidth); 
$container.height(containerHeight);