用JavaScript动态设置CSS:attr之前

时间:2018-09-06 20:16:54

标签: css attr

我需要通过javascript函数动态更改 css类 left 属性。

.mega-dropdown-menu:before {
    content: "";
    border-bottom: 15px solid #fff;
    border-right: 17px solid transparent;
    border-left: 17px solid transparent;
    position: absolute;
    top: -15px;
    left: **attr(data-left px)**;
    z-index: 10;
}

function DropDownHover() {
    try {
        $(".dropdown").hover(
            function () {
                $('.dropdown-menu', this).not('.in .dropdown-menu').stop(true, true).slideDown("400");
                $(this).toggleClass('open');
                var objChevron = $(this).find(".fa-chevron-down");
                if (objChevron.length >0) {
                    var offset = $(this).find(".fa-chevron-down").offset();
                    var offsetBefore = offset.left - 273;
                    $('.mega-dropdown-menu').attr('data-left', offsetBefore);
                }
            },
            function () {
                $('.dropdown-menu', this).not('.in .dropdown-menu').stop(true, true).slideUp("400");
                $(this).toggleClass('open');
            }
        );
    } catch (err) { alert(err.message); }
}

在执行过程中,我得到像素数,并且 data-left 设置为 div ,但是偏移量未应用于 left 属性。

Chrome inspector screenshot

我还尝试了 attr(左侧数据) attr(左侧数据),它们的结果相同。

我想念什么?

1 个答案:

答案 0 :(得分:0)

Afaik,您只能对attr()属性使用content语法。

为什么不去

$('.mega-dropdown-menu').css('left', offsetBefore+'px');