Question

我有一个响应式菜单，想按条件展开/折叠，我的问题是双重的：

我可以在菜单属性更改时获取活动吗？ f.e。：attr是 aria-expanded ，好的，所以函数为$('#ID').on('aria-expanded-changed')
我可以用css更改菜单的位置吗？当单击按钮展开它时，菜单显示在顶部，徽标图像位于顶部。我可以更改位置并将其放在徽标的底部吗？

由于

Answer 1

我用事件jQuery解决了我的问题。首先，当您单击按钮以展开菜单时，检查导航是否展开;如果它是假的，将菜单X像素移到底部，其他边缘= 0 px

$('#button').click(function() {
    var expanded = $('#nav_sup').attr('aria-expanded');
    (expanded == 'false') ? $('#ul_nav').css('margin-top', '120px') : $('#ul_nav').css('margin-top', '0px');
});

另一个要点是，当调整窗口大小时，重置选项：

$(window).on('resize', function(){
    $('#nav_sup').removeClass('in');
    $('#nav_sup').attr('aria-expanded', 'false')
    $('#ul_nav').css('margin-top', '0px');
});

此刻，作品......

Aria扩展菜单响应

1 个答案: