Как сделать плавающее меню?

Question

Я хочу, чтобы достичь что-то вроде меню: http://craigsworks.com/projects/qtip2/tutorials/

Everytime вы прокрутите вниз на странице конкретного меню DIV всегда остается на вершине.

Любая страница справочной или справочной ссылки, хорошо оценена.

Вот скриншоты:

http://www.pokoot.com/menu.png

www.pokoot.com/menu2.png

Answer 1

Вы можете зафиксировать положение элемента с помощью CSS. Например,

#floatingMenu { 
    position: fixed; 
    top: 0px; 
} 

будет держать #floatingMenu в верхней части страницы в любое время. Затем, если вы хотите имитировать их, где панель меню фиксированной позиции не отображается до тех пор, пока вы не прокрутите страницу после какой-либо точки, вы можете сделать примерно следующее:

$docBody = $(document.body); 
$docBody.scroll(function() { 
    // replace 100 with whatever the non-floating menu bar's distance from the top of the page is 
    if ($docBody.scrollTop() < 100) { 
     $('#floatingMenu ').hide(); 
    } else { 
     $('#floatingMenu ').show(); 
    } 
});