Jan 16, 2008
IE6, Sortable и whatever:hover
Как подружить whatever:hover и Scriptaculous
Работая над одним сайтом, столкнулся с одной проблемой: в IE6 при использовании whatever:hover для выпадающего меню, построенного чисто на CSS, и Scriptaculous (а именно, Sortable, причем для элемента, не имеющего никакого отношения к меню) возникало непонятное мерцание.
Страница, на которой проявляется мерцание (только IE6).
То, что "виноват" именно Scriptaculous, доказывается очень легко: в исходном тексте test.html комментируется строка, создающая Draggable:
[-]
View Code Javascript
var user_id = 5060;
var id = 'user_' + user_id;
if ($(id)) {
Sortable.create(
$(id),
{
}
);
}
var id = 'user_' + user_id;
if ($(id)) {
Sortable.create(
$(id),
{
}
);
}
Результат можно увидеть здесь — мерцание исчезло.
Путём долгих и нудных экспериментов были найдены строки, вызывающие такое поведение:
[-]
View Code Javascript
var Draggables = {
drags: [],
observers: [],
register: function(draggable) {
if(this.drags.length == 0) {
this.eventMouseUp = this.endDrag.bindAsEventListener(this);
this.eventMouseMove = this.updateDrag.bindAsEventListener(this);
this.eventKeypress = this.keyPress.bindAsEventListener(this);
Event.observe(document, "mouseup", this.eventMouseUp);
Event.observe(document, "mousemove", this.eventMouseMove
drags: [],
observers: [],
register: function(draggable) {
if(this.drags.length == 0) {
this.eventMouseUp = this.endDrag.bindAsEventListener(this);
this.eventMouseMove = this.updateDrag.bindAsEventListener(this);
this.eventKeypress = this.keyPress.bindAsEventListener(this);
Event.observe(document, "mouseup", this.eventMouseUp);
Event.observe(document, "mousemove", this.eventMouseMove