Question

我有点分页大菜单 - 用户在面板中一次看到12个项目。

右边的菜单，在这里：http://bartlettstudio.com/

单击“更多项目”并从第二个面板中选择一个链接时，您可以看到我的问题。

以此为例：http://bartlettstudio.com/projects/dog-named-lucky/

当您在该页面上时，侧边栏菜单将恢复为第一个面板，您无法分辨出您所在的菜单项。您需要单击“更多项目”以查看“Dog Named Lucky”菜单项。

问题

任何人都可以帮我弄清楚如何解决这个问题吗？其他人已经提到过使用jQuery hashchange，但事实证明这是我的想法。谁能想到另一种方法来解决这个问题？

非常感谢

特里

Answer 1

可以更改项目链接以使其中包含href，例如：

 <a href="#more-1" class="next">More Projects</a>

然后接下来onClick你可以在jQuery中做这样的事情：

jQuery(function ($) {

    if(window.location.hash) {
        // onLoad hash was detected
        console.log('onLoad hash detected // do something to position menu');

        // window.location.hash starts with a # following with the string behind it
        // window.location.hash.slice(1) gets the string only
    }


    // This isn't needed but quessing you already have an onClick set up for this element...
    $('a.next').click(function (e) {
        /* 
        Don't do e.preventDefault()! The browser will add the href hash value itself if you only specified the hash!
        If you want to preventit you will have to set the hash yourself like this:

        window.location.hash = 'more-1';
        */

        // do stuff, possibly with the href value since you have it anyway


        // I reccommend that you change the value of the href to specify the next hash value change
        $(this).attr('href', '#more-2');
    });

});

jQuery - 记住页面更改时的菜单位置

1 个答案: