将切换与另一个功能相关联

Question

我在将切换函数与另一个涉及更改 css 'position' 属性的函数组合时遇到问题。

我有一个起始页，顶部有一个菜单，下面有几列图片。一些列高于 window 并且它们可以与菜单一起向下滚动（都在 position: absolute）。

然而，当您从菜单中单击一个项目时，列会隐藏，而另一组图片会出现（由单击+切换功能触发）。这个新集是水平的，这次我需要菜单不滚动。

所以我想做的是 根据切换状态将菜单的位置从绝对位置更改为固定位置。

起初我尝试在我的点击函数中包含一个 if/else 语句，但 'else' 部分从未起作用。现在我正在尝试使用切换的回调属性，但我似乎也无法使其工作......我能做的最好的事情就是将菜单的位置切换到固定位置，但它仍然存在那样。

无效的尝试之一：

function fixMenu(){
    ('.menu').css('position','fixed')};

function freeMenu(){
    ('.menu').css('position','absolute')};




$("#menu_item").click(function(){

$("#horizontal_set").toggle(1000,fixMenu);
$(".column").toggle(1000,freeMenu);

   });

我不知道我的问题是出在语法上还是我需要一个完全不同的解决方案。请赐教:-)

非常感谢

PS：我画了两个小草图，但似乎不允许我分享它们:-(我希望我的问题仍然可以理解。

Answer 1

试试这个：

它通过 if-statement 检查 horizontal_set 或 column 是否可见。并调用正确的函数作为结果。

function fixMenu(){
    $('.menu').css('position','fixed')};

function freeMenu(){
    $('.menu').css('position','absolute')};




$("#menu_item").click(function(){

    $("#horizontal_set").toggle(1000);
    $(".column").toggle(1000);

    if ( $( "#horizontal_set" ).is( ":visible" ) && $( ".column" ).is( ":hidden" ) )
    {
        fixMenu();
    }
    else
    {
        freeMenu();
    }


});

Answer 2

您在函数中忘记了 jQuery 选择器。尝试：

function fixMenu() {
   $('.menu').css('position','absolute');
}

将切换与另一个功能相关联

Associate toggle with another function

javascript

jquery

scroll

click

toggle