how to hold(and show) the current 'a' element when you put 'history.back()' that you clicked just a moment ago

Question

in this page http://api.jquery.com/category/effects/

when you put 'up'(keyboard) and 'down',then put 'enter',it will go to the current url,

and when you put 'backspace'

it will always show the same 'li' element you put 'enter'.

how to set this.

this is my code:

        shortcut.add("up",function(e) {


            var a=$('#start > div:first-child');
            var b=$('#start > div.live')[0];
            var c=$('#start > div:last-child');
            if(b==a[0]){
                b=$(b);
                b.removeClass('live');
                c.addClass('live');
                b=c;
                }
            else if(b){
                b=$(b);
                b.removeClass('live');
                b.prev().addClass('live');
            }
            else{
                b=$(b);
                a.addClass('live')
            }

        //
        var a=$('#start > div.live a')[0];
                a.focus();
                a.focus(function(){
                    this.parent().parent().addClass('live');
                    })
        //
        var currentHeight = b.outerHeight(), offset = b.prev().offset();
        //alert(currentHeight+'          '+offset.top)
var _targetScrollTop  = Math.round( offset.top - currentHeight - ($(window).height()/3) );
//$('html,body').animate({ scrollTop: _targetScrollTop }, 100);
$('html,body').scrollTop(_targetScrollTop);
            //
            });

        shortcut.add("down",function(e) {
            var a=$('#start > div:first-child');
            var b=$('#start > div.live')[0];
            var c=$('#start > div:last-child');

            if(c[0]==b){
                b=$(b);
                b.removeClass('live');
                a.addClass('live');
                }
                else if(b){
                    b=$(b);
                    b.removeClass('live');
                b.next().addClass('live');
            }else{
                a.addClass('live');
            }

            //
            var a=$('#start > div.live a')[0];
                a.focus();
                a.focus(function(){
                    this.parent().parent().addClass('live');
                    })
            //
            if(!b)return;
            var currentHeight = b.outerHeight(), offset = b.next().offset();
            //alert(currentHeight+'            '+offset.top)
var _targetScrollTop  = Math.round( offset.top - currentHeight - ($(window).height()/3) );
//$('html,body').animate({ scrollTop: _targetScrollTop }, 100);
$('html,body').scrollTop(_targetScrollTop);
            //
            }) 
        }

Answer 1

Javascript doesn't work across different web page.

You need to pass parameter like #up #down or something like that to the url.

You may interest jQuery's history plugin

http://plugins.jquery.com/project/history

Answer 2

• Set an onclick event on the links (or just override those links entirely) so Javascript can set a cookie with the HTML ID or jQuery selector of the link being clicked.
• Check for that cookie and if it exists, add whatever effect you wanted.

This will only work when the user follows those links though, and they have to be within your domain (i.e., navigation menus). Also, if the same list exists on the page it followed, it will be highlighted there unless you make each ID unique throughout the entire site - that could get messy.

Also - sounds like you're using keyboard navigation through the links. I'm not sure all the major browsers accept "enter" as a "click" for onclick events. You might need an onkeypress in there as well.

(also note: I haven't dealt with Javascript cookies in years, so there might be issues I'm completely forgetting.)