Как сделать так, чтобы RaphaelJS выравнивал текст по вертикали для Chrome / Firefox против IE 7 и 8?

Я думал, что RaphaelJS должен быть таким же, когда это Chrome / Firefox и в IE 7 и 8?

Пример на

http://jsfiddle.net/8UPhS/1/

Текст центрируется по вертикали в Chrome и Firefox, но в IE 7 и 8 базовая линия текста вместо этого центрируется (так что это на несколько пикселей выше, чем в FF)... Есть ли способ заставить их всех вести себя одинаково?

(желательно не использовать обнаружение браузера и корректировать текст на несколько пикселей ниже для IE 7 и 8, поскольку это не такое чистое решение)

(в IE 9 по какой-то причине изображение вообще не отображается, даже если с помощью Developer Tool изменить режим Compat на IE 7 или 8... но если я делаю это в IE 9, используя отдельную страницу, связывающую raphael.js на том же сайте index.htmlтогда я получаю худшую ситуацию из всех: иногда я получаю одно поведение, иногда я получаю другое поведение, наугад... это выглядит почти как состояние гонки)

(для IE 9 эту страницу можно использовать:

http://try-raphael-text.heroku.com/
http://try-raphael-text.heroku.com/raphael20.html

вторая ссылка использует Raphael 2.0 на ветке GitHub's Raphael 2.0

версия 2.0 на самом деле работает в IE 7 для выравнивания по вертикали, но в IE 8 текст не отображается... он хорошо работает в IE 9, используя этот простой случай... но на нашей реальной странице он может привести к сбою IE 9 иногда)

1 ответ

Решение

Это известная ошибка в Raphael 1.5.2 [1]. Я бы предпочел обнаружение функций по сравнению с обнаружением браузера, чтобы обойти эту ошибку? Рафаэль предоставляет свойство с именем svg (true|false). Посмотрите на мой пример: http://jsbin.com/iwudu5/edit.

[1] https://github.com/DmitryBaranovskiy/raphael/issues/86

Другие вопросы по тегам