Положение меню перепутано в DNN 6 - PullRequest
1 голос
/ 13 сентября 2011

В моем модуле DNN есть несколько кнопок изображений, которые отображают подменю при нажатии. Абсолютная позиция меню рассчитывается с использованием JavaScript, как и ожидалось. Это работало хорошо до сих пор (в DNN4 и DNN5). Но мы заметили проблему в DNN6. Положение меню отключено на значительное количество пикселей (вероятно, пару сотен). Поскольку я не написал код расчета и не являюсь экспертом JS, я не могу понять, как DNN6 влияет на него. Вот функция:

function AbsolutePosition(obj) {
        var pos = null;
        if(obj != null) {
            pos = new Object();
            pos.top = obj.offsetTop;
            pos.left = obj.offsetLeft;
            pos.width = obj.offsetWidth;
            pos.height= obj.offsetHeight;
            obj = obj.offsetParent;
            while(obj != null) {
                pos.top += obj.offsetTop;
                pos.left += obj.offsetLeft;
                obj = obj.offsetParent;
            }
        }
return(pos);
}

Я хотел бы понять, как на этот код может повлиять структура родительской страницы - потому что изменение скина не имело никакого значения. Это как-то связано с организацией элементов страницы.

Редактировать: И я также ищу предложения относительно любых модификаций кода, которые я мог бы попробовать.

Любой вклад приветствуется! Спасибо.

1 Ответ

4 голосов
/ 14 сентября 2011

Это связано с тем, как работает абсолютное позиционирование.Когда элемент абсолютно позиционирован, его положение (обозначенное элементами top и left в приведенном выше коде) относительно его ближайшего предка со стилем position либо relative, либо absolute.В DNN 6 для модулей-оболочек теперь указано position: relative (которое новое меню действий использует для позиционирования).Также могут быть некоторые похожие изменения для новой панели управления (если меню не в модуле).

Вы можете попробовать этот скрипт, который останавливает лазание по дереву, если позиция элемента absolute илиrelative:

function AbsolutePosition(obj) {
    if (!obj) {
        return null;
    }

    var pos = {
        top: obj.offsetTop,
        left: obj.offsetLeft,
        width: obj.offsetWidth,
        height: obj.offsetHeight
    },
    positionsToStopAt = {
        relative: true,
        absolute: true
    };

    obj = obj.offsetParent;
    while(obj && !positionsToStopAt[jQuery(obj).css('position')]) {
        pos.top += obj.offsetTop;
        pos.left += obj.offsetLeft;
        obj = obj.offsetParent;
    }

    return pos;
}
...