шкала raphael VML правый/нижний зазор

Я использую Scaleraphael http://www.shapevent.com/scaleraphael/, который позволяет использовать svg/VML для изменения размера, когда пользователь изменяет размер браузера (гибкий макет - у меня он масштабируется до того же размера, что и div на странице).

Он отлично работает с браузерами SVG, и хотя он работает в IE8/7/6 (VML), по какой-то странной причине справа есть пробел. Я думаю, что это связано с размером координат группы VML, но это всего лишь предположение.

Разрыв появляется только при определенной ширине браузера (около 40 пикселей). например, ширина браузера: 1060, 1104, 1144, 1186, 1230. Максимальный разрыв составляет около 20 пикселей и снова уменьшается до 0 при каждом изменении ширины пикселя, пока ширина браузера не станет следующей в последовательности, где она снова отображается как 20 пикселей.

Если я использую инструменты разработчика в IE, я вижу, что группа vml включает пробел, как и должно быть, но содержимое моей статьи не заполняет его - поэтому я думаю, что это связано с coordsize

Просто интересно, была ли у кого-нибудь еще такая же проблема (если нет, вы, вероятно, не поймете мой вопрос, так как его очень сложно объяснить)


javascript raphael vml
person Jason    schedule 18.03.2013    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Некоторое время назад я создал свой собственный скрипт, чтобы сделать холст Рафаэля «отзывчивым». И да, я также столкнулся с пробелами в IE7-8, которые сводили меня с ума. Однако мои пробелы были постоянными. Теперь мой скрипт работает нормально. Если вам нужен простой адаптивный размер, вам не нужен плагин для этого:

var _browser = {};
_browser.ie = userAgent.indexOf("msie") > -1 ? {} : false;
if(_browser.ie)
    _browser.ie.old = (navigator.userAgent.match(/MSIE [6-8]/) !== null);


if(_browser.ie && _browser.ie.old){

    _data.R = Raphael('conainerID', _data.options.width, _data.options.height);

    $(window).on('resize', function(){
          var w = $('#containedID').width();
          var h = $('#containedID').height();
         _data.R.setSize(w,h);
    });

}else{
    _data.R = Raphael('conainerID', '100%', '100%');    
}

Для этого вам нужно будет создать контейнер для жидкости. Не устанавливайте для него фиксированную ширину; но вы можете установить некоторую «максимальную ширину», чтобы ограничить ее масштабирование:

<div id="containerID" style="max-width: 1200px;"></div>
person Roman    schedule 18.03.2013
comment
должен ли этот скрипт также масштабировать содержимое rapahael svg/vml? - person Jason; 19.03.2013
comment
он автоматически масштабирует svg/vml при изменении размера окна. Также для этого скрипта требуется jQUery. - person Roman; 20.03.2013