Примери за JQuery - Фиксирани елементи на потребителския интерфейс
Една от популярните модерни тенденции в уеб дизайна са фиксираните елементи на страницата. Такива елементи са особено полезни, когато се комбинират с друга модерна тенденция в уеб дизайна - вертикално оформление на страницата, тоест когато всички раздели на страницата са подредени вертикално. Тези страници могат да бъдат доста големи и може да е трудно за превъртане.
Фиксирано меню за навигация
Например, много е удобно да използвате главното меню, което е фиксирано на екрана, когато страницата се премести надолу. В същото време, ако страницата слезе доста далеч, тогава подобно меню може да бъде истинско спасение.
В тази статия ще разгледаме меню за навигация, което автоматично ще се появи на дадена страница, ако е превъртано надолу достатъчно далеч. Ние ще внедрим такова меню, използвайки технологията jQuery.
Има невероятно събитие за превъртане в jQuery, което определя в кой момент започва превъртането на даден блок или на документа като цяло.
Нека разгледаме пример за използване на това събитие:
В този случай превъртането реагира на превъртането на страницата и при всяко появяване на това събитие променя свойството css в горната част на навигационната лента на стойността на позицията на горната част на страницата спрямо прозореца на браузъра с помощта на scrollTop () действие.
По този начин фиксираната навигационна лента е готова. За всяка стойност на превъртане на страницата панелът винаги ще бъде в горната част.
Нека усложним нашия пример и да зададем началната позиция на навигационната лента. Сега задачата е да се определи позицията на този панел само ако превъртането достигне определено място в документа.