IE iframe виджет и jQuery перетаскивание проблема выравнивания - PullRequest
1 голос
/ 11 октября 2011

Я создал небольшой виджет, используя jQuery UI и плагины перетаскивания.Теперь я нахожу некоторые проблемы с IE.

Этот виджет может быть доступен по адресу - http://widget.adipa.com. По этому URL виджет хорошо работает с IE7 / 8.

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

enter image description here

Как видно здесь, между A и E он имеет пробел.

Вы можете проверить виджет в iframe здесь и без iframe здесь .

Шаги для воспроизведения ошибки -

  • На виджете первой страницы - введите «Adipa» в первом текстовом поле и нажмите «Следующий шаг».

  • На второй странице, в дизайне, который показан посередине,дважды щелкните любой алфавит, чтобы удалить его.

  • Просто перетащите любой алфавит из списка алфавитов на левой стороне.Перетащите эту плитку алфавита в свободное место в дизайне.

Вышеописанные шаги хорошо работают с IE без iframe и не с виджетом IE iframe.

Это потому, что IE рендеритдела обстоят иначе с iframe и без iframe или это проблема с jQuery.Кажется, что jQuery делает немало хаков для поддержки IE.

Спасибо.

1 Ответ

1 голос
/ 15 октября 2011

Я протестировал ваш виджет, и на самом деле он выглядит так, будто при перетаскивании буквы и ее отбрасывании появляется пробел (даже в IE9, в котором я тестировал).это настройка, и это заставит IE отображать пробелы иначе, чем в других браузерах.Например, следующий html:

<span style="border: 1px solid black">a </span>

(обратите внимание на пробел после буквы 'a').Это будет отображаться по-разному в IE по сравнению, например, с Firefox, поскольку IE также отображает пространство.Однако, чтобы это исчезло, измените тип документа для вашего документа;в настоящее время я думаю, что мы должны пойти с HTML5 (, как обсуждает г-н Ресиг ):

<!DOCTYPE html>

Это переведет браузер в стандартный режим и сделает исчезновение пространства.

Другая возможность - отредактировать ваш HTML и удалить ВСЕ пробелы в вашем элементе ...... Отстой, я знаю:)

В любом случае, надеюсь, это поможет!

...