Плавно превъртане до закотвяне с помощта на javascript
Със сигурност сте виждали подобен ефект на други целеви страници. Днес ще научите как да го приложите.
Плавно превъртане до закотвяне с помощта на javascript
В един от проектите просто задачата беше да се приложи подобен ефект с плавно превъртане до определен елемент при щракване върху един от елементите на менюто.
Нека започнем, като свържем библиотеката jquery към нашия проект и напишем пътя до скрипта, който отговаря за гладкото превъртане:
Справих се с това. Сега трябва да поставите етикети и котви, към които ще се извърши превъртане.
Ще използвам за пример менюто, което беше в проекта за наемане на професионална техника за строителни и почистващи дейности. Ето неговия изходен код:
Както можете да видите, всичко е стандартно и без трикове. На площадката по-късно бяха направени блокове, съответстващи на менюто. Предоставяха специфична услуга. Беше необходимо да се направи плавен преход към тези блокове.
За да навигирате до желаното място на сайта, достатъчно е да добавите връзка към идентификатора на желания блок. Нека го направим.
Сега трябва да зададете идентификаторите "почистване", "изграждане", "действия" на съответните блокове. При мен изглеждаше така:
Обърнете внимание на атрибута name="cleaning". Трябва да съответства на ID. Ето и самия скрипт:
Ако, като мен, трябва да внедрите превъртане до множество елементи, тогава просто поставете идентификаторите така и това е! много удобен начин илесен за изпълнение.Не твърдя, че е най-добрият, но работи. Ако някой може да го опрости, съкрати или подобри по някакъв начин, ще съм ви много благодарен. Що се отнася до мен, този ефект може да бъде полезен за мнозина.
Моля, обърнете внимание, че в началото на статията посочихме името и пътя на скрипта, както следва:
Тоест, трябва да създадете папка в корена на вашия сайт, наречена js и да поставите файл, наречен perehod.js в нея. И вече вмъкнете кода на скрипта в него. Това съм аз, за всеки случай. Изведнъж някой не разбира.
И за днес това е всичко. Сега знаете как да приложите такъв готин ефект като плавно превъртане на страницата до котвата. Чао на всички!