Панель меню JQuery с плавающей вершиной

Question

Я пытаюсь заставить строку меню постоянно плавать в верхней части браузера, поэтому, когда они прокручивают страницу вниз, строка меню остается в верхней части.

Как я могу поступить так?

С уважением,

Answer 1

Тэг CSS position: fixed; заставит его остаться в том же положении на экране, даже если прокрутить.Используйте это, а затем поместите его с top/right/bottom/left, как показано ниже.z-index повлияет на то, как высоко он «сложен».То есть элемент с z-index, равным 1, будет находиться ниже элемента с z-index, равным 100.

div.float {
    position: fixed;
    top: 10px;
    left: 25px;
    z-index: 9001;
}

jsfiddle.net ранее не работал, но он снова работает.Вот пример плавающего меню, которое статично, пока вы не прокрутите до определенной точки: http://jsfiddle.net/2rhrc/

Answer 2

Вы можете сделать это, используя свойство CSS position.Например:

#menu {
  height: 50px;
  left: 0;
  position:fixed;
  top: 0;
}

Ссылки:

• http://www.w3schools.com/cssref/pr_class_position.asp
• http://www.quirksmode.org/css/position.html

Первое место, где я заметил, что это эффективно используется, находится на сайте Perldoc.Если вам нужно прокрутить, элемент #content_header использует комбинацию CSS и JS, чтобы сохранить элемент видимым на странице.

• http://perldoc.perl.org/index.html