Много было про то написано, да не суть…
Озадачился следующей задумкой: перетаскиваемый слой с фиксированным положением на экране, страница скролица — слой остаётся на месте. Как известно данная задумка на ура воплощается в FF, Opera, Google Chrome, но вот IE интеллигентно послал мою задумку в свою мусорную корзинку — при скролинге передвинутый слой сползал вместе со страницей.
Надо сказать, что варианты с вёрсткой, высотой 100% и т.п., подробно описанные в сети мне не подошли, потому как требовалась универсальность, чтобы слой мог юзаться с любыми дизайнами.
В итоге выбор пал на expression, что в данной ситуации вполне оказалось логичным. Прочитав все возможные доки по данной реализации пришёл к нескольким ключевым умозаключениям:
1. Перед объявлением
2. Юзается следующая CSS конструкция в фиксируемом слое:
3. Фильтры позволяют избавиться от подёргиваний фиксируемого слоя в IE:
Заметил совершенно случайно.
А теперь самое главное. Конструкция вполне себе стандартная, работает пока слой не переносится мышкой, после переноса — способность к фиксации пропадает. Может это уже кем-то сделано или где нибудь описано, в таком случае я просто плохо искал, но выход пришлось копать самому, вот как получилось…
Вместо равнения на топ скролинга, при котором слой постоянно остаётся на одной и той же абсолютной позиции, я стал подсовывать экспрешену значение отступа из cookie, в которых оно сохранялось при перетаскивании:
Слой остаётся зафиксированным даже после перетаскивания. Посмотреть рабочую демку
Озадачился следующей задумкой: перетаскиваемый слой с фиксированным положением на экране, страница скролица — слой остаётся на месте. Как известно данная задумка на ура воплощается в FF, Opera, Google Chrome, но вот IE интеллигентно послал мою задумку в свою мусорную корзинку — при скролинге передвинутый слой сползал вместе со страницей.
Надо сказать, что варианты с вёрсткой, высотой 100% и т.п., подробно описанные в сети мне не подошли, потому как требовалась универсальность, чтобы слой мог юзаться с любыми дизайнами.
В итоге выбор пал на expression, что в данной ситуации вполне оказалось логичным. Прочитав все возможные доки по данной реализации пришёл к нескольким ключевым умозаключениям:
1. Перед объявлением
<DOCTYPE ...> ставится любой пустой HTML-комментарий, валидатор на это не жалуется, а эксплорер перестаёт воспринимать этого доктайпа объявление. Это избавит от многих проблем.2. Юзается следующая CSS конструкция в фиксируемом слое:
position:fixed; _position:absolute; top:0; _top:expression( eval(document.body.scrollTop) + 'px' );3. Фильтры позволяют избавиться от подёргиваний фиксируемого слоя в IE:
if (document.body.filters) true;Заметил совершенно случайно.
А теперь самое главное. Конструкция вполне себе стандартная, работает пока слой не переносится мышкой, после переноса — способность к фиксации пропадает. Может это уже кем-то сделано или где нибудь описано, в таком случае я просто плохо искал, но выход пришлось копать самому, вот как получилось…
Вместо равнения на топ скролинга, при котором слой постоянно остаётся на одной и той же абсолютной позиции, я стал подсовывать экспрешену значение отступа из cookie, в которых оно сохранялось при перетаскивании:
_top:expression( Math.round(my_class_cookies.get('POSY')) + Math.round(offsetParent.scrollTop) + 'px' );my_class_cookies.get('POSY') — метод JavaScript класса, который просто забирает значение из куков. После всех манипуляций код выглядел примерно так:Слой остаётся зафиксированным даже после перетаскивания. Посмотреть рабочую демку
