Как да си направим плавно превъртане за целия сайт с помощта на JQuery и CSS

Поздрави, скъпи приятели. Както може би сте забелязали, че почти всички браузъри превъртане на уебсайтове е много остър и красива. И разбира се искам да преминете към вашия сайт по-гладко, разбира се, че може да се направи, а също и силно, за да не се напряга. Това се прави с помощта на проста JQuery плъгин и няколко правила, CSS. И, за да видите как работи предлагам да погледнете в демонстрацията, която се намира по-долу.







Как да си направим плавно превъртане за целия сайт с помощта на JQuery и CSS

Ι Demo Download

Сега, нека да преминем по налагане на запор върху гладко скролиране на нашия уебсайт.

На първо място, ние трябва да прикрепите JQuery библиотеката. Ако сте я вече прикрепени, пропуснете тази стъпка:

След това, ние трябва да се прикрепя JQuery плъгин, който е отговорен за нашето гладко скролиране, а заедно с него да дойде някои CSS правила, които променят много лента за превъртане на сайта. Прочетете повече за сметка на лентата за превъртане ще бъдат обсъдени по-подробно в следващия урок, и засега единствено плавно превъртане. Но самите правила и плъгина:







Всичко. Сега първата и важна стъпка, която сте го направили. Сега ние трябва да се добави едно просто правило в CSS стилове на нашия уебсайт.

Необходимо е да се изясни, за да ни плъгин, който се простираше на ширината на страницата, и е 100% по височина. Не забравяйте да добавите това правило за CSS друго превъртане няма да работи.

След като сте добавили всичко, което е представено по-горе, трябва да включва самия скрипт, който приложен vyshe.Eto е много проста, само трябва да добавите желателно преди затварянето в края на кода на сайта:

А сега предлагам да се анализира подробно демо пример. И ние ще започнем с HTML.

HTML демо

Сега нека да разгледаме правилата на CSS.

CSS от демото

правила CSS също са много прости и не са много, както можете да видите, че има фиксирани шрифтове от Google, за да се визуално демо изглеждаше красиво.

Ι Demo Download

Това е в общи линии всички приятели. Сега имаме един сайт с хладно и красива гладко скролиране, което ние и нашите потребители могат да се насладят. Този скрипт е взето тук. Но има и превъртете направена за отделни джаджи, които все повече и променят лентата за превъртане. За лентите ще говорим само в следващия урок. Но сега всичко дотук.