как установить синюю границу в середине, как на сайте JQuery - PullRequest
Новая
       21

как установить синюю границу в середине, как на сайте JQuery

0 голосов
/ 09 марта 2010

На этой странице: http://api.jquery.com/category/effects/

когда вы положили 'вверх' или 'вниз',

синяя рамка всегда в середине экрана,

Как мне это сделать?

У меня есть библиотека горячих клавиш: http://www.openjs.com/scripts/events/keyboard_shortcuts/

спасибо

1 Ответ

2 голосов
/ 09 марта 2010

  1. Перехватить событие keyup и проверить код ключа.

  2. Если код ключа равен 40, тогда добавьте класс (с установленным стилем границы) к первому элементу li.

  3. При следующем keyup удалите класс из предыдущего элемента li и добавьте в следующий или предыдущий li в соответствии со значением кода ключа. Если код клавиши равен 40 (стрелка вниз), добавьте класс к следующему элементу li. Если код ключа 38 (стрелка вверх), добавьте класс к предыдущему элементу li.

Что-то вроде 

var currentFocusedElem = null;
        $(function(){
            $(document).keyup(function(e){
                if ( currentFocusedElem == null )
                {
                    currentFocusedElem = $("#ul1 li:first-child");
                }
                else
                {
                    currentFocusedElem.removeClass("blueborder");

                    if ( e.keyCode === 40 )
                    {
                        currentFocusedElem = currentFocusedElem.next("li");
                    }
                    else if ( e.keyCode === 38 )
                    {
                        currentFocusedElem = currentFocusedElem.prev("li");
                    }
                }

                currentFocusedElem.addClass ( "blueborder" );
            });
        });

Кроме того, вам нужно будет проверить первый элемент и последний элемент и выполнить соответствующее действие.

...