ΠΡΡΡΠΈΠ΅ jQuery ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΈ JavaScript ΡΠ΅ΡΠ΅Π½ΠΈΡ 2016 Π³ΠΎΠ΄Π° / jQuery ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΈ JavaScript ΡΠ΅ΡΠ΅Π½ΠΈΡ / ΠΠΎΡΡΠΎΠ²ΠΎΠΉ
10 Π»Π΅Ρ Π½Π°Π·Π°Π΄, ΠΊΠΎΠ³Π΄Π° jQuery ΡΠΎΠ»ΡΠΊΠΎ Π·Π°ΡΠΎΠΆΠ΄Π°Π»Π°ΡΡ, Π±ΡΠ°ΡΠ·Π΅ΡΠ½Π°Ρ ΡΠΊΠΎΡΠΈΡΡΠ΅ΠΌΠ° Π±ΡΠ»Π° ΠΎΡΠ΅Π½Ρ ΡΠ°Π·Π½ΠΎΡΠ΅ΡΡΡΠ½ΠΎΠΉ ΠΈ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΈΠ· ΡΡΡΠ΅ΡΡΠ²ΠΎΠ²Π°Π²ΡΠΈΡ ΡΠΎΠ³Π΄Π° ΠΏΡΠΎΠ΄ΡΠΊΡΠΎΠ² ΠΏΠΎ ΡΠ²ΠΎΠ΅ΠΌΡ Π±ΠΎΡΠΎΠ»ΡΡ ΡΠΎ ΡΠ»ΠΎΠΆΠ½ΠΎΡΡΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ DOM-ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ. ΠΠΌΠ±ΠΈΡΠΈΠΎΠ·Π½ΠΎΠΉ Π·Π°Π΄Π°ΡΠ΅ΠΉ, ΠΊΠΎΡΠΎΡΡΡ ΠΏΠΎΡΡΠ°Π²ΠΈΠ»ΠΈ ΠΏΠ΅ΡΠ΅Π΄ ΡΠΎΠ±ΠΎΠΉ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ jQuery, Π±ΡΠ»Π° ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠ° ΡΠ½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ΄Ρ ΠΎΠ΄Π° ΠΊ ΡΠ΅ΡΠ΅Π½ΠΈΡ ΡΡΠΈΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌ ΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ API, ΠΊΠΎΡΠΎΡΡΠΉ Π±Ρ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎ Ρ ΠΎΡΠΎΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π» Π² Π»ΡΠ±ΠΎΠΉ ΡΠΈΡΡΠ°ΡΠΈΠΈ.
ΠΠ°ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΈΠΌ ΡΡΠΎ ΡΠ΄Π°Π»ΠΎΡΡ ΡΡΠ΄ΠΈΡΡ Π²Π°ΠΌ, Π½ΠΎ ΡΠΏΡΡΡΡ 10 Π»Π΅Ρ ΡΠ²ΠΎΠ΅Π³ΠΎ ΡΡΡΠ΅ΡΡΠ²ΠΎΠ²Π°Π½ΠΈΡ, jQuery ΠΎΡΡΠ°Π΅ΡΡΡ ΠΎΠ΄Π½ΠΎΠΉ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ JavaScript.
Π‘Π°ΠΌ JavaScript ΡΠ΅ΠΉΡΠ°Ρ ΡΠΎΠ²Π΅ΡΡΠ΅Π½Π½ΠΎ Π·ΡΠ΅Π»ΡΠΉ ΠΏΡΠΎΠ΄ΡΠΊΡ, Ρ ΠΎΡΠΎΡΠΎ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΠΌΡΠΉ Π²ΡΠ΅ΠΌΠΈ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌΠΈ Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌΠΈ. Π‘ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΠ½ΠΎΠ΅ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎ ΡΠΎΠΆΠ΅ Π±ΠΎΠ»Π΅Π΅ ΠΊΠΎΠ½ΡΠΎΠ»ΠΈΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΎ ΠΈ, Π² Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²Π΅ ΡΠ»ΡΡΠ°Π΅Π², ΠΌΠΎΠΆΠ½ΠΎ Π±ΡΡΡ ΡΠ²Π΅ΡΠ΅Π½Π½ΡΠΌ, ΡΡΠΎ Π΅ΡΠ»ΠΈ, ΡΠΊΠ°ΠΆΠ΅ΠΌ, ΡΡΡΠ°Π½ΠΈΡΠ° ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π² Crome, ΡΠΎ ΡΠ°ΠΊ ΠΆΠ΅ ΠΎΠ½Π° Π±ΡΠ΄Π΅Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΠΈ Π² Firefox.
ΠΠ°Π·Π°Π»ΠΎΡΡ Π±Ρ, ΠΈΡΡΠΎΡΠΈΡ ΡΠ°Π·Π²ΠΈΡΠΈΡ jQuery Π΄Π²ΠΈΠΆΠ΅ΡΡΡ ΠΊ Π·Π°ΠΊΠ°ΡΡ β Π·Π°ΡΠ΅ΠΌ ΠΏΠ΅ΡΠ΅Π³ΡΡΠΆΠ°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ ΡΡΠ°ΡΠΈΡΡ Π»ΠΈΡΠ½ΠΈΠ΅ ΡΠΈΠΊΠ»Ρ ΠΏΡΠΎΡΠ΅ΡΡΠΎΡΠ°, Π΅ΡΠ»ΠΈ Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²ΠΎ Π·Π°Π΄Π°Ρ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΅ΡΠΈΡΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΡΠΌΠΈ ΡΡΠ΅Π΄ΡΡΠ²Π°ΠΌΠΈ ΡΠ·ΡΠΊΠ°? Π‘ Π΄ΡΡΠ³ΠΎΠΉ ΡΡΠΎΡΠΎΠ½Ρ, Π·Π° ΡΠ°ΠΊΠΎΠΉ Π΄ΠΎΠ»Π³ΠΈΠΉ Π΄Π»Ρ ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ½ΠΎΠΉ ΠΈΠ½Π΄ΡΡΡΡΠΈΠΈ ΠΏΠ΅ΡΠΈΠΎΠ΄ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π½ΠΎ ΠΎΠ³ΡΠΎΠΌΠ½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΡΠ΅ΡΠ΅Π½ΠΈΠΉ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠΎΡΡΠΎ Π²Π·ΡΡΡ ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ, Π·Π΄Π΅ΡΡ ΠΈ ΡΠ΅ΠΉΡΠ°Ρ.
Π― Π΄ΡΠΌΠ°Ρ, ΡΡΠΎΡ Π²ΡΠ±ΠΎΡ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π΄Π΅Π»Π°ΡΡ ΡΠ°ΠΌ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊ Π² ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΠΎΠΉ ΡΠΈΡΡΠ°ΡΠΈΠΈ ΠΎΡΠΈΠ΅Π½ΡΠΈΡΡΡΡΡ Π½Π΅ Π½Π° ΠΌΠΎΠ΄Ρ ΠΈ ΡΠ΅Π½Π΄Π΅Π½ΡΠΈΠΈ, Π° Π½Π° Π·Π΄ΡΠ°Π²ΡΠΉ ΡΠΌΡΡΠ» ΠΈ ΠΏΠ΅ΡΡΠΏΠ΅ΠΊΡΠΈΠ²Ρ ΡΠ°Π·Π²ΠΈΡΠΈΡ ΡΠ²ΠΎΠ΅Π³ΠΎ ΡΠ²ΠΎΡΠ΅Π½ΠΈΡ.
Π ΡΡΠΎΠΌ ΠΎΠ±Π·ΠΎΡΠ΅ Ρ ΡΠΎΠ±ΡΠ°Π» Π²ΡΠ΅ ΠΈΠ·Π²Π΅ΡΡΠ½ΡΠ΅ ΠΌΠ½Π΅ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery
multiscroll.js
ΠΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ ΠΏΡΠΈΠ²Π»Π΅ΡΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΏΠΎΡΠ΅ΡΠΈΡΠ΅Π»Ρ β ΡΠΊΡΠΎΠ»Π»ΠΈΠ½Π³ ΡΡΡΠ°Π½ΠΈΡΡ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ Π² Π²ΠΈΠ΄Π΅ Π΄Π²ΡΡ ΠΏΠ°Π½Π΅Π»Π΅ΠΉ, ΠΎΠ΄Π½Π° ΠΈΠ· ΠΊΠΎΡΠΎΡΡΡ ΡΠΊΠΎΠ»ΡΠ·ΠΈΡ Π²Π²Π΅ΡΡ , Π° Π²ΡΠΎΡΠ°Ρ Π²Π½ΠΈΠ·, ΠΎΡΠΊΡΡΠ²Π°Ρ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ Π±Π»ΠΎΠΊ. Π’Π°ΠΊΠΆΠ΅ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π½Π° Π²ΡΠ΅Ρ , Π΄Π°ΠΆΠ΅ Π²Π΅ΡΡΠΌΠ° ΡΡΡΠ°ΡΠ΅Π²ΡΠΈΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ .jquery.email-autocomplete.js
ΠΠ»Π΅ΠΊΡΡΠΎΠ½Π½ΡΠ΅ Π°Π΄ΡΠ΅ΡΠ° ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡΡΡ Π²Π²ΠΎΠ΄ΠΈΡΡ ΠΎΡΠ΅Π½Ρ ΡΠ°ΡΡΠΎ ΠΈ, Π½Π΅ΡΠΌΠΎΡΡΡ Π½Π° ΡΠΎ, ΡΡΠΎ ΡΡΠΎ Π²ΡΠ΅Π³ΠΎ Π»ΠΈΡΡ ΠΏΠΎΠ»ΡΠΎΡΠ° Π΄Π΅ΡΡΡΠΊΠ° ΡΠΈΠΌΠ²ΠΎΠ»ΠΎΠ², ΡΠ°ΡΡΠΎ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ ΠΆΠ΅Π»Π°Π½ΠΈΠ΅ ΡΡΠΊΠΎΡΠΈΡΡ ΡΡΠΎΡ ΠΏΡΠΎΡΠ΅ΡΡ. jquery.email-autocomplete.js ΠΈΠΌΠ΅Π΅Ρ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ Π΄ΠΎΠΌΠ΅Π½ΠΎΠ² ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ ΠΏΠΎΡΡΠΎΠ²ΡΡ ΡΠ΅ΡΠ²ΠΈΡΠΎΠ² Π½Π° ΠΎΡΠ½ΠΎΠ²Π°Π½ΠΈΠΈ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ ΠΎΠ½ ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ Π°Π²ΡΠΎΠ΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ Π°Π΄ΡΠ΅ΡΠ°. ΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΌΠΎΠΆΠ΅Ρ ΠΏΡΠΈΠ½ΡΡΡ ΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ, Π½Π°ΠΆΠ°Π² ΠΊΠ»Π°Π²ΠΈΡΡ Tab ΠΈΠ»ΠΈ ΡΡΡΠ΅Π»ΠΊΡ Π²ΠΏΡΠ°Π²ΠΎ, ΠΈΠ»ΠΈ ΠΆΠ΅ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠΈΡΡ Π²Π²ΠΎΠ΄ΠΈΡΡ Π΄Π°Π»ΡΡΠ΅ Π²ΡΡΡΠ½ΡΡ. ΠΠ»Π°Π³ΠΈΠ½ Ρ ΠΎΡΠΎΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΈ Π² ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ Π²Π΅ΡΡΠΈΡΡ ΡΠ°ΠΉΡΠ°. ΠΠ΄Π½Π°ΠΊΠΎ, ΠΏΡΠΈΠ΄Π΅ΡΡΡ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π΄ΠΎΠΏΠΈΠ»ΠΈΡΡ ΠΏΠ»Π°Π³ΠΈΠ½, ΡΡΠΎΠ±Ρ ΠΎΠ½ Π½Π°ΡΠ°Π» ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ ΠΎΡΠ΅ΡΠ΅ΡΡΠ²Π΅Π½Π½ΡΠΌΠΈ ΠΏΠΎΡΡΠΎΠ²ΡΠΌΠΈ ΡΠ΅ΡΠ²ΠΈΡΠ°ΠΌΠΈ.Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
10 jQuery ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΡΠ»ΠΎΠΆΠ½ΠΎΡΡΠΈ ΠΏΠ°ΡΠΎΠ»Ρ
tinyDatePicker
Π 5 ΠΊΠ ΡΡΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π° Π²ΡΠΈΡΠ½ΡΡΡ Π½Π΅ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ. ΠΠ°Π»Π΅Π½Π΄Π°ΡΠΈ, ΠΏΠ»Π°Π½ΠΈΡΠΎΠ²ΡΠΈΠΊΠΈ, Π±ΡΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠΎΠ²Π°ΡΠΎΠ² ΠΈ ΡΡΠ»ΡΠ³ β Π΄Π°Π»Π΅ΠΊΠΎ Π½Π΅ ΠΏΠΎΠ»Π½ΡΠΉ ΠΏΠ΅ΡΠ΅ΡΠ΅Π½Ρ, Π³Π΄Π΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ tinyDatePicker. ΠΡΡΡΡΡΠΉ, Π»Π΅Π³ΠΊΠΈΠΉ, ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΡΠ΅ΠΌΡΠΉ β Π΅Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π»Π΅Π³ΠΊΠΎ ΠΈΠ½ΡΠ΅Π³ΡΠΈΡΠΎΠ²Π°ΡΡ Π² Bootstrap ΠΈΠ»ΠΈ Π»ΡΠ±ΠΎΠΉ Π΄ΡΡΠ³ΠΎΠΉ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊ.Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
jQuery ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠΎΡΠΌ Π΄Π»Ρ ΡΠΊΠ°Π·Π°Π½ΠΈΡ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ ΠΈ Π΄Π°ΡΡ
Push.js
ΠΡΠΎΡΡ-Π±ΡΠ°ΡΠ·Π΅ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΠΉ Π½Π° ΡΠ°Π±ΠΎΡΠ΅ΠΌ ΡΡΠΎΠ»Π΅.ReadRemaining.js
ΠΠ½ΠΎΠ³ΠΈΠΌ ΠΈΠ· Π½Π°Ρ Π²ΡΠ΅Π³Π΄Π° ΠΊΠ°ΡΠ°ΡΡΡΠΎΡΠΈΡΠ΅ΡΠΊΠΈ Π½Π΅ Ρ Π²Π°ΡΠ°Π΅Ρ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ. Π― Π²ΡΠ΅Π³Π΄Π° Π·Π°Π²ΠΈΠ΄ΠΎΠ²Π°Π» Π»ΡΠ΄ΡΠΌ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΌΠ΅ΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ ΠΈΠΌ ΡΠ°ΡΠΏΠΎΡΡΠΆΠ°ΡΡΡΡ. ΠΠ°Π²Π΅ΡΠ½ΠΎΠ΅, ΠΊ ΡΠ°ΠΊΠΈΠΌ ΠΎΡΠ½ΠΎΡΠΈΡΡΡ Π°Π²ΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½Π° ReadRemaining.js. ΠΠΎΠΌΡ ΠΆΠ΅ Π΅ΡΠ΅ ΠΌΠΎΠ³Π»Π° ΠΏΡΠΈΠΉΡΠΈ Π² Π³ΠΎΠ»ΠΎΠ²Ρ ΠΌΡΡΠ»Ρ Π²ΡΠ²Π΅ΡΡΠΈ ΡΡΠ΄ΠΎΠΌ Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ ΠΎ ΡΠΎΠΌ, ΡΠΊΠΎΠ»ΡΠΊΠΎ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ Π²Π°ΠΌ ΠΏΠΎΠ½Π°Π΄ΠΎΠ±ΠΈΡΡΡ, ΡΡΠΎΠ±Ρ ΠΏΡΠΎΡΠΈΡΠ°ΡΡ Π΅Π³ΠΎ. Π ΠΏΠΎ ΠΌΠ΅ΡΠ΅ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ ΡΠ΅ΠΊΡΡΠ° ΠΏΠ΅ΡΠ΅ΡΡΠΈΡΡΠ²Π°ΡΡ ΡΡΠΎ Π²ΡΠ΅ΠΌΡ, ΠΎΡΠ½ΠΎΠ²ΡΠ²Π°ΡΡΡ Π½Π° ΡΠΊΠΎΡΠΎΡΡΠΈ ΡΡΠ΅Π½ΠΈΡ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ.ΠΠ΅ΡΡΠΌΠ° ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΊΠΎΡΠΎΡΡΠΉ, Ρ Π΄ΡΠΌΠ°Ρ, ΠΏΠΎΠ½ΡΠ°Π²ΠΈΡΡΡ ΠΏΠΎΡΠ΅ΡΠΈΡΠ΅Π»ΡΠΌ, Π΅ΡΠ»ΠΈ Ρ Π²Π°Ρ ΠΌΠ½ΠΎΠ³ΠΎ Π΄Π»ΠΈΠ½Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠΎΠ²ΠΎΠ³ΠΎ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»Π°.
Tooltipster
ΠΠ»Π°ΡΡΠΈΡΠ΅ΡΠΊΠ°Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° (tooltip) Ρ Π±ΠΎΠ»ΡΡΠΈΠΌ Π½Π°Π±ΠΎΡΠΎΠΌ ΡΡΠ½ΠΊΡΠΈΠΉ ΠΈ ΠΎΠΏΡΠΈΠΉ. Π‘Π°ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΌΠΎΠΆΠ΅Ρ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ Π³Π΄Π΅ ΡΠ³ΠΎΠ΄Π½ΠΎ ΠΏΠΎ ΠΎΡΠ½ΠΎΡΠ΅Π½ΠΈΡ ΠΊ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ ΠΊΠ°ΠΊΠΈΠ΅ ΡΠ³ΠΎΠ΄Π½ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ. ΠΠ»Π°Π²Π½ΠΎΠ΅, Π½Π΅ ΠΏΠ΅ΡΠ΅Π±ΠΎΡΡΠΈΡΡ Ρ Π΅Π³ΠΎ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ΠΌ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π΅Π³ΠΎ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ°ΠΌ Π³Π΄Π΅ ΡΡΠΎ Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ.TableExport.js
ΠΠ΄Π΅ΡΡ Π²ΡΠ΅ ΡΡΠ½ΠΎ ΠΈΠ· Π½Π°Π·Π²Π°Π½ΠΈΡ. ΠΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΡΠΎΡΡΠΎ ΠΈ Π±ΡΡΡΡΠΎ ΠΊΠΎΠ½Π²Π΅ΡΡΠΈΡΠΎΠ²Π°ΡΡ HTML-ΡΠ°Π±Π»ΠΈΡΡ Π² ΡΠ°ΠΉΠ» Exel, CSV ΠΈΠ»ΠΈ ΠΎΠ±ΡΡΠ½ΡΠΉ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΠΉ. ΠΠ»Ρ ΡΠ°Π±ΠΎΡΡ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ FileSaver.js.Addel
ΠΠ΅ΡΠΌΠΎΡΡΡ Π½Π° ΡΠΎΠ·Π²ΡΡΠ½ΠΎΠ΅ Π½Π°Π·Π²Π°Π½ΠΈΠ΅, ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ Π½ΠΈΠΊΠ°ΠΊΠΎΠ³ΠΎ ΠΎΡΠ½ΠΎΡΠ΅Π½ΠΈΡ ΠΊ ΠΏΠ΅Π²ΠΈΡΠ΅ ΠΠ΄Π΅Π»Ρ. ΠΠ³ΠΎ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ ΠΎΡ Π°Π½Π³Π»ΠΈΠΉΡΠΊΠΈΡ ΡΠ»ΠΎΠ² ADd-DELete (Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΈ ΡΠ΄Π°Π»ΠΈΡΡ) ΠΈ ΠΎΡΡΠ°ΠΆΠ°Π΅Ρ Π΅Π³ΠΎ Π½Π°Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ β Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ ΠΈΠ»ΠΈ ΡΠΊΡΡΠ²Π°ΡΡ HTML-ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, Π² ΠΏΠ΅ΡΠ²ΡΡ ΠΎΡΠ΅ΡΠ΅Π΄Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΎΡΠΌ. Π£ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ Π³ΠΈΠ±ΠΊΠΎΠ΅ ΠΈ ΠΈΠ½ΡΡΠΈΡΠΈΠ²Π½ΠΎ ΠΏΠΎΠ½ΡΡΠ½ΠΎΠ΅.Chart.js
ΠΠΊΡΠΈΠ²Π½ΠΎ ΡΠ°Π·Π²ΠΈΠ²Π°ΡΡΠΈΠΉΡΡ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΠΉ Π²ΡΠ²ΠΎΠ΄ΠΈΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠΈΠΏΡ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌ (Π²ΡΠ΅Π³ΠΎ 8 ΡΠΈΠΏΠΎΠ², Π² ΡΠΎΠΌ ΡΠΈΡΠ»Π΅ ΡΠΌΠ΅ΡΠ°Π½Π½ΡΠ΅). ΠΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π½Π° Π²ΡΠ΅Ρ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ ΠΈ ΠΈΠΌΠ΅Π΅Ρ ΠΏΠ»Π°Π²Π½ΡΡ ΠΈ ΡΠΈΠΌΠΏΠ°ΡΠΈΡΠ½ΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΠΏΡΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ Π΄Π°Π½Π½ΡΡ .Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
JavaScript Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΊΡΡΠ³ΠΎΠ²ΡΡ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌ
jQuery Flip-Quote
ΠΡΠ΅Π½Ρ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ Π΄Π΅Π»Π°Π΅Ρ Π΄Π²Π΅ Π²Π΅ΡΠΈ. ΠΠΎ-ΠΏΠ΅ΡΠ²ΡΡ , Π²ΡΠ°ΡΠ°Π΅Ρ Π±Π»ΠΎΠΊΠΈ ΡΠΈΡΠ°Ρ, ΠΏΡΠΈΡΡΡΡΡΠ²ΡΡΡΠΈΠ΅ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅, Π² ΡΠΎΡ ΠΌΠΎΠΌΠ΅Π½Ρ ΠΊΠΎΠ³Π΄Π° Π±Π»ΠΎΠΊ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π²ΠΈΠ΄ΠΈΠΌΡΠΌ (ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°Π΅Ρ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅). ΠΠΎ-Π²ΡΠΎΡΡΡ , ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° ΡΡΠΎΡ Π±Π»ΠΎΠΊ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΊΠ° ΡΠΈΡΠ°ΡΡ Π² ΡΠ΅ΠΊΡΡΠ΅, ΡΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π±ΡΡΡΡΠΎ Π½Π°ΠΉΡΠΈ Π΅Π΅ Π² ΠΎΠ±ΡΠ΅ΠΌ ΠΏΠΎΡΠΎΠΊΠ΅ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»Π°. ΠΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ, ΡΠΈΡΠ°ΡΡ ΡΠΎΠΆΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°ΡΡ Π·Π°Π½ΠΈΠΌΠ°ΡΠ΅Π»ΡΠ½ΡΠΌΠΈ!Algolia Places
ΠΡΡΡΡΡΠΉ ΠΏΠΎΠΈΡΠΊ Ρ Π°Π²ΡΠΎΠ΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ΠΌ ΠΏΠΎΡΡΠΎΠ²ΡΡ Π°Π΄ΡΠ΅ΡΠΎΠ², Π³ΠΎΡΠΎΠ΄ΠΎΠ², ΠΌΠ°ΡΡΡΡΡΠΎΠ² ΠΈ Π²ΡΠ΅Π³ΠΎ, ΡΡΠΎ ΡΠ²ΡΠ·Π°Π½ΠΎ Ρ Π»ΠΎΠΊΠ°ΡΠΈΡΠΌΠΈ ΠΏΠΎ Π²ΡΠ΅ΠΌΡ ΠΌΠΈΡΡ Π±Π»Π°Π³ΠΎΠ΄Π°ΡΡ ΠΈΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΠΈ Ρ Π±Π°Π·ΠΎΠΉ Π΄Π°Π½Π½ΡΡ OpenStreetMap. ΠΡΠ΅Π½Ρ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΈΠ½ΡΠ΅ΡΠ½Π΅Ρ-ΠΌΠ°Π³Π°Π·ΠΈΠ½ΠΎΠ².HideSeek
ΠΡΠΎΡΡΠΎΠΉ, Π½ΠΎ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Β«ΠΆΠΈΠ²ΠΎΠ³ΠΎΒ» ΠΏΠΎΠΈΡΠΊΠ°. Π£ΠΌΠ΅Π΅Ρ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡ ΠΏΠΎΠΈΡΠΊ, ΠΎΡΠ½ΠΎΠ²ΡΠ²Π°ΡΡΡ Π½Π° ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΠΊΡΠΈΡΠ΅ΡΠΈΡΡ , Π²ΡΠΏΠΎΠ»Π½ΡΡΡ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΠ΅ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ ΠΏΠΎΡΠ»Π΅ Π½Π°Ρ ΠΎΠΆΠ΄Π΅Π½ΠΈΡ ΠΈΡΠΊΠΎΠΌΡΡ Π΄Π°Π½Π½ΡΡ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅.Timedropper
Π‘ΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΠΎΠ³ΡΠΎΠΌΠ½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΡΠ΄ΠΎΠ±Π½ΡΡ ΡΠ΅ΡΠ΅Π½ΠΈΠΉ Π΄Π»Ρ Π²Π²ΠΎΠ΄Π° ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ ΠΌΠΎΠΌΠ΅Π½ΡΠ° Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ. ΠΠ΄Π½Π°ΠΊΠΎ Timedropper Π²ΡΠ΄Π΅Π»ΡΠ΅ΡΡΡ ΡΡΠ΅Π΄ΠΈ Π½ΠΈΡ ΠΏΡΠΎΡΡΠΎΡΠΎΠΉ ΠΈ Π»Π΅Π³ΠΊΠΈΠΌ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ. ΠΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ°ΡΠΎΠ² ΠΈ ΠΌΠΈΠ½ΡΡ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ ΡΡΠΎΠ³ΠΎ Π·Π°Π±Π°Π²Π½ΠΎΠ³ΠΎ ΡΠ·ΡΡΠΊΠ° Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ΄ΠΎΠ±Π½ΠΎ. ΠΠ½ ΠΈΠΌΠ΅Π΅Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ, ΡΠ°ΠΊΠΈΡ ΠΊΠ°ΠΊ: ΡΠΎΡΠΌΠ°Ρ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ (12 ΠΈΠ»ΠΈ 24-ΡΠ°ΡΠΎΠ²ΠΎΠΉ), ΡΠ²Π΅Ρ ΡΠΈΡΠ΅ΡΠ±Π»Π°ΡΠ°, ΡΠ΅ΡΡΠ°, ΡΠΎΠ½Π°, Π° ΡΠ°ΠΊΠΆΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΈΡ ΡΠ°ΡΠΎΠ² ΠΈ ΠΌΠΈΠ½ΡΡ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ ΠΊΠΎΠ»Π΅ΡΠΈΠΊΠ° ΠΌΡΡΠΈ. ΠΡΡΠ°ΡΠΈ, ΠΈΠΌΠ΅Π΅ΡΡΡ Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π·Π°Π΄Π°Π½ΠΈΡ Π΄Π°ΡΡ.Leaflet.js
ΠΠ°Π½ΠΈΠΌΠ°Ρ Π²ΡΠ΅Π³ΠΎ 33 ΠΊΠ, ΡΡΠ° Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π²ΡΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ, Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΠ΅ Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ Ρ ΠΊΠ°ΡΡΠ°ΠΌΠΈ, Π² ΡΠΎΠΌ ΡΠΈΡΠ»Π΅ ΠΈ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ .Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
Π‘Π΅ΡΠ²ΠΈΡΡ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΡ ΠΊΠ°ΡΡ
Lory
Π‘Π»Π°ΠΉΠ΄Π΅Ρ, Π½Π°ΠΏΠΈΡΠ°Π½Π½ΡΠΉ Π½Π° ΡΠΈΡΡΠΎΠΌ JavaScript. ΠΠΈΠ½ΠΈΠΌΠ°Π»ΠΈΡΡΠΈΡΠ΅ΡΠΊΠΈΠΉ, Π½ΠΎ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΠΈΠΉ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΠΆΠ΅ΡΡΠ°ΠΌΠΈ, Π·Π°Π΄Π°Π½ΠΈΠ΅ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΡΠΏΡΠ°Π²Π»ΡΡΡΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ²-ΠΊΠ½ΠΎΠΏΠΎΠΊ ΠΈ ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠ΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, Π² ΡΠΎΠΌ ΡΠΈΡΠ»Π΅ ΡΠ°Π·Π½ΠΎΠΉ ΡΠΈΡΠΈΠ½Ρ.CurrencyFormatter.js
ΠΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΠ΅Π½ΡΠΊΠΈΠΉ ΠΈ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΠΉ ΡΠΊΡΠΈΠΏΡ, Π²ΡΠΏΠΎΠ»Π½ΡΡΡΠΈΠΉ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΡΠΈΡΠ»ΠΎΠ²ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ Π² Π΄Π΅Π½Π΅ΠΆΠ½ΠΎΠΌ ΡΠΎΡΠΌΠ°ΡΠ΅. ΠΠΎΠ±Π°Π²Π»ΡΠ΅Ρ ΡΠΎΡΠΊΠΈ, ΠΏΡΠΎΠ±Π΅Π»Ρ Π΄Π»Ρ ΡΠ°Π·Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΠ°Π·ΡΡΠ΄ΠΎΠ² ΠΈ ΡΠΈΠΌΠ²ΠΎΠ» Π²Π°Π»ΡΡΡ. ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ 155 Π²Π°Π»ΡΡ ΠΌΠΈΡΠ°.ARc
Π‘Π²ΠΎΠ΅ΠΎΠ±ΡΠ°Π·Π½ΡΠΉ ΡΠ°Π±Π»ΠΎΠ½ Π΄Π»Ρ ΠΏΡΠΎΠ΅ΠΊΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠΎΠ² Π² ΡΡΠΈΠ»Π΅ Atomic Design.egjs
ΠΠ΅Π±ΠΎΠ»ΡΡΠΎΠΉ Π½Π°Π±ΠΎΡ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΡ ΠΈ Π½Π΅ΠΎΠ±ΡΡΠ½ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ, ΠΏΠΎΡΡΡΠΎΠ΅Π½Π½ΡΡ Π½Π° jQuery.Shave.js
Javascript, ΠΊΠΎΡΠΎΡΡΠΉ Π°ΠΊΠΊΡΡΠ°ΡΠ½ΠΎ ΠΎΠ±ΡΠ΅ΠΆΠ΅Ρ ΡΠ΅ΠΊΡΡ, Π½Π΅ ΠΏΠΎΠΌΠ΅ΡΠ°ΡΡΠΈΠΉΡΡ Π² ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ Π·Π°Π΄Π°Π½Π½ΠΎΠΉ Π²ΡΡΠΎΡΡ. ΠΠ°Π½ΠΈΠΌΠ°Π΅Ρ Π²ΡΠ΅Π³ΠΎ 1,5 ΠΊΠ ΠΈ Π½Π΅ ΡΡΠ΅Π±ΡΠ΅Ρ ΡΡΠΎΡΠΎΠ½Π½ΠΈΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ.jQuery Linechart
ΠΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° Π΄Π»Ρ ΠΏΠΎΡΡΡΠΎΠ΅Π½ΠΈΡ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ Π²ΠΈΠ΄ΠΎΠ² ΠΈ Π΄ΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ Π±ΠΎΠ»ΡΡΠΈΠΌ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎΠΌ ΠΈΡΡ ΠΎΠ΄Π½ΡΡ Π΄Π°Π½Π½ΡΡ . ΠΠ°ΠΏΠΈΡΠ°Π½ Π½Π° HTML/CSS/JS, ΠΎΠ΄Π½Π°ΠΊΠΎ Π΅ΡΡΡ Π²Π΅ΡΡΠΈΡ ΠΈ Π½Π° Π±Π°Π·Π΅ Angular.jsTabulator
ΠΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ°Π±Π»ΠΈΡ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ Π² ΡΡΠ΅ΠΉΠΊΠ°Ρ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ΅ΠΊΡΡ, Π½ΠΎ ΠΈ Π³ΡΠ°ΡΠΈΠΊΠΈ, Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΡ, Π·Π²Π΅Π·Π΄Π½ΡΠΉ ΡΠ΅ΠΉΡΠΈΠ½Π³, Π²ΡΠΏΠ°Π΄Π°ΡΡΠΈΠ΅ ΡΠΏΠΈΡΠΊΠΈ ΠΈ ΠΏΡ.baguetteBox.js
ΠΠ°ΠΏΠΈΡΠ°Π½Π½ΡΠΉ Π½Π° ΡΠΈΡΡΠΎΠΌ JavaScript lightbox Ρ Ρ ΠΎΡΠΎΡΠ΅ΠΉ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΎΠΉ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ² ΠΈ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ ΠΆΠ΅ΡΡΠ°ΠΌΠΈ.Freewall
ΠΠ΅Π²Π΅ΡΠΎΡΡΠ½ΠΎ ΠΊΡΠ°ΡΠΈΠ²ΡΠΉ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΏΠ»ΠΈΡΠΎΡΠ½ΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ° Π² ΡΠ°ΠΌΡΡ ΡΠ°Π·Π½ΡΡ ΡΡΠΈΠ»ΡΡ : Windows Metro, Pinterest, ΠΎΠ±ΡΡΠ½ΠΎΠΌ ΠΏΠ»ΠΎΡΠΊΠΎΠΌ ΠΈΠ»ΠΈ ΠΈΠ΅ΡΠ°ΡΡ ΠΈΡΠ΅ΡΠΊΠΎΠΌ, Ρ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π΅ΠΌΡΠΌΠΈ ΠΈ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΠΌΡΠΌΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ. ΠΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΊΠ°ΠΊ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ , ΡΠ°ΠΊ ΠΈ Π½Π° Π΄Π΅ΡΠΊΡΠΎΠΏΠ½ΡΡ , Π²ΠΊΠ»ΡΡΠ°Ρ IE8. ΠΠ΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΡΠΉ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ!rowGrid.
jsΠΡΠΎΡΠ΅ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈΠ»ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΎΠ²Π½ΡΠΌΠΈ ΡΡΠ΄Π°ΠΌΠΈ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠΉ Π²ΡΡΠΎΡΡ, ΠΏΠΎΠ΄Π±ΠΈΡΠ°Ρ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈ Π·Π°Π·ΠΎΡΡ ΠΌΠ΅ΠΆΠ΄Ρ Π½ΠΈΠΌΠΈ ΡΠ°ΠΊ, ΡΡΠΎ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΡΠ΄ ΠΈΠ΄Π΅Π°Π»ΡΠ½ΠΎ Π²ΠΏΠΈΡΡΠ²Π°Π΅ΡΡΡ Π² ΡΠΈΡΠΈΠ½Ρ ΠΎΠΊΠ½Π°. ΠΡΠ°Π²Π΄Π°, Π²ΡΠ΅ ΠΎΠ±ΡΠ΅ΠΊΡΡ Π΄ΠΎΠ»ΠΆΠ½Ρ Π±ΡΡΡ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠΉ Π²ΡΡΠΎΡΡ.Slidebars
Slidebars Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ ΡΠ°ΠΉΡΠ° ΠΌΠ΅Π½Ρ ΠΈΠ»ΠΈ Π±ΠΎΠΊΠΎΠ²ΡΡ ΠΏΠ°Π½Π΅Π»Ρ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΊΠΎΠ»ΡΠ·ΡΡΠΈΠΌ Π΄Π²ΠΈΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΏΠΎΡΠ²Π»ΡΡΡΡΡ ΠΈΠ»ΠΈ ΡΠΊΡΡΠ²Π°ΡΡΡΡ ΠΏΠΎ Π½Π°ΠΆΠ°ΡΠΈΡ ΠΊΡΡΡΠΎΡΠΎΠΌ Π½Π° ΡΠΏΡΠ°Π²Π»ΡΡΡΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ. ΠΠ΅ΡΡΠΈΡ 2 ΡΡΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π° Π±ΡΠ»Π° ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΠΏΠ΅ΡΠ΅ΠΏΠΈΡΠ°Π½Π° ΠΈ ΡΠ΅ΠΏΠ΅ΡΡ ΠΌΠΎΠΆΠ΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ Π½Π΅ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Π½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΡΠ°ΠΌΡΡ ΡΠ°Π·Π½ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ². ΠΠΌΠ΅Π΅Ρ ΠΏΠΎΠ»Π½ΠΎΡΠ΅Π½Π½ΡΠΉ API, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ callback-ΡΡΠ½ΠΊΡΠΈΠΉ ΠΈ ΠΏΠΎΠ΄ΠΏΠΈΡΠΊΡ Π½Π° ΡΠΎΠ±ΡΡΠΈΡ.Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
20 ΡΠ»Π°ΠΉΠ΄-ΠΏΠ°Π½Π΅Π»Π΅ΠΉ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Π΄Π»Ρ ΡΠ°ΠΉΡΠ°
pagePiling.js
ΠΡΠ΅Π½Ρ Π½Π°ΠΏΠΎΠΌΠΈΠ½Π°Π΅Ρ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½Π½ΡΠΉ Π² Π΄Π°Π½Π½ΠΎΠΌ ΠΎΠ±Π·ΠΎΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½ multiscroll.js, Π½ΠΎ ΡΡΡΠ°Π½ΠΈΡΠ° Π½Π΅ ΡΠ°Π·Π±ΠΈΠ²Π°Π΅ΡΡΡ Π½Π° Π΄Π²Π΅ ΠΏΠ°Π½Π΅Π»ΠΈ, Π° ΡΠΌΠ΅ΡΠ°Π΅ΡΡΡ ΡΠ΅Π»ΠΈΠΊΠΎΠΌ. ΠΠΎΠΆΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΠΈ ΡΠΊΠΎΡΠΎΡΡΡ. Π₯ΠΎΡΠΎΡΠΈΠΉ Π²ΡΠ±ΠΎΡ Π΄Π»Ρ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΠΎΠ³ΠΎ ΡΠ°ΠΉΡΠ°, ΠΊΠΎΡΠΎΡΡΠΉ Π±ΡΠ΄Π΅Ρ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎ Ρ ΠΎΡΠΎΡΠΎ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΠΈ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠΉ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ ΠΈ Π½Π° Π±ΠΎΠ»ΡΡΠΈΡ ΡΠΊΡΠ°Π½Π°Ρ .Animsition
ΠΡΠ½ΠΎΠ²Π½ΠΎΠΉ ΡΠ΅Π»ΡΡ Animsition ΡΠ²Π»ΡΠ΅ΡΡΡ Π²ΠΎΠΏΠ»ΠΎΡΠ΅Π½ΠΈΠ΅ Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΏΠ»Π°Π³ΠΈΠ½Π΅ Π±ΠΎΠ»ΡΡΠΎΠ³ΠΎ ΠΈ ΡΠ°Π·Π½ΠΎΠΎΠ±ΡΠ°Π·Π½ΠΎΠ³ΠΎ Π½Π°Π±ΠΎΡΠ° ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΡΠ°Π½Π·ΠΈΡΠΈΠ²Π½ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ². Π‘ΡΠ΅Π΄ΠΈ Π½ΠΈΡ Π·Π°ΡΡΡ Π°Π½ΠΈΠ΅ ΠΈ ΠΏΡΠΎΡΠ²Π»Π΅Π½ΠΈΠ΅, Π²ΡΠ°ΡΠ΅Π½ΠΈΠ΅, ΠΎΡΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, Π·ΡΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈ Ρ.ΠΏ. (Π²ΡΠ΅Π³ΠΎ 58 ΡΡΡΠΊ).ZooMove
ΠΠ½Π΅ Π½Π΅ Π½ΡΠ°Π²ΠΈΡΡΡ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π·ΡΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ° β Ρ Π½Π°Ρ ΠΎΠΆΡ ΡΡΠΎΡ ΡΡΡΠ΅ΠΊΡ ΡΠ»ΠΈΡΠΊΠΎΠΌ ΡΠ°Π·Π΄ΡΠ°ΠΆΠ°ΡΡΠΈΠΌ. ΠΠΎ Π΅ΡΠ»ΠΈ ΡΠΆ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ Π΅Π³ΠΎ Π½Π΅ΠΏΡΠ΅ΠΌΠ΅Π½Π½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ, ΡΠΎ Π»ΡΡΡΠ΅ Π²Π·ΡΡΡ Π΄Π»Ρ ΡΡΠΎΠΉ ΡΠ΅Π»ΠΈ ZooMove. Π’Π°ΠΊΠΎΠ³ΠΎ Π³Π»Π°Π΄ΠΊΠΎΠ³ΠΎ ΠΈ ΠΏΠ»Π°Π²Π½ΠΎΠ³ΠΎ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΠΈ ΡΠΊΡΠΎΠ»Π»ΠΈΠ½Π³Π° Π½Π΅ Π΄Π°ΡΡ Π½ΠΈ ΠΎΠ΄ΠΈΠ½ Π΄ΡΡΠ³ΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½.Rippleria
ΠΠ΅Π³ΠΊΠΎΠ²Π΅ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΡΠΎΠ·Π΄Π°ΡΡΠΈΠΉ Π²ΠΎΠ»Π½ΠΎΠ²ΠΎΠΉ ΡΡΡΠ΅ΠΊΡ (ΠΏΠΎΡ ΠΎΠΆΠΈΠΉ Π½Π° ΡΡΠ±Ρ Π½Π° ΠΏΠΎΠ²Π΅ΡΡ Π½ΠΎΡΡΠΈ Π²ΠΎΠ΄Ρ) Π½Π° Π»ΡΠ±ΠΎΠΌ DOM-ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅: ΠΊΠ½ΠΎΠΏΠΊΠ΅, ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ DIV, ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ΅. ΠΡΠ΅Π½Ρ Π»Π΅Π³ΠΊΠΎ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΡΡΡ ΠΈ ΡΠΏΡΠ°Π²Π»ΡΠ΅ΡΡΡ.Flickity
ΠΡΡΡΡΡΠΉ, Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠΉ ΠΈ ΡΠΏΡΠ°Π²Π»ΡΠ΅ΠΌΡΠΉ ΠΆΠ΅ΡΡΠ°ΠΌΠΈ ΡΠ»Π°ΠΉΠ΄Π΅Ρ. ΠΠ½Π΅ΡΠ½Π΅ β Π΄ΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ ΠΎΠ±ΡΡΠ½ΡΠΉ, Π½ΠΎ Ρ Π½Π΅Π²Π΅ΡΠΎΡΡΠ½ΠΎ ΡΡΠ°ΡΠ΅Π»ΡΠ½ΠΎ Π½Π°ΠΏΠΈΡΠ°Π½Π½ΠΎΠΉ ΠΈ ΡΡΡΡΠΊΡΡΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠ΅ΠΉ. ΠΠΎΠ»Π½ΠΎΡΠ΅Π½Π½ΡΠΉ, ΠΈ ΠΏΡΠΎΠ΄ΡΠΌΠ°Π½Π½ΡΠΉ API.Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
4 Jquery ΡΠ»Π°ΠΉΠ΄Π΅ΡΠ° Ρ parallax ΡΡΡΠ΅ΠΊΡΠ°ΠΌΠΈ
Unslider
ΠΡΠ΅Π½Ρ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΠΉ ΠΈ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠ»Π°ΠΉΠ΄Π΅Ρ, ΠΈΠΌΠ΅ΡΡΠΈΠΉ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ², ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΡ ΡΠ°Π·Π½ΠΎΠΎΠ±ΡΠ°Π·ΠΈΡΡ Π΅Π³ΠΎ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅: ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π΄Π²ΠΈΠΆΠ΅Π½ΠΈΡ (Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠ΅ ΠΈ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅), ΡΠΈΠΊΠ»ΠΈΡΠ΅ΡΠΊΠ°Ρ (Π±Π΅ΡΠΊΠΎΠ½Π΅ΡΠ½Π°Ρ) ΠΏΡΠΎΠΊΡΡΡΠΊΠ°, Π°Π²ΡΠΎΠ·Π°ΠΏΡΡΠΊ.Lightcase.js
ΠΡΠ΄Π°ΡΡΠΈΠΉΡΡ lightbox Ρ CSS3 Π°Π½ΠΈΠΌΠ°ΡΠΈΠ΅ΠΉ. Π Π°Π±ΠΎΡΠ°Π΅Ρ Ρ DIV, ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ, ΡΠ΅ΠΊΡΡΠΎΠΌ, flash-ΠΎΠ±ΡΠ΅ΠΊΡΠ°ΠΌΠΈ, video ΠΈ iframe. ΠΠΎΠΊΠ° Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ jQuery 3, Π½ΠΎ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΠΎΠ±Π΅ΡΠ°ΡΡ ΠΈΡΠΏΡΠ°Π²ΠΈΡΡ ΡΡΠΎ Π² Π±Π»ΠΈΠΆΠ°ΠΉΡΠΈΡ ΡΠ΅Π»ΠΈΠ·Π°Ρ .Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
10 ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ ΠΎΠΊΠΎΠ½ Π½Π° jQuery Π΄Π»Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΡΠ°ΠΉΡΠ°
PhotoSwipe
ΠΠ°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½Π°Ρ Π³Π°Π»Π΅ΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Ρ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ ΠΊΠ°ΠΊ ΠΊΠ»Π°Π²ΠΈΠ°ΡΡΡΠΎΠΉ Π½Π° Π΄Π΅ΡΡΠΎΠΏΠ½ΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ , ΡΠ°ΠΊ ΠΈ ΠΆΠ΅ΡΡΠ°ΠΌΠΈ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ . ΠΠΌΠ΅Π΅ΡΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π·Π°Π΄Π΅ΡΠΆΠΊΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ, ΠΏΠΎΠΊΠ° ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ Π½Π΅ Π·Π°Π³ΡΡΠ·ΠΈΡΡΡ ΡΠ°ΠΌΠ° ΡΡΡΠ°Π½ΠΈΡΠ°. Π Π²ΡΠ΅ ΡΡΠΎ ΡΠ΄ΠΎΠ²ΠΎΠ»ΡΡΡΠ²ΠΈΠ΅ ΠΈΠΌΠ΅Π΅Ρ ΡΠ°Π·ΠΌΠ΅Ρ Π²ΡΠ΅Π³ΠΎ 14 ΠΊΠ.Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
7 Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ Π³Π°Π»Π΅ΡΠ΅ΠΉ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π² Π²ΠΈΠ΄Π΅ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠ°
Strip
Strip β ΡΡΠΎ lightbox, ΠΊΠΎΡΠΎΡΡΠΉ Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΡ ΠΎΠ±Π»Π°ΡΡΡ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΎΡΡΠ°Π²Π»ΡΡ ΡΠ°ΠΌΡ ΡΡΡΠ°Π½ΠΈΡΡ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ°ΡΡΠΈΡΠ½ΠΎ Π²ΠΈΠ΄ΠΈΠΌΠΎΠΉ, Π½ΠΎ ΠΈ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠΉ Π΄Π»Ρ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ Ρ Π½Π΅ΠΉ. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ ΠΌΠΎΠΆΠ΅Ρ ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΠΈ ΠΊΠ°ΠΊ ΡΠ»Π°ΠΉΠ΄Π΅Ρ. Π ΡΠΎΠΌΡ ΠΆΠ΅, Π½Π°ΡΡΠ΄Ρ Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ, ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΈ Π²ΠΈΠ΄Π΅ΠΎΠΊΠΎΠ½ΡΠ΅Π½Ρ Ρ Youtube ΠΈ Vimeo.Turntable.js
ΠΠ΅Π²Π΅ΡΠΎΡΡΠ½ΠΎ ΡΡΡΠ΅ΠΊΡΠ½ΡΠΉ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ ΠΊ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΈ ΠΏΡΠΎΠ΄ΡΠΊΡΠ°, ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ Π΅ΡΠ»ΠΈ ΡΡΠΎ ΡΠΈΠ·ΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΎΠ±ΡΠ΅ΠΊΡ. Π€Π°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ, ΠΏΠ»Π°Π³ΠΈΠ½ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΠΎΠΉ ΠΈ Π²ΡΠ΅Π³ΠΎ Π»ΠΈΡΡ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠΈΡΡΠ΅Ρ Π½Π°Π±ΠΎΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ. ΠΠ΄Π½Π°ΠΊΠΎ Π±Π»Π°Π³ΠΎΠ΄Π°ΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ ΡΠΏΡΠ°Π²Π»ΡΡΡ ΠΏΡΠΎΡΠ΅ΡΡΠΎΠΌ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ ΠΊΠΎΠ»Π΅ΡΠ° ΠΌΡΡΠΈ ΠΈΠ»ΠΈ ΠΆΠ΅ΡΡΠΎΠ² Π½Π° ΡΠΊΡΠ°Π½Π΅ ΠΏΡΠΈ ΡΡΠ»ΠΎΠ²ΠΈΠΈ, ΡΡΠΎ Π½Π°Π±ΠΎΡ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΎΠ±ΡΠ΅ΠΊΡΠ°, ΡΠ½ΡΡΠΎΠ³ΠΎ Ρ ΡΠ°Π·Π½ΡΡ ΡΠ³Π»ΠΎΠ² Π·ΡΠ΅Π½ΠΈΡ Ρ Π·ΡΠΈΡΠ΅Π»Ρ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ ΠΏΠΎΠ»Π½Π°Ρ ΠΈΠ»Π»ΡΠ·ΠΈΡ Π΅Π³ΠΎ Π²ΡΠ°ΡΠ΅Π½ΠΈΡ.Trianglify
ΠΡΠ»ΠΈ Π²Ρ Π½Π΅ Ρ ΠΎΡΠΈΡΠ΅ Π½Π°Π³ΡΡΠΆΠ°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ ΡΠΎΠ½ΠΎΠ²ΡΠΌ Π²ΠΈΠ΄Π΅ΠΎ, Π° ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΠΆΠ΅ΡΡΡ Π±Π°Π½Π°Π»ΡΠ½ΡΠΌ, ΠΏΠΎΠΏΡΠΎΠ±ΡΠΉΡΠ΅ ΡΡΠΈΠ°Π½Π³ΡΠ»ΡΡΠ½ΠΎΡΡΡ! ΠΡΠΎ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠ΅ Π³Π΅ΠΎΠΌΠ΅ΡΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΡΡΠ΅ΡΠ³ΠΎΠ»ΡΠ½ΡΠ΅ ΡΠ·ΠΎΡΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΡΠΈΠ΄Π°Π΄ΡΡ Π½Π΅ΠΊΡΡ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΠΎΡΡΡ Π²Π°ΡΠ΅ΠΌΡ Π΄ΠΈΠ·Π°ΠΉΠ½Ρ. ΠΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΌΠ΅Π½ΡΡΡ ΡΠ²Π΅Ρ, ΡΠ°Π·ΠΌΠ΅Ρ ΡΡΠ΅Π΅ΠΊ ΠΈ Π΄ΠΈΡΠΏΠ΅ΡΡΠΈΡ. ΠΡ Π΄Π°ΠΆΠ΅ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΠΏΠΈΡΠ°ΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ Π°Π»Π³ΠΎΡΠΈΡΠΌΠ° ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π² Trianglify.LazeeMenu
ΠΡΠ»ΠΈ Ρ Π²Π°Ρ Π½Π° ΡΠ°ΠΉΡΠ΅ Π±ΠΎΠ»ΡΡΠΎΠ΅ ΠΈΠ΅ΡΠ°ΡΡ ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ ΡΠΎΡ ΡΠ°Π½ΠΈΡΡ ΠΏΡΠΎΡΡΡΠΌ ΠΈ ΠΏΠΎΠ½ΡΡΠ½ΡΠΌ ΡΠΎ LazeeMenu Π½Π΅ΡΠΎΠΌΠ½Π΅Π½Π½ΠΎ ΠΏΡΠΈΠ³ΠΎΠ΄ΠΈΡΡΡ Π²Π°ΠΌ. ΠΠ½ ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΡΠ΅Ρ Π²Π»ΠΎΠΆΠ΅Π½Π½ΡΠ΅ Π½Π΅Π½ΡΠΌΠ΅ΡΠΎΠ²Π°Π½Π½ΡΠ΅ ΡΠΏΠΈΡΠΊΠΈ Π² ΡΠ΄ΠΎΠ±Π½ΠΎΠ΅ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π΅ ΠΌΠ΅Π½Ρ.Web-ticker
ΠΠ΅Π³ΡΡΠ°Ρ ΡΡΡΠΎΠΊΠ°, ΠΏΠΎΡ ΠΎΠΆΠ°Ρ Π½Π° ΡΠ΅, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°ΡΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ²ΠΈΠ΄Π΅ΡΡ Π½Π° ΡΠΊΡΠ°Π½Π΅ ΡΠ΅Π»Π΅Π²ΠΈΠ·ΠΎΡΠ° Π² Π²ΡΠΏΡΡΠΊΠ°Ρ Π½ΠΎΠ²ΠΎΡΡΠ΅ΠΉ β ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠ΅ ΡΠΎΠ±ΡΡΠΈΡ, Π±ΠΈΡΠΆΠ΅Π²ΡΠ΅ ΠΊΠΎΡΠΈΡΠΎΠ²ΠΊΠΈ, ΠΏΠΎΠ³ΠΎΠ΄Π°β¦ ΠΠ° ΠΌΠ°Π»ΠΎ Π»ΠΈ, ΡΡΠΎ ΡΠ°ΠΌ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ! Π’Π°ΠΊ, ΡΡΠΎ Π΅ΡΠ»ΠΈ Π²Π°ΠΌ Π½ΡΠ°Π²ΠΈΡΡΡ ΡΠ°ΠΊΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΠΏΠΎΠ΄Π°ΡΠΈ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ β Π²ΠΎΠ·ΡΠΌΠΈΡΠ΅ Web-ticker Π½Π° Π·Π°ΠΌΠ΅ΡΠΊΡ.Inputmask
User experience Π² Π΄Π΅ΠΉΡΡΠ²ΠΈΠΈ. ΠΡ ΠΏΠΎΠΌΠ½ΠΈΡΠ΅ ΡΠ΅ Π²ΡΠ΅ΠΌΠ΅Π½Π°, ΠΊΠΎΠ³Π΄Π° ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΠ»ΠΎΡΡ Π·Π°Π½ΠΎΠ²ΠΎ Π²Π²ΠΎΠ΄ΠΈΡΡ Π² ΡΠΎΡΠΌΡ Π΄Π°Π½Π½ΡΠ΅ ΠΈΠ·-Π·Π° ΠΎΡΠΈΠ±ΠΊΠΈ. ΠΡΠΈΡΠ΅ΠΌ ΠΎΡΠΈΠ±ΠΊΠ° ΠΎΠ±Π½Π°ΡΡΠΆΠΈΠ²Π°Π»Π°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΠΎΡΠ»Π΅ ΠΎΡΠ²Π΅ΡΠ° ΡΠ΅ΡΠ²Π΅ΡΠ°. ΠΠ°Π±ΡΠ΄ΡΡΠ΅ ΠΎΠ± ΡΡΠΎΠΌ! Inputmask Π½Π΅ ΠΏΡΠΎΡΡΠΎ ΠΊΠΎΠ½ΡΡΠΎΠ»ΠΈΡΡΠ΅Ρ ΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅Ρ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΠΎ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΡΡΡ Π²Π²ΠΎΠ΄ΠΈΠΌΡΡ Π΄Π°Π½Π½ΡΡ , ΠΎΠ½ Π΅ΡΠ΅ ΠΈ ΠΏΡΠ΅ΠΏΡΡΡΡΠ²ΡΠ΅Ρ Π²Π²Π΅Π΄Π΅Π½ΠΈΡ Π½Π΅ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΡ . ΠΠΎΠΏΡΠΎΠ±ΡΠΉΡΠ΅, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Π²Π²Π΅ΡΡΠΈ 13-ΠΉ ΠΌΠ΅ΡΡΡ Π² ΠΏΠΎΠ»Π΅ Π΄Π°ΡΡ. ΠΠ°ΡΠΊΠΈ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ ΡΠ°ΠΌΡΠ΅ ΡΠ°Π·Π½ΡΠ΅ β Π΄Π°ΡΡ, ΡΠ΅Π»Π΅ΡΠΎΠ½Ρ, e-mail ΠΈ Π΄Π°ΠΆΠ΅ ΡΠ΅Π³ΡΠ»ΡΡΠ½ΡΠ΅ Π²ΡΡΠ°ΠΆΠ΅Π½ΠΈΡ.ScrollReveal
Π‘ΡΠΏΠ΅ΡΠ»Π΅Π³ΠΊΠΈΠΉ, Π°Π΄Π°ΠΏΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΠΊΠ°ΠΊ ΠΊ Π΄Π΅ΡΠΊΡΠΎΠΏΠ½ΡΠΌ, ΡΠ°ΠΊ ΠΈ ΠΊ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠΌ Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌ ΡΠΊΡΠΈΠΏΡ Π΄Π»Ρ ΡΡΡΠ΅ΠΊΡΠ½ΠΎΠΉ ΡΠΊΡΠΎΠ»Π»ΠΈΠ½Π³ΠΎΠ²ΠΎΠΉ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ.Marginotes
ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ (tooltip), ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΠΌΡΠ΅ Π½Π° ΠΏΠΎΠ»ΡΡ ΡΡΠ΄ΠΎΠΌ Ρ Π°Π±Π·Π°ΡΠ΅ΠΌ. ΠΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎΠ΅ ΠΈ ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»ΡΠ½ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅. ΠΡΠ»ΠΈ Π²Ρ Π½Π΅ Π»ΡΠ±ΠΈΡΠ΅Π»Ρ jQuery, ΡΠΎ ΠΈΠΌΠ΅Π΅ΡΡΡ Π²Π΅ΡΡΠΈΡ, Π½Π΅ ΡΡΠ΅Π±ΡΡΡΠ°Ρ ΡΡΠΎΠΉ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ.Loud Links
Java-ΡΠΊΡΠΈΠΏΡ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Β«ΠΎΠ·Π²ΡΡΠΈΡΡΒ» Π²Π°Ρ ΡΠ°ΠΉΡ β Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π·Π²ΡΠΊΠΎΠ²ΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ Π½Π° ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Π°ΡΠ΄ΠΈΠΎ-ΡΠ»Π΅ΠΌΠ΅Π½Ρ HTML5 ΠΈ ΡΠΏΠΎΡΠΎΠ±Π΅Π½ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡ MP3 ΠΈ OGG ΡΠ°ΠΉΠ»Ρ.Bricks.js
ΠΠΎΠ»Π½ΠΈΠ΅Π½ΠΎΡΠ½ΡΠΉ, Π² ΡΠΌΡΡΠ»Π΅ ΡΠΊΠΎΡΠΎΡΡΠΈ ΡΠ°Π±ΠΎΡΡ, ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΏΠ»ΠΈΡΠΎΡΠ½ΠΎΠΉ Π²Π΅ΡΡΡΠΊΠΈ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉ ΡΠΈΡΠΈΠ½Ρ.MediumEditor
ΠΠ°Π»Π΅Π½ΡΠΊΠΈΠΉ (28ΠΊΠ) ΠΈ Π»Π΅Π³ΠΊΠΈΠΉ inline ΡΠ΅Π΄Π°ΠΊΡΠΎΡ Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² ΡΠ΅ΠΊΡΡΠ° Π½Π΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅. ΠΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°ΡΡ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ ΠΈ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠΊΠΈΠ½Ρ.Π‘ΠΌΠΎΡΡΠΈΡΠ΅ ΡΠ°ΠΊΠΆΠ΅:
10 Javascript WYSIWYG ΠΈ Markdown Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΡΡ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠΎΠ²
Philter
Philter ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠ΄ΠΎΠ±Π½ΠΎΠ΅ ΠΈ Π³ΠΈΠ±ΠΊΠΎΠ΅ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ CSS-ΡΠΈΠ»ΡΡΡΠ°ΠΌΠΈ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ HTML-Π°ΡΡΠΈΠ±ΡΡΠΎΠ². ΠΠΎΡΡΠ°Π²Π»ΡΠ΅ΡΡΡ Π² Π²ΠΈΠ΄Π΅ ΠΏΠ»Π°Π³ΠΈΠ½Π° ΠΊ jQuery ΠΈΠ»ΠΈ ΡΠΊΡΠΈΠΏΡΠ° Π½Π° ΡΠΈΡΡΠΎΠΌ JavaScript.SuperEmbed.js
ΠΠ±Π½Π°ΡΡΠΆΠΈΠ²Π°Π΅Ρ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ Π²ΡΡΡΠΎΠ΅Π½Π½ΠΎΠ΅ Π²ΠΈΠ΄Π΅ΠΎ ΠΈ ΠΏΠΎΠΌΠ΅ΡΠ°Π΅Ρ Π΅Π³ΠΎ Π² Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ.Substance
ΠΠΎΠ»Π½ΠΎΡΠ΅Π½Π½ΡΠΉ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΠΉ ΡΠ΅Π΄Π°ΠΊΡΠΎΡ Π΄Π»Ρ ΠΎΠ½Π»Π°ΠΉΠ½ΠΎΠ²ΡΡ ΠΈΠ·Π΄Π°ΡΠ΅Π»ΡΡΠΊΠΈΡ ΡΠΈΡΡΠ΅ΠΌ.List.js
ΠΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΡΡΠΈΡΠΎΠ²Π°ΡΡ, ΡΠΈΠ»ΡΡΡΠΎΠ²Π°ΡΡ ΠΈ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡ ΠΏΠΎΠΈΡΠΊ ΠΏΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ ΡΠΏΠΈΡΠΊΠΎΠ², ΡΠ°Π±Π»ΠΈΡ ΠΈ Π΄ΡΡΠ³ΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ HTMLjqGifPreview
Π‘ΠΎΠ·Π΄Π°Π΅Ρ ΡΡΠΎΠΏ ΠΊΠ°Π΄Ρ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ GIF-ΡΠ°ΠΉΠ»Π°, ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠ΄Π΅Π»Π°Π½ΠΎ Π² FaceBook.Datedropper.js
Π‘ΠΈΠΌΠΏΠ°ΡΠΈΡΠ½ΡΠΉ ΠΈ ΡΠ΄ΠΎΠ±Π½ΡΠΉ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π±ΡΡΡΡΠΎΠ³ΠΎ ΡΠΊΠ°Π·Π°Π½ΠΈΡ Π΄Π°ΡΡ.jfMagnify
ΠΠ»Π°Π³ΠΈΠ½ ΡΠ²Π΅Π»ΠΈΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΡΡΠ΅ΠΊΠ»ΠΎ Π½Π° Π±Π°Π·Π΅ jQuery. Π‘ΠΏΠΎΡΠΎΠ±Π΅Π½ ΡΠ²Π΅Π»ΠΈΡΠΈΠ²Π°ΡΡ Π»ΡΠ±ΠΎΠΉ HTML-ΡΠ»Π΅ΠΌΠ΅Π½Ρ, Π° Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅.jQuery formBuilder
ΠΡΡΡΡΠΎΠ΅ ΠΈ ΡΠ΄ΠΎΠ±Π½ΠΎΠ΅ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΡΠΎΡΠΌ β Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ ΠΏΡΠΎΡΡΠΎ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΈΡΡ Π½Π° ΡΠΎΡΠΌΡ ΡΡΠ΅Π±ΡΠ΅ΠΌΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ.Popper.
jsΠΠ΅ΡΠΌΠΎΡΡΡ Π½Π° ΡΠ²ΠΎΠΉ ΡΠ°Π·ΠΌΠ΅Ρ 4ΠΊΠ ΡΡΠ° Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ°-ΠΌΠ°Π»ΡΡΠΊΠ° ΡΠΎΠ·Π΄Π°Π΅Ρ ΡΡΡΠ΅ΠΊΡΠ½ΡΠ΅ ΠΈ ΡΠΌΠ½ΡΠ΅ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ (tooltip), ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Ρ Ρ Π»ΡΠ±ΠΎΠΉ ΡΡΠΎΡΠΎΠ½Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, Π° ΡΠ°ΠΊΠΆΠ΅ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ ΠΌΠ΅Π½ΡΡΡ ΡΡΠΎ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π³ΡΠ°Π½ΠΈΡΡ ΡΡΡΠ°Π½ΠΈΡΡ.Image Blur Plugin
ΠΠ΅Π³ΠΊΠΈΠΉ ΠΊΡΠΎΡΡ-Π±ΡΠ°ΡΠ·Π΅ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΠΏΠΎΠ»ΡΡΠ΅Π½ΠΈΡ ΡΠ°ΡΡΠΎΠΊΡΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ.InlineTweet.js
ΠΡΠ΅Π²ΡΠ°ΡΠΈΡΡ Π»ΡΠ±ΠΎΠΉ ΡΠ΅ΠΊΡΡ Π² Twitter-ΡΡΡΠ»ΠΊΡ β Π΄Π΅Π»ΠΎ ΠΎΠ΄Π½ΠΎΠΉ ΡΠ΅ΠΊΡΠ½Π΄Ρ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ InlineTweet.jsiMissYou.js
iMissYou.js ΠΈΠ·ΠΌΠ΅Π½ΡΠ΅Ρ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΠΈ favicon, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π½Π° Π΄ΡΡΠ³ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ.SweetAlert2
ΠΡΠ΅ΠΊΡΠ°ΡΠ½Π°Ρ Π·Π°ΠΌΠ΅Π½Π° ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠΌΡ ΠΎΠΊΠ½Ρ, Π²ΡΠ·ΡΠ²Π°Π΅ΠΌΠΎΠΌΡ ΡΡΠ½ΠΊΡΠΈΠ΅ΠΉ alert(). ΠΠΌΠ΅Π΅Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ, ΠΊΠΎΡΠΎΡΡΠ΅ Π΄Π΅Π»Π°ΡΡ Π΅Π³ΠΎ Π±ΠΎΠ»Π΅Π΅ Π½Π°Π³Π»ΡΠ΄Π½ΡΠΌ ΠΈ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠ²Π½ΡΠΌ.Force.js
Π‘ Force.js Π»Π΅Π³ΠΊΠΎ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°ΡΡ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ Π»ΡΠ±ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΈΠΌΠΈΡΠΈΡΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π²Π°ΡΠΈΠ°Π½ΡΡ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΡΠΈΠ»Ρ.Bideo.js
ΠΠ΅ΠΏΠ»ΠΎΡ Π°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° Π΄Π»Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΡΠΎΠ½ΠΎΠ²ΠΎΠ³ΠΎ Π²ΠΈΠ΄Π΅ΠΎ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ Π²Π°ΡΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ°.Microlight.js
ΠΠ΅Π±ΠΎΠ»ΡΡΠ°Ρ, Π²ΡΠ΅Π³ΠΎ 2,2 ΠΊΠ, Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° Π΄Π»Ρ ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΊΠΈ ΠΊΠΎΠ΄Π° ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π²ΡΠ΅Ρ ΡΠ·ΡΠΊΠΎΠ² ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΡ. Π£ΠΊΠ°Π·ΡΠ²Π°ΡΡ ΡΠ·ΡΠΊ Π½Π΅ Π½ΡΠΆΠ½ΠΎ, Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° ΡΠ°ΠΌΠ° ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡ Π΅Π³ΠΎ. ΠΠΎΠ»Π΅Π΅ ΡΡΠΎΠ³ΠΎ, Π² ΠΎΠ΄Π½ΠΎΠΌ Π±Π»ΠΎΠΊΠ΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π΄Π°ΠΆΠ΅ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ·ΡΠΊΠΎΠ². ΠΠ΅ΠΎΠ±ΡΡΠ½ΡΠΌ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠ°ΠΌΠΎ Π²ΡΠ΄Π΅Π»Π΅Π½ΠΈΠ΅ β Π²ΠΌΠ΅ΡΡΠΎ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ ΡΠ°ΡΠΊΡΠ°ΡΠΈΠ²Π°ΡΡ ΠΊΠΎΠ΄ ΠΊΠ°ΠΊ ΡΠΎΠΆΠ΄Π΅ΡΡΠ²Π΅Π½ΡΠΊΡΡ Π΅Π»ΠΊΡ Π²ΡΠ΄Π΅Π»Π΅Π½ΠΈΠ΅ Ρ Π°ΡΠ°ΠΊΡΠ΅ΡΠ½ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡΡ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ Π½Π°ΡΠ΅ΡΡΠ°Π½ΠΈΡ ΡΡΠΈΡΡΠ° (ΠΏΠΎΠ»ΡΠΆΠΈΡΠ½ΡΠΉ, Π½Π°ΠΊΠ»ΠΎΠ½Π½ΡΠΉ ΠΈ Ρ.ΠΏ.)flatpickr
ΠΡΡΡΡΡΠΉ ΠΈ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ° Π΄Π»Ρ Π²Π²ΠΎΠ΄Π° Π΄Π°ΡΡ, Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ ΠΈΠ»ΠΈ ΠΈ ΡΠΎΠ³ΠΎ ΠΈ Π΄ΡΡΠ³ΠΎΠ³ΠΎ Π²ΠΌΠ΅ΡΡΠ΅.anime.js
ΠΠΈΠ±ΠΊΠ°Ρ ΠΈ Π»Π΅Π³ΠΊΠ°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΎΠ½Π½ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ², Π²ΠΎΠ·Π΄Π΅ΠΉΡΡΠ²ΡΡΡΠ°Ρ Π½Π° ΡΠ΅Π»Π΅ΠΊΡΠΎΡΡ CSS, SVG, Π°ΡΡΠΈΠ±ΡΡΡ DOM ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ JS-ΠΎΠ±ΡΠ΅ΠΊΡΡ.Skippr
ΠΡΡΡΡΠΎΠ΅ ΠΈ Π»Π΅Π³ΠΊΠΎΠ΅ ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ Π½Π° Π±Π°Π·Π΅ jQuery. Π Π΄Π°Π½Π½ΡΠΌ ΠΌΠΎΠΌΠ΅Π½Ρ ΡΠΌΠ΅Π½Π° ΡΠ»Π°ΠΉΠ΄ΠΎΠ² ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡΡ ΡΠΊΠΎΠ»ΡΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΈΠ»ΠΈ ΠΏΡΠΎΡΠ²Π»Π΅Π½ΠΈΠ΅ΠΌ, ΠΈΠΌΠ΅ΡΡΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠΏΡΠ°Π²Π»ΡΡΡΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ. ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π°Π²ΡΠΎΠ²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΠ΅.Lightgallery.js
ΠΠ°ΠΏΠΈΡΠ°Π½Π½Π°Ρ Π½Π° ΡΠΈΡΡΠΎΠΌ JavaScript, Π±Π΅Π· Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΡΠΎΡΠΎΠ½Π½ΠΈΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ ΡΡΠΎΡ lightbox ΠΈ ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ Π² ΠΎΠ΄Π½ΠΎΠΌ ΡΠ»Π°ΠΊΠΎΠ½Π΅ ΠΎΠ±Π»Π°Π΄Π°Π΅Ρ Π²Π½ΡΡΠΈΡΠ΅Π»ΡΠ½ΡΠΌ Π½Π°Π±ΠΎΡΠΎΠΌ ΡΡΠ½ΠΊΡΠΈΠΉ: Π°Π²ΡΠΎΠ²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΠ΅, Π·ΡΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΠ°ΡΠΏΡΠΎΡΡΡΠ°Π½ΡΡΡ ΡΡΡΠ»ΠΊΡ Π½Π° Π½Π΅Π³ΠΎ Π² ΡΠΎΡΡΠ΅ΡΡΡ ΠΈΠ»ΠΈ ΡΠΊΠ°ΡΠΈΠ²Π°ΡΡ ΠΏΠΎΠ½ΡΠ°Π²ΠΈΠ²ΡΠΈΠ΅ΡΡ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΈ.iziModal.js
ΠΠ»Π΅Π³Π°Π½ΡΠ½Π°Ρ, Π³ΠΈΠ±ΠΊΠ°Ρ ΠΈ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΠ°Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½Π°Ρ ΡΠΎΡΠΌΠ°, Π²ΡΠΏΠΎΠ»Π½ΡΡΡΠ°Ρ ΡΠ°Π·Π½ΡΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ β ΠΎΡ Π·Π°ΠΌΠ΅Π½Ρ ΠΊΠ»Π°ΡΡΠΈΡΠ΅ΡΠΊΠΎΠΉ alert(), Π΄ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ Π² Π½Π΅ΠΉ ΡΠ΅Π»ΡΡ ΡΡΡΠ°Π½ΠΈΡ ΠΈ Π±Π»ΠΎΠΊΠΎΠ².<iframe>
ΠΠΎΠ²ΡΠ΅ jQuery ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π·Π° ΠΌΠ°ΠΉ 2015
ΠΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° jQuery ΠΎΠ΄Π½ΠΎΠΉ ΠΈΠ· ΠΎΡΠ½ΠΎΠ²Π½ΡΡ Π΄Π»Ρ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ², ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΎΠ½Π° ΠΈΠΌΠ΅Π΅Ρ ΠΌΠ½ΠΎΠ³ΠΎΡΠ΅Π»Π΅Π²ΠΎΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅. jQuery ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΡΠ΅ΡΡΡ ΠΊΠ°ΠΊ Π±Π΅ΡΠΏΠ»Π°ΡΠ½Π°Ρ, ΠΊΡΠΎΡΡΠΏΠ»Π°ΡΡΠΎΡΠΌΠ΅Π½Π½Π°Ρ JavaScript Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° Ρ ΠΎΡΠΊΡΡΡΡΠΌ ΠΊΠΎΠ΄ΠΎΠΌ, ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π½Π½Π°Ρ Π΄Π»Ρ ΡΠΏΡΠΎΡΠ΅Π½ΠΈΡ ΡΡΠ΅Π½Π°ΡΠΈΠ΅Π² HTML Π½Π° ΠΊΠ»ΠΈΠ΅Π½ΡΡΠΊΠΎΠΉ ΡΡΠΎΡΠΎΠ½Π΅. jQuery ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π½Π° Π±ΠΎΠ»Π΅Π΅ ΡΠ΅ΠΌ 60% ΠΈΠ· 10 000 ΡΠ°ΠΌΡΡ ΠΏΠΎΡΠ΅ΡΠ°Π΅ΠΌΡΡ Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ².
ΠΠ»Ρ ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠΈ ΠΌΡ ΠΎΡΠΎΠ±ΡΠ°Π»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ°ΠΌΡΡ ΠΏΠΎΠ»Π΅Π·Π½ΡΡ ΠΈ ΡΠ²Π΅ΠΆΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ². ΠΠ°Π΄Π΅Π΅ΠΌΡΡ, ΡΡΠΎΡ ΡΠΏΠΈΡΠΎΠΊ Π±ΡΠ΄Π΅Ρ ΠΏΠΎΠ»Π΅Π·Π΅Π½ Π΄Π»Ρ Π²Π°Ρ.
jsSocial β ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΎΡΠ³Π°Π½ΠΈΠ·Π°ΡΠΈΠΈ ΠΎΠ±ΠΌΠ΅Π½Π° Π΄Π°Π½Π½ΡΠΌΠΈ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ°ΠΉΡΠΎΠΌ ΠΈ ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΠΌΠΈ ΡΠ΅ΡΡΠΌΠΈ. ΠΠ½ Π³ΠΈΠ±ΠΎΠΊ ΠΈ Π»Π΅Π³ΠΊΠΎ ΡΠ°ΡΡΠΈΡΡΠ΅ΠΌ. ΠΠ½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠΈΡΠΎΠ²Π°ΡΡ. ΠΡΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ Π²ΡΠ±ΡΠ°ΡΡ ΠΎΠ΄Π½Ρ ΠΈΠ· Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½Π½ΡΡ ΡΠ΅ΠΌ ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π»ΡΠ±ΡΡ Π΅ΡΠ΅ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΠΌΡΡ ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΡ.
Clusterize.js β ΡΡΠΎ Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΏΡΠΎΡΡΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π±ΠΎΠ»ΡΡΠΈΡ Π½Π°Π±ΠΎΡΠΎΠ² Π΄Π°Π½Π½ΡΡ . ΠΡΠ½ΠΎΠ²Π½Π°Ρ ΠΈΠ΄Π΅Ρ β Π½Π΅ Π·Π°ΡΠΎΡΡΡΡ DOM Π²ΡΠ΅ΠΌΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠΌΠΈ ΡΠ΅Π³Π°ΠΌΠΈ. ΠΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ, ΠΏΠ»Π°Π³ΠΈΠ½ ΡΠ°Π·Π΄Π΅Π»ΡΠ΅Ρ ΡΠΏΠΈΡΠΎΠΊ Π½Π° ΠΊΠ»Π°ΡΡΠ΅ΡΡ, Π·Π°ΡΠ΅ΠΌ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π΄Π»Ρ ΡΠ΅ΠΊΡΡΠ΅ΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ ΠΈ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΡΡΠΎΠΊΠΈ Π² Π½Π°ΡΠ°Π»Π΅ ΠΈ ΠΊΠΎΠ½ΡΠ΅ ΡΠΏΠΈΡΠΊΠ°, ΡΡΠΎΠ±Ρ ΡΠΌΡΠ»ΠΈΡΠΎΠ²Π°ΡΡ ΡΠ°Π±Π»ΠΈΡΡ Π²ΠΎ Π²ΡΡ Π²ΡΡΠΎΡΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ Π±ΡΠ°ΡΠ·Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΠ» ΠΏΡΠΎΠΊΡΡΡΠΊΡ ΠΊΠ°ΠΊ Π΄Π»Ρ ΠΏΠΎΠ»Π½ΠΎΠ³ΠΎ ΡΠΏΠΈΡΠΊΠ°.
Zoom.js β ΡΡΠΎ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ. ΠΡΠΎ ΡΠ°ΠΌΡΠΉ Π»ΡΡΡΠΈΠΉ ΡΠΏΠΎΡΠΎΠ± ΡΠ²Π΅Π»ΠΈΡΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π° ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Ρ ΠΈ ΡΠ²Π΅Π»ΠΈΡΠ΅Π½ΠΈΠ΅ Π²ΡΠΏΠΎΠ»Π½ΡΡΡΡΡ Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ΅ΡΠΊΠΎ.
CircularLoader.js ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ jQuery ΠΏΠ»Π°Π³ΠΈΠ½, Π½Π°ΠΏΠΈΡΠ°Π½Π½ΡΠΉ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ HTML5 ΠΈ JavaScript. Π‘Π»ΡΠΆΠΈΡ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΡΡ ΠΊΡΡΠ³Π»ΡΡ ΠΈΠ½Π΄ΠΈΠΊΠ°ΡΠΎΡΠΎΠ² Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ Ρ ΡΠΊΠ°Π·Π°Π½ΠΈΠ΅ΠΌ ΡΠΈΡΠ»ΠΎΠ²ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ ΠΈΠ»ΠΈ Π±Π΅Π·. ΠΠ³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΈΠ½Π΄ΠΈΠΊΠ°ΡΠΎΡΠ° ΠΏΡΠΎΠ³ΡΠ΅ΡΡΠ°. ΠΡΠΎ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΡΠΎ Π²ΡΠ΅ΠΌΠΈ Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌΠΈ, ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΠΈΠΌΠΈ HTML5.
jQuery Grid β ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ jQuery. ΠΡΠΎ ΠΎΡΠ΅Π½Ρ Π±ΡΡΡΡΡΠΉ ΠΈ ΡΠ°ΡΡΠΈΡΡΠ΅ΠΌΡΠΉ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΠΉ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΊ Π»ΡΠ±ΠΎΠΉ ΡΠ°Π±Π»ΠΈΡΠ΅ HTML Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ. ΠΠ°Π½Π½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π½ΡΠΌΠ΅ΡΠ°ΡΠΈΡ ΡΡΡΠ°Π½ΠΈΡ, JavaScript ΠΈ ΠΈΡΡΠΎΡΠ½ΠΈΠΊΠΈ Π΄Π°Π½Π½ΡΡ Π½Π° ΡΡΠΎΡΠΎΠ½Π΅ ΡΠ΅ΡΠ²Π΅ΡΠ°, jQuery UI ΠΈ Bootstrap. ΠΠ½ΡΡΡΡΠΌΠ΅Π½Ρ Π±Π΅ΡΠΏΠ»Π°ΡΠ΅Π½, ΠΈΠΌΠ΅Π΅Ρ ΠΎΡΠΊΡΡΡΡΠΉ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΠΊΠΎΠ΄ ΠΈ ΡΠ°ΡΠΏΡΠΎΡΡΡΠ°Π½ΡΠ΅ΡΡΡ ΠΏΠΎΠ΄ Π»ΠΈΡΠ΅Π½Π·ΠΈΠ΅ΠΉ MIT.
Pogo Slider ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠ΅ ΡΠ»Π°ΠΉΠ΄Π΅ΡΡ Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°. ΠΠ»Ρ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΎΠ² ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»Π°ΠΉΠ΄Π°ΠΌΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ CSS Π°Π½ΠΈΠΌΠ°ΡΠΈΡ. ΠΠ½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΡΡΠ΅ΠΊΡ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ ΠΊ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌΡ ΡΠ»Π°ΠΉΠ΄Ρ ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°Π½ΠΈΠΈ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠ° ΠΈΠ»ΠΈ ΠΏΠΎΡΠ»Π΅ ΠΏΠ΅ΡΠ΅Π»ΠΈΡΡΡΠ²Π°Π½ΠΈΡ.
TabbedContent β ΡΡΠΎ Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ HTML5 History API, ΡΡΠΎΠ±Ρ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ ΠΏΠΎ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌ Π² ΠΈΡΡΠΎΡΠΈΡ Π²Π°ΡΠ΅Π³ΠΎ Π±ΡΠ°ΡΠ·Π΅ΡΠ°. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ ΡΠΎΠ²ΠΌΠ΅ΡΡΠΈΠΌ Ρ Bootstrap.
Bootstrap News Box β ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ jQuery ΠΈ Bootstrap 3 Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΠΎΠ³ΠΎ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠ° Π½ΠΎΠ²ΠΎΡΡΠ΅ΠΉ Ρ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΎΠΉ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°. ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π°Π²ΡΠΎΠ·Π°ΠΏΡΡΠΊ ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ Π²Π²Π΅ΡΡ /Π²Π½ΠΈΠ·.
jQueryTween β ΡΡΠΎ ΡΠ°ΠΌΡΠΉ Π»Π΅Π³ΠΊΠΈΠΉ ΡΠ²ΠΈΠ½ΠΈΠ½Π³ (ΡΠ²ΠΈΠ½ΠΈΠ½Π³ β Π°Π½ΠΈΠΌΠ°ΡΠΈΡ Ρ ΠΏΠΎΡΡΡΠΎΠ΅Π½ΠΈΠ΅ΠΌ ΠΏΡΠΎΠΌΠ΅ΠΆΡΡΠΎΡΠ½ΡΡ ΠΊΠ°Π΄ΡΠΎΠ²) Π΄Π²ΠΈΠΆΠΎΠΊ Π΄Π»Ρ jQuery. ΠΠ½ Π²ΠΎ ΠΌΠ½ΠΎΠ³ΠΎΠΌ ΠΎΠ±Π»Π΅Π³ΡΠ°Π΅Ρ ΡΠ°Π±ΠΎΡΡ Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΎΠΉ Tween.js. Π ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²ΡΡΠΎΠΊΠΎΠΊΠ°ΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎΠΉ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ.
jQChat β ΡΡΠΎ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΌΠ³Π½ΠΎΠ²Π΅Π½Π½ΡΡ ΡΠ°ΡΠΎΠ², ΠΊΠ°ΠΊ Π² Facebook ΠΈΠ»ΠΈ Gmail. ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ, ΡΡΠΎΠ±Ρ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π½Π° ΡΠ°ΠΉΡ ΡΠΈΡΡΠ΅ΠΌΡ ΠΎΠ±ΠΌΠ΅Π½Π° ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΡΠΌΠΈ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ JavaScript.
jQuery Image Player β ΡΡΠΎ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, Β«ΠΏΡΠΎΠΈΠ³ΡΡΠ²Π°ΡΡΠ΅Π³ΠΎΒ» ΠΈΡ ΠΊΠ°ΠΊ ΠΊΠ°Π΄ΡΡ Π²ΠΈΠ΄Π΅ΠΎ. Π Π½Π΅ΠΌ ΡΠ°ΠΊΠΆΠ΅ Π΅ΡΡΡ ΡΡΡΠ΅ΠΊΡΡ Π΄Π»Ρ ΡΠΌΠ΅Π½Ρ ΡΠ»Π°ΠΉΠ΄ΠΎΠ².
jQMeter β ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΠΈΠ½Π΄ΠΈΠΊΠ°ΡΠΎΡΠ° ΠΏΡΠΎΠ³ΡΠ΅ΡΡΠ°, Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½Π½ΠΎΠ³ΠΎ Π²Π²Π΅ΡΡ ΠΈΠ»ΠΈ Π²Π½ΠΈΠ·. ΠΡΠΎΡΡΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΠΉΡΠ΅ ΡΠ΅Π»Ρ ΠΈ ΠΏΡΠΎΡΠ΅Π½Ρ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ ΠΎΠΏΠ΅ΡΠ°ΡΠΈΠΈ, Π²ΡΠ΅ ΠΎΡΡΠ°Π»ΡΠ½ΠΎΠ΅ Π·Π°Π΄Π°Π΅ΡΡΡ ΠΎΠΏΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ.
Nex slider ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ Π±ΡΡΡΡΡΠΉ ΠΏΠΎΠ»Π½ΠΎΡΠΊΡΠ°Π½Π½ΡΠΉ ΡΠ»Π°ΠΉΠ΄Π΅Ρ, ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ Π΄Π»Ρ Π±ΠΎΠ»ΡΡΠ΅ΠΉ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΠΈ ΠΈ ΡΠΎΠ²ΠΌΠ΅ΡΡΠΈΠΌΡΠΉ ΡΠΎ Π²ΡΠ΅ΠΌΠΈ ΠΏΠ»Π°ΡΡΠΎΡΠΌΠ°ΠΌΠΈ. ΠΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Π΄Π°ΠΆΠ΅ Π΄Π°Π½Π½ΡΠ΅ Google Maps Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΈ ΡΠΎΠΌ ΠΆΠ΅ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠ΅.
Embed.js β ΡΡΠΎ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΊΠΎΠ½Π²Π΅ΡΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΡ ΡΠΌΠ°ΠΉΠ»ΠΈΠΊΠΎΠ² Π² Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΠΈΠΊΠΎΠ½ΠΊΠΈ, ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΠΈΠΉ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΡΡ ΡΠΈΡΡΠ΅ΠΌΡ Π²ΡΡΡΠ°ΠΈΠ²Π°Π½ΠΈΡ ΠΌΠ΅Π΄ΠΈΠ°-ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° Π΄Π»Ρ ΠΌΡΠ»ΡΡΠΈΠΌΠ΅Π΄ΠΈΠΉΠ½ΡΡ URL.
WebSnowjq.js β ΡΡΠΎ jQuery ΠΏΠ»Π°Π³ΠΈΠ½, Π½Π°ΠΏΠΈΡΠ°Π½Π½ΡΠΉ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ HTML5 ΠΈ JavaScript Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΠ½Π΅Π³ΠΎΠΏΠ°Π΄Π° Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅. WebSnowjq.js ΡΠΎΠ²ΠΌΠ΅ΡΡΠΈΠΌ ΡΠΎ Π²ΡΠ΅ΠΌΠΈ Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌΠΈ, ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΠΈΠΌΠΈ HTML5. ΠΠ½ΡΠ΅Π³ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ WebSnowjq.js Π² Π²Π΅Π±-ΡΠ°ΠΉΡ Π½Π΅ ΡΡΠ΅Π±ΡΠ΅Ρ Π½ΠΈΠΊΠ°ΠΊΠΈΡ ΡΡΠΈΠ»ΠΈΠΉ.
jAnimate β ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π²Π°ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Animate.css Ρ jQuery.
jQuery Date Range Picker ΡΠ²Π»ΡΠ΅ΡΡΡ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΠΌ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π²ΡΠ±ΡΠ°ΡΡ Π΄ΠΈΠ°ΠΏΠ°Π·ΠΎΠ½ Π΄Π°Ρ.
ΠΠ°Π½Π½Π°Ρ ΠΏΡΠ±Π»ΠΈΠΊΠ°ΡΠΈΡ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΠ΅ΡΠ΅Π²ΠΎΠ΄ΠΎΠΌ ΡΡΠ°ΡΡΠΈ Β«New jQuery Plugins for May 2015Β» , ΠΏΠΎΠ΄Π³ΠΎΡΠΎΠ²Π»Π΅Π½Π½Π°Ρ ΡΠ΅Π΄Π°ΠΊΡΠΈΠ΅ΠΉ ΠΏΡΠΎΠ΅ΠΊΡΠ°.
ΠΠ·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ ΡΠΎΒ ΡΡΠΎΡΠΎΠ½Π½ΠΈΠΌΠΈ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ°ΠΌΠΈ β React
React ΠΌΠΎΠΆΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π²Β Π»ΡΠ±ΠΎΠΌ Π²Π΅Π±-ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΈ. ΠΠ½Β ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π²ΡΡΡΠΎΠ΅Π½ Π²Β Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ, ΠΈ, ΡΒ Π½Π΅ΠΊΠΎΡΠΎΡΡΠΌΠΈ ΠΎΠ³ΠΎΠ²ΠΎΡΠΊΠ°ΠΌΠΈ, Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΌΠΎΠ³ΡΡ Π²ΡΡΡΠ°ΠΈΠ²Π°ΡΡΡΡ Π²Β React. ΠΡΠΎ ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²ΠΎ ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°Π΅Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠ±ΡΠΈΠ΅ ΡΠ»ΡΡΠ°ΠΈ, ΡΒ ΡΠΏΠΎΡΠΎΠΌ Π½Π°Β ΠΈΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΡ ΡΒ jQuery ΠΈΒ Backbone. Π’Π΅Β ΠΆΠ΅ ΠΏΠΎΠ΄Ρ ΠΎΠ΄Ρ ΠΌΠΎΠ³ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π΄Π»Ρ ΠΈΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΠΈ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² ΡΒ Π»ΡΠ±ΡΠΌ ΡΡΡΠ΅ΡΡΠ²ΡΡΡΠΈΠΌ ΠΊΠΎΠ΄ΠΎΠΌ.
ΠΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΡ ΡΒ ΠΏΠ»Π°Π³ΠΈΠ½Π°ΠΌΠΈ, ΠΈΠ·ΠΌΠ΅Π½ΡΡΡΠΈΠΌΠΈ DOM
React Π½Π΅Β Π·Π½Π°Π΅Ρ ΠΏΡΠΎ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ DOM, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ΄Π΅Π»Π°Π½Ρ Π²Π½Π΅ React. ΠΠ½Β ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ Π½Π°Β ΠΎΡΠ½ΠΎΠ²Π΅ ΡΠ²ΠΎΠ΅Π³ΠΎ Π²Π½ΡΡΡΠ΅Π½Π½Π΅Π³ΠΎ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ, ΠΈΒ Π΅ΡΠ»ΠΈ ΠΎΠ΄Π½ΠΈ ΠΈΒ ΡΠ΅Β ΠΆΠ΅ DOM-ΡΠ·Π»Ρ ΡΠΏΡΠ°Π²Π»ΡΡΡΡΡ Π΄ΡΡΠ³ΠΈΠΌΠΈ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ°ΠΌΠΈ, ΡΠΎΒ ΡΡΠΎ Π½Π°ΡΡΡΠ°Π΅Ρ ΡΠ°Π±ΠΎΡΡ React Π±Π΅Π· Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ Π΅ΡΒ Π²ΠΎΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ.
ΠΡΠΎ Π½Π΅Β ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ ΡΠΎΠ΅Π΄ΠΈΠ½ΠΈΡΡ React ΡΒ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠ°ΠΌΠΈ ΡΠ°Π±ΠΎΡΡ ΡΒ DOM ΡΠ»ΠΎΠΆΠ½ΠΎ ΠΈΠ»ΠΈ Π½Π΅Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ. ΠΡΠΎΡΡΠΎ Π½ΡΠΆΠ½ΠΎ ΠΏΠΎΠΌΠ½ΠΈΡΡ, Π·Π°Β ΡΡΠΎ ΠΎΡΠ²Π΅ΡΠ°Π΅Ρ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ.
Π‘Π°ΠΌΡΠΉ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΠΈΠ·Π±Π΅ΠΆΠ°ΡΡ ΠΊΠΎΠ½ΡΠ»ΠΈΠΊΡΠΎΠ²Β β ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠΈΡΡ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°. ΠΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ΅ΡΠ΅Π· ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π΅Β Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡΡΡΡ React, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΡΡΡΠΎΠΉ <div />
.
ΠΠ°ΠΊ ΡΠ΅ΡΠΈΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ
ΠΠ»Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΈ Π΄Π°Π²Π°ΠΉΡΠ΅ Π½Π°Π±ΡΠΎΡΠ°Π΅ΠΌ ΠΎΠ±ΡΡΡΠΊΡ Π²ΠΎΠΊΡΡΠ³ ΠΎΠ±ΠΎΠ±ΡΡΠ½Π½ΠΎΠ³ΠΎ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½Π°.
ΠΡΒ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΠΌ ΡΠ΅Ρ Π½Π°Β ΠΊΠΎΡΠ½Π΅Π²ΠΎΠΉ DOM-ΡΠ»Π΅ΠΌΠ΅Π½Ρ. ΠΠ½ΡΡΡΠΈ componentDidMount
Π§ΡΠΎΠ±Ρ React Π½Π΅Β Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΎΠ²Π°Π» ΡΒ DOM ΠΏΠΎΡΠ»Π΅ ΠΌΠΎΠ½ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ, Π²Π΅ΡΠ½ΡΠΌ ΠΏΡΡΡΠΎΠΉ <div />
ΠΈΠ·Β ΠΌΠ΅ΡΠΎΠ΄Π° render()
. ΠΠ»Π΅ΠΌΠ΅Π½Ρ <div />
Π½Π΅Β ΠΈΠΌΠ΅Π΅Ρ Π½ΠΈΒ ΡΠ²ΠΎΠΉΡΡΠ², Π½ΠΈΒ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΡ
ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ², ΡΠ°ΠΊ ΡΡΠΎ Π΄Π»Ρ React Π½Π΅Ρ Π½ΠΈΠΊΠ°ΠΊΠΈΡ
ΠΏΡΠΈΡΠΈΠ½ Π΅Π³ΠΎ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡΡ. ΠΡΠΎ Π΄Π°ΡΡ jQuery ΠΏΠΎΠ»Π½ΡΡ ΡΠ²ΠΎΠ±ΠΎΠ΄Ρ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΡΡΠΎΠΉ ΡΠ°ΡΡΡΡ DOM:
class SomePlugin extends React.Component {
componentDidMount() {
this.$el = $(this.el); this.$el.somePlugin(); }
componentWillUnmount() {
this.$el.somePlugin('destroy'); }
render() {
return <div ref={el => this.el = el} />; }
}
ΠΠ°ΠΌΠ΅ΡΡΡΠ΅, ΡΡΠΎ ΠΌΡΒ ΠΎΠ±ΡΡΠ²ΠΈΠ»ΠΈ Π΄Π²Π° ΠΌΠ΅ΡΠΎΠ΄Π° ΠΆΠΈΠ·Π½Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠΈΠΊΠ»Π°Β β ΠΊΠ°ΠΊ
, ΡΠ°ΠΊ ΠΈΒ componentWillUnmount
. ΠΠ½ΠΎΠ³ΠΈΠ΅ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ DOM, ΠΏΠΎΡΡΠΎΠΌΡ Π²Π°ΠΆΠ½ΠΎ ΡΠ΄Π°Π»ΡΡΡ ΠΈΡ
Β Π²Π½ΡΡΡΠΈ componentWillUnmount
. ΠΡΠ»ΠΈ ΠΏΠ»Π°Π³ΠΈΠ½ Π½Π΅Β ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΌΠ΅ΡΠΎΠ΄ Π΄Π»Ρ ΠΎΡΠΈΡΡΠΊΠΈ, ΡΠΎ, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π²Π°ΠΌ ΠΏΡΠΈΠ΄ΡΡΡΡ Π½Π°ΠΏΠΈΡΠ°ΡΡ ΡΠ²ΠΎΠΉ. ΠΠΎΠΌΠ½ΠΈΡΠ΅ ΠΎΠ±Β ΡΠ΄Π°Π»Π΅Π½ΠΈΠΈ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² ΡΠΎΠ±ΡΡΠΈΠΉ, Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Π½ΡΡ
ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ, ΡΡΠΎΠ±Ρ ΠΈΠ·Π±Π΅ΠΆΠ°ΡΡ ΡΡΠ΅ΡΠ΅ΠΊ ΠΏΠ°ΠΌΡΡΠΈ.
ΠΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΡ ΡΒ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ Chosen
Π’Π΅ΠΏΠ΅ΡΡ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ. ΠΠ°Π²Π°ΠΉΡΠ΅ Π½Π°ΠΏΠΈΡΠ΅ΠΌ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΡΡ ΠΎΠ±ΡΡΡΠΊΡ Π΄Π»Ρ ΠΏΠ»Π°Π³ΠΈΠ½Π° Chosen, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΡΒ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ <select>
.
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅:
Π’ΠΎ, ΡΡΠΎ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ ΡΠΏΠΎΡΠΎΠ± ΡΠ°Π±ΠΎΡΠ°Π΅Ρ, ΡΠΎΠ²ΡΠ΅ΠΌ Π½Π΅Β Π·Π½Π°ΡΠΈΡ, ΡΡΠΎ ΡΡΠΎ ΠΎΠΏΡΠΈΠΌΠ°Π»ΡΠ½ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ React-ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ. ΠΡΒ ΡΠΎΠ²Π΅ΡΡΠ΅ΠΌ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°ΠΌΠΈ, ΠΊΠΎΠ³Π΄Π° ΡΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ. ΠΠ½ΠΈ ΡΠ²Π»ΡΡΡΡΡ ΡΠ°ΠΌΡΠΌ ΠΏΡΠΎΡΡΡΠΌ ΡΠΏΠΎΡΠΎΠ±ΠΎΠΌ ΠΏΠΎΠ²ΡΠΎΡΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΊΠΎΠ΄ Π²Β React-ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΈ, ΠΈΒ ΡΠ°ΡΡΠΎ Π΄Π°ΡΡ Π±ΠΎΠ»ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΡΠΎΠ»Ρ Π½Π°Π΄ ΡΠ²ΠΎΠΈΠΌ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ΠΌ ΠΈΒ Π²Π½Π΅ΡΠ½ΠΈΠΌ Π²ΠΈΠ΄ΠΎΠΌ.
ΠΠ»Ρ Π½Π°ΡΠ°Π»Π°, Π΄Π°Π²Π°ΠΉΡΠ΅ ΠΏΠΎΡΠΌΠΎΡΡΠΈΠΌ, ΡΡΠΎ Chosen Π΄Π΅Π»Π°Π΅Ρ ΡΒ DOM.
ΠΠΎΠ³Π΄Π° Π²ΡΒ Π²ΡΠ·ΡΠ²Π°Π΅ΡΠ΅ Π΅Π³ΠΎ Π½Π°Β DOM-ΡΠ·Π»Π΅ <select>
, ΠΎΠ½Β ΡΠΈΡΠ°Π΅Ρ Π°ΡΡΠΈΠ±ΡΡΡ ΡΡΠΎΠ³ΠΎ ΡΠ·Π»Π°, ΡΠΊΡΡΠ²Π°Π΅Ρ Π΅Π³ΠΎ ΡΒ ΠΏΠΎΠΌΠΎΡΡΡ Π²ΡΡΡΠΎΠ΅Π½Π½ΡΡ
ΡΡΠΈΠ»Π΅ΠΉ ΠΈΒ Π½Π΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠ΅ΡΠ΅Π΄ Π½ΠΈΠΌ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠΉ DOM-ΡΠ·Π΅Π» ΡΒ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΌ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΡΠΌ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ.
ΠΠΎΠΏΡΡΡΠΈΠΌ, ΠΌΡΒ Ρ
ΠΎΡΠΈΠΌ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²ΠΈΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ API Π΄Π»Ρ Π½Π°ΡΠ΅Π³ΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°-ΠΎΠ±ΡΡΡΠΊΠΈ Π½Π°Π΄ <Chosen>
:
function Example() {
return (
<Chosen onChange={value => console.log(value)}>
<option>Π²Π°Π½ΠΈΠ»Ρ</option>
<option>ΡΠΎΠΊΠΎΠ»Π°Π΄</option>
<option>ΠΊΠ»ΡΠ±Π½ΠΈΠΊΠ°</option>
</Chosen>
);
}
ΠΠ»Ρ ΠΏΡΠΎΡΡΠΎΡΡ ΠΌΡΒ Π±ΡΠ΄Π΅ΠΌ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²ΡΠ²Π°ΡΡ Π½Π΅ΡΠΏΡΠ°Π²Π»ΡΠ΅ΠΌΡΠΉ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ.
Π‘Π½Π°ΡΠ°Π»Π° ΡΠΎΠ·Π΄Π°Π΄ΠΈΠΌ ΠΏΡΡΡΠΎΠΉ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ, ΡΒ ΠΌΠ΅ΡΠΎΠ΄ΠΎΠΌ render()
<select>
, ΠΎΠ±ΡΡΠ½ΡΡΡΠΉ Π²Β <div>
:class Chosen extends React.Component {
render() {
return (
<div> <select className="Chosen-select" ref={el => this.el = el}> {this.props.children}
</select>
</div>
);
}
}
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΌΡΒ ΠΎΠ±Π΅ΡΠ½ΡΠ»ΠΈ <select>
Π²Β Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ <div>
. ΠΡΠΎ Π½ΡΠΆΠ½ΠΎ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ Chosen Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π½ΠΎΠ²ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΡΠ°Π·Ρ Π·Π°Β ΡΠ·Π»ΠΎΠΌ <select>
, Π½Π°Β ΠΊΠΎΡΠΎΡΠΎΠΌ ΠΎΠ½Β Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ. ΠΠΎΒ React Π²ΡΠ΅Π³Π΄Π° ΠΎΠΆΠΈΠ΄Π°Π΅Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π΄Π»Ρ
. Π’Π°ΠΊ ΠΌΡΒ Π³Π°ΡΠ°Π½ΡΠΈΡΡΠ΅ΠΌ, ΡΡΠΎ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ React Π½Π΅Β Π±ΡΠ΄ΡΡ ΠΊΠΎΠ½ΡΠ»ΠΈΠΊΡΠΎΠ²Π°ΡΡ ΡΒ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΡΠ·Π»ΠΎΠΌ, Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΠΌΡΠΌ Chosen. ΠΡΠ»ΠΈ Π²ΡΒ ΡΠΎΠ±ΠΈΡΠ°Π΅ΡΠ΅ΡΡ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ DOM Π²Π½Π΅ React, Π²Π°ΠΆΠ½ΠΎ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ React Π½Π΅Β Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΡΠ΅Ρ ΡΒ DOM-ΡΠ·Π»Π°ΠΌΠΈ.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΌ ΡΠ°Π³ΠΎΠΌ ΡΠ΅Π°Π»ΠΈΠ·ΡΠ΅ΠΌ ΠΌΠ΅ΡΠΎΠ΄Ρ ΠΆΠΈΠ·Π½Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠΈΠΊΠ»Π°. ΠΠ°ΠΌ Π½ΡΠΆΠ½ΠΎ ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ Chosen ΡΒ ΡΠ΅ΡΠΎΠΌ Π½Π°Β ΡΠ·Π»Π΅ <select>
Π²Β componentDidMount
, Π°Β Π·Π°ΡΠ΅ΠΌ ΡΠ±ΡΠ°ΡΡ Π΅Π³ΠΎ Π²Β componentWillUnmount
:
componentDidMount() {
this.$el = $(this.el); this.$el.chosen();}
componentWillUnmount() {
this.$el.chosen('destroy');}
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π°Β CodePen
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ React Π½Π΅Β ΠΏΡΠΈΠ΄Π°ΡΡ Π½ΠΈΠΊΠ°ΠΊΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΠΎΠ³ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΏΠΎΠ»Ρ
. ΠΠΎΠ΄ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΏΠΎΡΠΎΠΌΡ, ΡΡΠΎ ΡΠ°Π½Π΅Π΅ ΠΌΡΒ ΠΏΡΠΈΡΠ²ΠΎΠΈΠ»ΠΈ ΡΡΠΎΠΌΡ ΠΏΠΎΠ»Ρ ref
Π²Β ΠΌΠ΅ΡΠΎΠ΄Π΅ render()
:
<select className="Chosen-select" ref={el => this. el = el}>
ΠΡΠΎΠ³ΠΎ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ, ΡΡΠΎΠ±Ρ Π½Π°Ρ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ ΠΎΡΡΠ΅Π½Π΄Π΅ΡΠΈΠ»ΡΡ, Π½ΠΎΒ ΠΌΡΒ Π±Ρ Ρ
ΠΎΡΠ΅Π»ΠΈ ΠΏΠΎΠ»ΡΡΠ°ΡΡ ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΡ ΠΎΠ±Β ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΌΡΒ ΠΏΠΎΠ΄ΠΏΠΈΡΠ΅ΠΌΡΡ Π½Π°Β jQuery ΡΠΎΠ±ΡΡΠΈΠ΅ change
Π½Π°Β <select>
, ΡΠΏΡΠ°Π²Π»ΡΠ΅ΠΌΠΎΠΌ Chosen.
ΠΡΒ Π½Π΅Β ΡΡΠ°Π½Π΅ΠΌ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΡΡ Π²Β Chosen this.props.onChange
Π½Π°ΠΏΡΡΠΌΡΡ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΏΡΠΎΠΏΡΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ° ΠΌΠΎΠ³ΡΡ ΡΠΎΒ Π²ΡΠ΅ΠΌΠ΅Π½Π΅ΠΌ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡΡΡ (Π²Β ΡΠΎΠΌ ΡΠΈΡΠ»Π΅ ΠΈΒ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ). ΠΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ ΠΌΡΒ ΠΎΠ±ΡΡΠ²ΠΈΠΌ ΠΌΠ΅ΡΠΎΠ΄
, ΠΊΠΎΡΠΎΡΡΠΉ Π±ΡΠ΄Π΅Ρ Π²ΡΠ·ΡΠ²Π°ΡΡ this.props.onChange
, ΠΈΒ ΠΏΠΎΠ΄ΠΏΠΈΡΠ΅ΠΌ Π΅Π³ΠΎ Π½Π°Β jQuery-ΡΠΎΠ±ΡΡΠΈΠ΅ change
:
componentDidMount() {
this.$el = $(this.el);
this.$el.chosen();
this.handleChange = this.handleChange.bind(this); this.$el.on('change', this.handleChange);}
componentWillUnmount() {
this.$el.off('change', this.handleChange); this.$el.chosen('destroy');
}
handleChange(e) { this.props.onChange(e.target.value);}
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π°Β CodePen
ΠΒ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΠ΅ ΠΎΡΡΠ°Π»ΠΎΡΡ ΡΠ΄Π΅Π»Π°ΡΡ Π΅ΡΡ ΠΊΠΎΠ΅-ΡΡΠΎ.
<Chosen>
ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΠ»ΡΡΠ°ΡΡ ΡΠ°Π·Π½ΡΠ΅ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, Π΅ΡΠ»ΠΈ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ° ΠΈΠ·ΠΌΠ΅Π½ΡΠ΅ΡΡΡ. ΠΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ Π²Β ΡΠΎΡΠΊΠ΅ ΠΈΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΠΈ Π½Π°ΠΌ Π½ΡΠΆΠ½ΠΎ Π²ΡΡΡΠ½ΡΡ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡΡ DOM, Π²Β ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ ΡΒ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡΠΌΠΈ ΠΏΡΠΎΠΏ, ΡΠ°ΠΊ ΠΊΠ°ΠΊ React Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅Β ΡΠΏΡΠ°Π²Π»ΡΠ΅Ρ DOM Π΄Π»ΡΒ Π½Π°Ρ.ΠΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ Chosen ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ jQuery-ΠΌΠ΅ΡΠΎΠ΄ trigger()
, ΡΡΠΎΠ±Ρ ΡΠΎΠΎΠ±ΡΠΈΡΡ ΠΎΠ±Β ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡΡ
Π²Β ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»ΡΠ½ΠΎΠΌ DOM-ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅. ΠΡΒ ΠΏΠΎΡΡΡΠΈΠΌ React Π·Π°Π½ΠΈΠΌΠ°ΡΡΡΡ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ΠΌ this.props.children
Π²Π½ΡΡΡΠΈ <select>
, Π½ΠΎΒ Π½ΡΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΌΠ΅ΡΠΎΠ΄ ΠΆΠΈΠ·Π½Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠΈΠΊΠ»Π° componentDidUpdate()
, ΡΡΠΎΠ±Ρ ΡΠ²Π΅Π΄ΠΎΠΌΠ»ΡΡΡ Chosen ΠΏΡΠΎ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ ΡΠΏΠΈΡΠΊΠ° Π΄ΠΎΡΠ΅ΡΠ½ΠΈΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ²:
componentDidUpdate(prevProps) {
if (prevProps.children !== this.props.children) { this.$el.trigger("chosen:updated"); }
}
Π’Π°ΠΊΠΈΠΌ ΡΠΏΠΎΡΠΎΠ±ΠΎΠΌ Chosen ΡΠ·Π½Π°Π΅Ρ, ΡΡΠΎ Π½ΡΠΆΠ½ΠΎ ΠΎΠ±Π½ΠΎΠ²ΠΈΡΡ Π΅Π³ΠΎ DOM-ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΊΠΎΠ³Π΄Π° Π΄ΠΎΡΠ΅ΡΠ½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ <select>
Π±ΡΠ»ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ React.
ΠΠΎΠ»Π½Π°Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ Chosen
ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ° Π²ΡΠ³Π»ΡΠ΄ΠΈΡ ΡΠ°ΠΊ:
class Chosen extends React.Component {
componentDidMount() {
this.$el = $(this.el);
this.$el.chosen();
this.handleChange = this.handleChange.bind(this);
this.$el.on('change', this.handleChange);
}
componentDidUpdate(prevProps) {
if (prevProps.children !== this.props.children) {
this.$el.trigger("chosen:updated");
}
}
componentWillUnmount() {
this.$el.off('change', this.handleChange);
this.$el.chosen('destroy');
}
handleChange(e) {
this.props.onChange(e.target.value);
}
render() {
return (
<div>
<select className="Chosen-select" ref={el => this.el = el}>
{this.props.children}
</select>
</div>
);
}
}
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π°Β CodePen
ΠΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΡ ΡΒ Π΄ΡΡΠ³ΠΈΠΌΠΈ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΡΠΌΠΈ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ°ΠΌΠΈ
ΠΠ»Π°Π³ΠΎΠ΄Π°ΡΡ Π³ΠΈΠ±ΠΊΠΎΡΡΠΈ ReactDOM.render()
React ΠΌΠΎΠΆΠ΅Ρ Π²ΡΡΡΠ°ΠΈΠ²Π°ΡΡΡΡ Π²Β Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ.
Π₯ΠΎΡΡ ΠΎΠ±ΡΡΠ½ΠΎ React ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ Π΄Π»Ρ Π·Π°Π³ΡΡΠ·ΠΊΠΈ Π²Β DOM ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΊΠΎΡΠ½Π΅Π²ΠΎΠ³ΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°, ReactDOM.render()
ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π²ΡΠ·Π²Π°Π½ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ°Π· Π΄Π»Ρ Π½Π΅Π·Π°Π²ΠΈΡΠΈΠΌΡΡ
ΡΠ°ΡΡΠ΅ΠΉ UI. ΠΡΠΎ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ ΠΊΠ°ΠΊ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ, ΡΠ°ΠΊ ΠΈΒ Π±ΠΎΠ»ΡΡΠΈΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ.
ΠΠ°Β ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅, ΠΈΠΌΠ΅Π½Π½ΠΎ ΡΠ°ΠΊ React ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π²Β Facebook. ΠΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΈΡΠ°ΡΡ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ Π½Π°Β React ΠΏΠΎΒ ΡΠ°ΡΡΡΠΌ ΠΈΒ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½ΡΡΡ ΠΈΡ Β ΡΒ ΡΡΡΠ΅ΡΡΠ²ΡΡΡΠΈΠΌΠΈ Π³Π΅Π½Π΅ΡΠΈΡΡΠ΅ΠΌΡΠΌΠΈ ΡΠ΅ΡΠ²Π΅ΡΠΎΠΌ ΡΠ°Π±Π»ΠΎΠ½Π°ΠΌΠΈ ΠΈΒ Π΄ΡΡΠ³ΠΈΠΌ ΠΊΠ»ΠΈΠ΅Π½ΡΡΠΊΠΈΠΌ ΠΊΠΎΠ΄ΠΎΠΌ.
ΠΠ°ΠΌΠ΅Π½Π° ΡΡΡΠΎΠΊΠΎΠ²ΡΡ ΡΠ°Π±Π»ΠΎΠ½ΠΎΠ² ΡΒ ΠΏΠΎΠΌΠΎΡΡΡ React
Π Π°ΡΠΏΡΠΎΡΡΡΠ°Π½ΡΠ½Π½ΡΠΉ ΠΏΠΎΠ΄Ρ
ΠΎΠ΄ Π²Β ΡΡΠ°ΡΡΡ
Π²Π΅Π±-ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡΡ
Β β ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΡΠ°ΡΡΠ΅ΠΉ DOM c ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΡΠΎΠΊ (Π²ΡΠΎΠ΄Π΅ ${el.html(htmlString)
}). Π’Π°ΠΊΠΈΠ΅ ΡΡΠ°ΡΡΠΊΠΈ ΠΊΠΎΠ΄Π° ΠΏΡΠ΅ΠΊΡΠ°ΡΠ½ΠΎ ΠΏΠΎΠ΄Ρ
ΠΎΠ΄ΡΡ Π΄Π»Ρ Π²Π½Π΅Π΄ΡΠ΅Π½ΠΈΡ React. ΠΡΠΎΡΡΠΎ ΠΏΠ΅ΡΠ΅ΠΏΠΈΡΡΠ²Π°Π΅ΠΌ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³ Π½Π°Β ΠΎΡΠ½ΠΎΠ²Π΅ ΡΡΡΠΎΠΊ Π²Β React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ.
ΠΡΠ°ΠΊ, Π΅ΡΡΡ ΡΠ΅ΠΊΡΡΠ°Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ Π½Π°Β jQueryβ¦
$('#container').html('<button>Π‘ΠΊΠ°Π·Π°ΡΡ Β«ΠΡΠΈΠ²Π΅ΡΒ»</button>');
$('#btn').click(function() {
alert('ΠΡΠΈΠ²Π΅Ρ!');
});
β¦ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΏΠ΅ΡΠ΅ΠΏΠΈΡΠ°Π½Π° Π²Β React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ:
function Button() {
return <button>Π‘ΠΊΠ°Π·Π°ΡΡ Β«ΠΡΠΈΠ²Π΅ΡΒ»</button>;
}
ReactDOM. render(
<Button />,
document.getElementById('container'),
function() {
$('#btn').click(function() {
alert('ΠΡΠΈΠ²Π΅Ρ!');
});
}
);
ΠΒ Π΄Π°Π»ΡΡΠ΅ Π²ΡΒ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΡΠ°ΡΡ ΠΏΠ΅ΡΠ΅Π½ΠΎΡΠΈΡΡ Π»ΠΎΠ³ΠΈΠΊΡ Π²Π½ΡΡΡΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ° ΠΈΒ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΡΡΠ°Π»ΡΠ½ΡΠ΅ React-ΠΏΠΎΠ΄Ρ
ΠΎΠ΄Ρ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π²Β ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°Ρ
Π»ΡΡΡΠ΅ Π½Π΅Β ΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ Π½Π°Β ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡΡ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΎΠ΄ΠΈΠ½ ΠΈΒ ΡΠΎΡΒ ΠΆΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΎΡΡΠ΅Π½Π΄Π΅ΡΠ΅Π½ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎΒ ΡΠ°Π·. ΠΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ ΠΌΡΒ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌ ΡΠΎΠ±ΡΡΠΈΠΉΠ½ΡΡ ΡΠΈΡΡΠ΅ΠΌΡ React ΠΈΒ Π·Π°ΡΠ΅Π³ΠΈΡΡΡΠΈΡΡΠ΅ΠΌ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊ Π½Π΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ Π½Π°Β React-ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ <button>
:
function Button(props) {
return <button onClick={props.onClick}>Π‘ΠΊΠ°Π·Π°ΡΡ Β«ΠΡΠΈΠ²Π΅ΡΒ»</button>;}
function HelloButton() {
function handleClick() { alert('ΠΡΠΈΠ²Π΅Ρ!');
}
return <Button onClick={handleClick} />;}
ReactDOM.render(
<HelloButton />,
document.getElementById('container')
);
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π°Β CodePen
ΠΡΒ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π·Π°Π²Π΅ΡΡΠΈ ΡΡΠΎΠ»ΡΠΊΠΎ ΠΈΠ·ΠΎΠ»ΠΈΡΠΎΠ²Π°Π½Π½ΡΡ
ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ², ΡΠΊΠΎΠ»ΡΠΊΠΎ Π²Π°ΠΌ Π·Π°Ρ
ΠΎΡΠ΅ΡΡΡ. ΠΒ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ReactDOM.render()
Π΄Π»Ρ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³Π° Π²Β ΡΠ°Π·Π½ΡΠ΅ DOM-ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΡ. ΠΠΎΡΡΠ΅ΠΏΠ΅Π½Π½ΠΎ, ΠΏΠΎΒ ΠΌΠ΅ΡΠ΅ ΠΏΠ΅ΡΠ΅Π²ΠΎΠ΄Π° Π²Π°ΡΠ΅Π³ΠΎ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ Π½Π°Β React, Π²ΡΒ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡΠΎΠ²Π°ΡΡ ΠΈΡ
Β Π²Β Π±ΠΎΠ»ΡΡΠΈΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ ΠΈΒ ΠΏΠ΅ΡΠ΅Π½ΠΎΡΠΈΡΡ Π²ΡΠ·ΠΎΠ² ReactDOM.render()
Π²Π²Π΅ΡΡ
ΠΏΠΎΒ ΡΡΡΡΠΊΡΡΡΠ΅.
ΠΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌ React Π²Β ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ Backbone
ΠΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ Π²Β Backbone ΠΎΠ±ΡΡΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ HTML-ΡΡΡΠΎΠΊΠΈ ΠΈΠ»ΠΈ ΡΡΠ½ΠΊΡΠΈΠΈ, ΡΠΎΠ·Π΄Π°ΡΡΠΈΠ΅ ΡΡΡΠΎΠΊΠΎΠ²ΡΠ΅ ΡΠ°Π±Π»ΠΎΠ½Ρ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ DOM-ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ². ΠΡΠΎΡ ΠΌΠ΅Ρ Π°Π½ΠΈΠ·ΠΌ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π·Π°ΠΌΠ΅Π½ΡΠ½ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³ΠΎΠΌ React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ².
ΠΠΈΠΆΠ΅ ΠΌΡΒ ΡΠΎΠ·Π΄Π°Π΄ΠΈΠΌ Backbone-ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ParagraphView
. ΠΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡ ΠΌΠ΅ΡΠΎΠ΄ render()
(ΠΈΠ·Β Backbone.View
) Π΄Π»Ρ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³Π° React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ° <Paragraph>
Π²Β DOM-ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅ΠΌΡΠΉ Backbone (this.el
). Π’Π°ΠΊΠΆΠ΅ ΠΌΡΒ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΡ ReactDOM.render()
:
function Paragraph(props) { return <p>{props.text}</p>;
}
const ParagraphView = Backbone.View.extend({ render() {
const text = this. model.get('text');
ReactDOM.render(<Paragraph text={text} />, this.el); return this;
},
remove() {
ReactDOM.unmountComponentAtNode(this.el); Backbone.View.prototype.remove.call(this);
}
});
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π°Β CodePen
Π‘ΡΠΎΠΈΡ ΠΎΡΠΌΠ΅ΡΠΈΡΡ Π²ΡΠ·ΠΎΠ² ReactDOM.unmountComponentAtNode()
Π²Β ΠΌΠ΅ΡΠΎΠ΄Π΅ remove
. ΠΠ½Β Π½ΡΠΆΠ΅Π½ Π΄Π»Ρ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ React ΠΎΡΠΊΠ»ΡΡΠΈΠ» ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ ΠΈΒ Π΄ΡΡΠ³ΠΈΠ΅ ΡΠ΅ΡΡΡΡΡ, ΡΠ²ΡΠ·Π°Π½Π½ΡΠ΅ ΡΒ Π΄Π΅ΡΠ΅Π²ΠΎΠΌ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² ΠΏΡΠΈ ΡΠ΄Π°Π»Π΅Π½ΠΈΠΈ.
ΠΠΎΠ³Π΄Π° ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ ΡΠ΄Π°Π»ΡΠ΅ΡΡΡ ΠΈΠ·Β Π΄Π΅ΡΠ΅Π²Π° React ΠΈΠ·Π½ΡΡΡΠΈ, ΠΎΡΠΈΡΡΠΊΠ° ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ, Π½ΠΎΒ ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΌΡΒ ΡΠ΄Π°Π»ΡΠ΅ΠΌ ΡΡΡΠ½ΠΎΡΡΡ ΠΈΠ·Β Π΄Π΅ΡΠ΅Π²Π° Π²ΡΡΡΠ½ΡΡ, ΡΠΎΒ ΠΎΠ±ΡΠ·Π°Π½Ρ Π²ΡΠ·Π²Π°ΡΡ ΡΡΠΎΡ ΠΌΠ΅ΡΠΎΠ΄.
ΠΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΡ ΡΠΎΒ ΡΠ»ΠΎΠ΅ΠΌ ΠΌΠΎΠ΄Π΅Π»Π΅ΠΉ
ΠΠ±ΡΡΠ½ΠΎ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΠ΄Π½ΠΎΠ½Π°ΠΏΡΠ°Π²Π»Π΅Π½Π½ΡΠΉ ΠΏΠΎΡΠΎΠΊ Π΄Π°Π½Π½ΡΡ , Π²ΡΠΎΠ΄Π΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΡ React, Flux ΠΈΠ»ΠΈ Redux. ΠΠΎΒ React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ ΠΌΠΎΠ³ΡΡ ΡΠ°ΠΊΠΆΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ»ΠΎΠΉ Π΄Π°Π½Π½ΡΡ ΠΈΠ·Β Π΄ΡΡΠ³ΠΈΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ ΠΈΒ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠΎΠ².
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΌΠΎΠ΄Π΅Π»Π΅ΠΉ Backbone Π²Β React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°Ρ
Π‘Π°ΠΌΡΠΉ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΌΠΎΠ΄Π΅Π»ΠΈ ΠΈΒ ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΠΈ Backbone ΠΈΠ·Β React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ²Β β ΡΡΠΎ ΠΎΠ±ΡΠ°Π±ΠΎΡΠΊΠ° ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΠΎΠ±ΡΡΠΈΠΉ ΠΈΒ ΡΡΡΠ½ΠΎΠ΅ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ².
ΠΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ, ΠΎΡΠ²Π΅ΡΠ°ΡΡΠΈΠ΅ Π·Π°Β ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³ ΠΌΠΎΠ΄Π΅Π»Π΅ΠΉ, Π±ΡΠ΄ΡΡ ΠΎΠ±ΡΠ°Π±Π°ΡΡΠ²Π°ΡΡ ΡΠΎΠ±ΡΡΠΈΠ΅ 'change'
, Π°Β ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ, ΠΎΡΠ²Π΅ΡΠ°ΡΡΠΈΠ΅ Π·Π°Β ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³ ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΠΉ, Π±ΡΠ΄ΡΡ ΠΎΠ±ΡΠ°Π±Π°ΡΡΠ²Π°ΡΡ ΡΠΎΠ±ΡΡΠΈΡ 'add'
ΠΈΒ 'remove'
. ΠΒ ΠΎΠ±ΠΎΠΈΡ
ΡΠ»ΡΡΠ°ΡΡ
Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½ΠΎΠ²ΡΡ
Π΄Π°Π½Π½ΡΡ
Π½ΡΠΆΠ½ΠΎ Π²ΡΠ·Π²Π°ΡΡ this.forceUpdate()
.
ΠΒ ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ list
ΡΠ΅Π½Π΄Π΅ΡΠΈΡ Backbone-ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ Item
Π΄Π»Ρ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³Π° ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ².
class Item extends React.Component { constructor(props) {
super(props);
this.handleChange = this.handleChange.bind(this);
}
handleChange() { this.forceUpdate(); }
componentDidMount() {
this.props.model.on('change', this.handleChange); }
componentWillUnmount() {
this.props.model.off('change', this.handleChange); }
render() {
return <li>{this.props.model.get('text')}</li>;
}
}
class List extends React.Component { constructor(props) {
super(props);
this. handleChange = this.handleChange.bind(this);
}
handleChange() { this.forceUpdate(); }
componentDidMount() {
this.props.collection.on('add', 'remove', this.handleChange); }
componentWillUnmount() {
this.props.collection.off('add', 'remove', this.handleChange); }
render() {
return (
<ul>
{this.props.collection.map(model => (
<Item key={model.cid} model={model} /> ))}
</ul>
);
}
}
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π°Β CodePen
ΠΠΎΠ΄Ρ ΠΎΠ΄, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½ΡΠΉ Π²ΡΡΠ΅, ΡΡΠ΅Π±ΡΠ΅Ρ, ΡΡΠΎΠ±Ρ Π²Π°ΡΠΈ React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ Π·Π½Π°Π»ΠΈ ΠΎΒ Π½Π°Π»ΠΈΡΠΈΠΈ ΠΌΠΎΠ΄Π΅Π»Π΅ΠΉ ΠΈΒ ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΠΉ Backbone. ΠΡΠ»ΠΈ ΡΒ Π²Π°Ρ Π²Β ΠΏΠ»Π°Π½Π°Ρ Π΅ΡΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ Π½Π°Β Π΄ΡΡΠ³ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π΄Π°Π½Π½ΡΠΌΠΈ, Π²Ρ, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π·Π°Ρ ΠΎΡΠΈΡΠ΅ ΠΌΠ°ΠΊΡΠΈΠΌΠ°Π»ΡΠ½ΠΎ ΡΠΌΠ΅Π½ΡΡΠΈΡΡ ΡΠ²ΡΠ·Ρ ΡΒ Backbone.
ΠΠ΄ΠΈΠ½ ΠΈΠ·Β ΠΏΠΎΠ΄Ρ
ΠΎΠ΄ΠΎΠ²Β β ΠΊΠΎΠ³Π΄Π° ΠΏΡΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠΌ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ ΠΌΠΎΠ΄Π΅Π»ΠΈ, Π²ΡΒ ΠΈΠ·Π²Π»Π΅ΠΊΠ°Π΅ΡΠ΅ Π΅ΡΒ Π°ΡΡΠΈΠ±ΡΡΡ Π²Β Π²ΠΈΠ΄Π΅ ΠΏΡΠΎΡΡΡΡ
Π΄Π°Π½Π½ΡΡ
ΠΈΒ Ρ
ΡΠ°Π½ΠΈΡΠ΅ Π²ΡΡ Π»ΠΎΠ³ΠΈΠΊΡ Π²Β ΠΎΠ΄Π½ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅. Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ Π²ΡΡΡΠ΅Π³ΠΎ ΠΏΠΎΡΡΠ΄ΠΊΠ° ΠΈΠ·Π²Π»Π΅ΠΊΠ°Π΅Ρ Π²ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ Backbone-ΠΌΠΎΠ΄Π΅Π»ΠΈ Π²Β state
, ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°Ρ Π΄Π°Π½Π½ΡΠ΅ Π²Β ΠΎΠ±ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΡΠΉ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ.
ΠΡΠΈ ΡΡΠΎΠΌ ΠΏΠΎΠ΄Ρ ΠΎΠ΄Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ Π²ΡΡΡΠ΅Π³ΠΎ ΠΏΠΎΡΡΠ΄ΠΊΠ° Π±ΡΠ΄ΡΡ Π·Π½Π°ΡΡ ΠΎΒ Backbone-ΠΌΠΎΠ΄Π΅Π»ΡΡ , Π°Β Π±ΠΎΠ»ΡΡΠ°Ρ ΡΠ°ΡΡΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² Π²Β ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΈ Π½Π΅Β Π±ΡΠ΄Π΅Ρ Π·Π°Π²ΡΠ·Π°Π½Π° Π½Π°Β Backbone.
ΠΒ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π½ΠΈΠΆΠ΅, ΠΌΡΒ ΡΠ΄Π΅Π»Π°Π΅ΠΌ ΠΊΠΎΠΏΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² ΠΌΠΎΠ΄Π΅Π»ΠΈ Π΄Π»Ρ ΡΠΎΡΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΡ Π½Π°ΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΠΎΡΡΠΎΡΠ½ΠΈΡ. ΠΡΒ ΠΏΠΎΠ΄ΠΏΠΈΡΠ΅ΠΌΡΡ Π½Π°Β ΡΠΎΠ±ΡΡΠΈΠ΅ change
(ΠΈΒ ΠΎΡΠΏΠΈΡΠ΅ΠΌΡΡ ΠΎΡΒ Π½Π΅Π³ΠΎ ΠΏΡΠΈ ΡΠ΄Π°Π»Π΅Π½ΠΈΠΈ), ΠΈΒ ΠΊΠΎΠ³Π΄Π° ΠΎΠ½ΠΎ Π±ΡΠ΄Π΅Ρ Π²ΠΎΠ·Π½ΠΈΠΊΠ°ΡΡ, ΠΌΡΒ ΠΎΠ±Π½ΠΎΠ²ΠΈΠΌ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠΈΠΌΠΈ Π°ΡΡΠΈΠ±ΡΡΠ°ΠΌΠΈ. ΠΠ°ΠΊΠΎΠ½Π΅Ρ, ΠΌΡΒ ΡΠ±Π΅Π΄ΠΈΠΌΡΡ, ΡΡΠΎ Π΅ΡΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΡΠ΅ΡΡΡ ΡΠ°ΠΌ ΠΏΡΠΎΠΏ model
, ΠΌΡΒ Π½Π΅Β Π·Π°Π±ΡΠ²Π°Π΅ΠΌ ΠΎΡΠΏΠΈΡΠ°ΡΡΡΡ ΠΎΡΒ ΡΡΠ°ΡΠΎΠΉ ΠΌΠΎΠ΄Π΅Π»ΠΈ ΠΈΒ ΠΏΠΎΠ΄ΠΏΠΈΡΠ°ΡΡΡΡ Π½Π°Β Π½ΠΎΠ²ΡΡ.
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΠΏΡΠΈΠΌΠ΅Ρ Π½ΠΈΠΆΠ΅ Π½Π΅Β ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΠΎΠ»Π½ΡΠΌ Π²Β ΠΎΡΠ½ΠΎΡΠ΅Π½ΠΈΠΈ ΡΠ°Π±ΠΎΡΡ ΡΒ Backbone. ΠΠΎΒ ΠΎΠ½Β Π΄ΠΎΠ»ΠΆΠ΅Π½ Π΄Π°ΡΡ Π²Π°ΠΌ ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΎΠ±ΡΠ΅Π³ΠΎ ΠΏΠΎΠ΄Ρ ΠΎΠ΄Π°:
function connectToBackboneModel(WrappedComponent) { return class BackboneComponent extends React.Component {
constructor(props) {
super(props);
this.state = Object.assign({}, props.model.attributes); this.handleChange = this.handleChange.bind(this);
}
componentDidMount() {
this. props.model.on('change', this.handleChange); }
componentWillReceiveProps(nextProps) {
this.setState(Object.assign({}, nextProps.model.attributes)); if (nextProps.model !== this.props.model) {
this.props.model.off('change', this.handleChange); nextProps.model.on('change', this.handleChange); }
}
componentWillUnmount() {
this.props.model.off('change', this.handleChange); }
handleChange(model) {
this.setState(model.changedAttributes()); }
render() {
const propsExceptModel = Object.assign({}, this.props);
delete propsExceptModel.model;
return <WrappedComponent {...propsExceptModel} {...this.state} />; }
}
}
ΠΠ»Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΌΡΒ ΡΠΎΠ΅Π΄ΠΈΠ½ΠΈΠΌ React-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ NameInput
ΠΈΒ Backbone-ΠΌΠΎΠ΄Π΅Π»Ρ ΠΈΒ Π±ΡΠ΄Π΅ΠΌ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡΡ Π΅ΡΒ Π°ΡΡΠΈΠ±ΡΡ firstName
ΠΏΡΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠΌ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ ΠΏΠΎΠ»Ρ Π²Π²ΠΎΠ΄Π°:
function NameInput(props) {
return (
<p>
<input value={props. firstName} onChange={props.handleChange} /> <br />
ΠΠΎΡ ΠΈΠΌΡ - {props.firstName}. </p>
);
}
const BackboneNameInput = connectToBackboneModel(NameInput);
function Example(props) {
function handleChange(e) {
props.model.set('firstName', e.target.value); }
return (
<BackboneNameInput model={props.model} handleChange={handleChange} />
);
}
const model = new Backbone.Model({ firstName: 'Π€ΡΠΎΠ΄ΠΎ' });
ReactDOM.render(
<Example model={model} />,
document.getElementById('root')
);
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π°Β CodePen
ΠΡΠΎΡ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ Π½Π΅Β ΠΎΠ³ΡΠ°Π½ΠΈΡΠΈΠ²Π°Π΅ΡΡΡ Backbone. ΠΡΒ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ React ΡΒ Π»ΡΠ±ΠΎΠΉ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΎΠΉ Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ ΡΒ Π΄Π°Π½Π½ΡΠΌΠΈ, ΠΏΡΠΎΡΡΠΎ ΠΏΠΎΠ΄ΠΏΠΈΡΡΠ²Π°ΡΡΡ Π½Π°Β ΠΌΠ΅ΡΠΎΠ΄Ρ ΠΆΠΈΠ·Π½Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠΈΠΊΠ»Π° ΠΈ, ΠΏΡΠΈ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ, ΠΊΠΎΠΏΠΈΡΡΡ Π΄Π°Π½Π½ΡΠ΅ Π²ΠΎΒ Π²Π½ΡΡΡΠ΅Π½Π½Π΅Π΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ React.
40 ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² JQuery, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠ³ΡΡ Π²Π°ΠΌ ΠΏΡΠΈΠ³ΠΎΠ΄ΠΈΡΡΡΡ
Π Π°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈΒ jQuery, ΠΏΠΎΠΆΠ°Π»ΡΠΉ, ΠΎΠ΄Π½ΠΈ ΠΈΠ· ΡΠ°ΠΌΡΡ ΡΡΡΠ΄ΠΎΠ»ΡΠ±ΠΈΠ²ΡΡ ΠΈ ΡΠ΅Π΄ΡΡΡ Π»ΡΠ΄Π΅ΠΉ Π² ΠΠ½ΡΠ΅ΡΠ½Π΅ΡΠ΅. Β Π‘Π΅Π³ΠΎΠ΄Π½Ρ ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Π΄Π»Ρ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΠΎΠ³ΠΎ ΡΠΊΠ°ΡΠΈΠ²Π°Π½ΠΈΡ. ΠΠ°Π²Π°ΠΉΡΠ΅ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠ· Π½ΠΈΡ . ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π² ΡΡΠΎΠΌ ΡΠΏΠΈΡΠΊΠ΅ Π²Ρ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΠΉΡΠΈ Π½ΠΎΠ²ΡΠ΅ Π΄Π»Ρ ΡΠ΅Π±Ρ ΠΏΠ»Π°Π³ΠΈΠ½Ρ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΌΠΎΠ³Π»ΠΈΒ Π±Ρ Π²Π°ΠΌ ΠΏΡΠΈΠ³ΠΎΠ΄ΠΈΡΡΡΡ.Β ΠΠ»Ρ ΡΠ΄ΠΎΠ±Π½ΠΎΠ³ΠΎ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° Π²ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠ°Π·Π΄Π΅Π»Π΅Π½Ρ Π½Π° ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΠΈΒ ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΠΈ.
Β
Β
Β
Scrolling
jQueryΒ Waypoints
jQuery WaypointsΒ —Β ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ Π΄Π²ΠΈΠΆΠ΅Π½ΠΈΡ ΠΎΠ±ΡΠ΅ΠΊΡΠΎΠ² ΠΏΠΎ Π½Π°Π±ΠΎΡΡΒ ΡΠΎΡΠ΅ΠΊ.
skrollr
Β
Skrollr ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ ΡΠΎ Π²ΡΠ΅ΠΌΠΈ Π²ΠΈΠ΄Π°ΠΌΠΈ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ², Π²ΠΊΠ»ΡΡΠ°Ρ ΡΡΠ°Π½ΡΡΠΎΡΠΌΠ°ΡΠΈΡ, ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ²Π΅ΡΠ° ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅Β Π΄ΡΡΠ³ΠΎΠ΅.
ΠΡΠ°ΡΠΈΠΊΠΈ, ΡΠ°Π±Π»ΠΈΡΡ ΠΈΒ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ
HandsontableΒ
HandsontableΒ β ΡΡΠΎ Β Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΉΒ jQuery ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ Π²Π°Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡΒ Excel ΡΠ°Π±Π»ΠΈΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Β HTML ΠΈ jQuery. ΠΡ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ Π΄ΠΎΠ»ΠΆΠ½Ρ ΠΈΠΌΒ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ.
jQueryΒ Sparklines
jQuery Sparklines —Β ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠΏΠΎΡΠΎΠ±Π΅Π½ Π³Π΅Π½Π΅ΡΠΈΡΠΎΠ²Π°ΡΡ Π»ΠΈΠ½Π΅ΠΉΠ½ΡΠ΅ Π³ΡΠ°ΡΠΈΠΊΠΈ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ Π΄Π°Π½Π½ΡΠ΅, ΡΠΊΠ°Π·Π°Π½Π½ΡΠ΅ Π² HTML,Β Π»ΠΈΠ±ΠΎ Π²Β JavaScript.
TeamworkΒ Gantt
Teamwork Gantt ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΠΉ jQuery-ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ, ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π½Π½ΡΠΉ Teamwork, Β ΠΊΠΎΡΠΎΡΡΠΉ ΡΠΏΡΠΎΡΠ°Π΅Ρ ΠΏΡΠΎΡΠ΅ΡΡ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΒ ΠΠ°Π½ΡΠ°.
DataTables
JQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²ΠΏΠ΅ΡΠ°ΡΠ»ΡΡΡΠΈΡ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΡ ΡΠ°Π±Π»ΠΈΡ Ρ Π΄Π°Π½Π½ΡΠΌΠΈ. .ΠΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π΄Π΅Π»Π°ΡΡ ΡΠΎΡΡΠΈΡΠΎΠ²ΠΊΡ ΠΏΠΎ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΠΌ ΡΡΠΎΠ»Π±ΡΠ°ΠΌ Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ΠΌ ΡΠΈΠΏΠΎΠ² Π΄Π°Π½Π½ΡΡ , ΡΠΌΠ°ΡΡ-ΠΎΠ±ΡΠ°Π±ΠΎΡΠΊΡ ΡΠΈΡΠΈΠ½Ρ ΡΡΠΎΠ»Π±ΡΠΎΠ² ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅Β Π΄ΡΡΠ³ΠΎΠ΅.
arbor.js
Arbor.js ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΡ, Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΊΠΎΡΠΎΡΠΎΠΉ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΠΈΠ·ΡΠ°Π»ΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΡ ΠΈΒ Π³ΡΠ°ΡΠΈΠΊΠΈ.
ΠΠ°ΠΊΠ΅ΡΡ
Wookmark jQueryΒ Plugin
Wookmark jQuery PluginΒ —Β jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ½ΡΡ Β ΠΌΡΠ»ΡΡΠΈ-ΠΊΠΎΠ»ΠΎΠ½ΠΎΠΊ.
jQueryΒ Masonry
ΠΡΠΎ JQuery-ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΠΉ Π±ΡΡΡΡΠΎ ΠΈ ΠΏΡΠΎΡΡΠΎ ΠΎΡΠ³Π°Π½ΠΈΠ·ΠΎΠ²Π°ΡΡ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΌΠ°ΠΊΠ΅Ρ Π±Π»ΠΎΠΊΠΎΠ² ΡΠ°Π·Π½ΠΎΠ³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π±Π΅Π· ΠΏΠΎΡΠ΅ΡΠΈΒ ΠΌΠ΅ΡΡΠ°.
Isotope
IsotopeΒ β ΠΈΠ·ΡΡΠΊΠ°Π½Π½ΡΠΉΒ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉ ΡΠΎΡΡΠΈΡΠΎΠ²ΠΊΠΈ Π΄Π°Π½Π½ΡΡ Π² Π±Π»ΠΎΠΊΠ°Ρ . ΠΠΎΠΆΠ½ΠΎ ΡΠΊΡΡΠ²Π°ΡΡ ΠΈ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°ΡΡ Π΄Π°Π½Π½ΡΠ΅ ΠΏΠΎ ΠΏΡΠΈΠ·Π½Π°ΠΊΠ°ΠΌ, ΡΠΎΡΡΠΈΡΠΎΠ²Π°ΡΡ, ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡ Π½Π°Β ΡΡΡΠ°Π½ΠΈΡΠ΅.
FitVids.JS
ΠΠ΅Π³ΠΊΠΈΠΉ, ΠΏΡΠΎΡΡΠΎΠΉ Π² ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈΒ Β JQueryΒ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ ΡΒ Π²ΠΈΠ΄Π΅ΠΎ.
gridster.js
Gridster ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΎΡΡΡΠΎΠΈΡΡ ΠΌΠ½ΠΎΠ³ΠΎΠΊΠΎΠ»ΠΎΠ½ΠΎΡΠ½ΡΠΉ ΡΠ°Π±Π»ΠΎΠ½ Ρ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡΡ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ΠΈΡΒ ΡΡΠ΅Π΅ΠΊ.
Freetile.js
Freetile ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π»ΡΠ±ΠΎΠ³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°, ΠΊΠ°ΠΊΒ Π΄Π»Ρ ΠΎΠ±ΡΡΠ½ΠΎΠ³ΠΎ, ΡΠ°ΠΊ ΠΈΒ Π΄Π»Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠ³ΠΎΒ Π΄ΠΈΠ·Π°ΠΉΠ½Π°.
Π’Π΅ΠΊΡΡ
jQuery ΠΏΠ»Π°Π³ΠΈΠ½Β TextExtΒ
TextExt Β — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ JQuery, ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½ Π΄Π»Ρ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠ΅Π½ΠΈΡ ΡΡΠ½ΠΊΡΠΈΠΉ Π²Π²ΠΎΠ΄Π° ΡΠ΅Π³ΠΎΠ² ΠΈΒ Π°Π²ΡΠΎΠ·Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ.Β
Jeditable
Jeditable ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΠ΅ HTML ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΠΊΠΎΡΠΎΡΡΠ΅ Β ΠΌΠΎΠ³ΡΡ ΡΠ΅Π΄Π°ΠΊΡΠΈΡΠΎΠ²Π°ΡΡΒ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ.Β
FitText
ΠΠ»Π°Π³ΠΈΠ½ FixText ΠΏΡΠΈΠ²ΡΠ·ΡΠ²Π°Π΅Ρ ΡΠ°Π·ΠΌΠ΅Ρ ΡΡΠΈΡΡΠ° ΠΊ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΠΌ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠ΅Π³ΠΎ Π΅Π³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΡΠΎ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΎΡΠ΅Π½Ρ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ ΠΏΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠ³ΠΎΒ Π΄ΠΈΠ·Π°ΠΉΠ½Π°.Β
UI
jQueryΒ Knob
ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΊΡΡΠ³ΠΎΠ²ΡΠ΅Β ΠΊΠ½ΠΎΠ±Ρ. Β
NotyΒ β JQuery ΠΏΠ»Π°Π³ΠΈΠ½Β ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΠΉ
NotyΒ β JQuery ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π»Π΅Π³ΠΊΠΎ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡΒ ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΡ (alert, success, error, warning, information) Β ΠΈΠ»ΠΈ ΠΏΡΠΎΡΡΠΎ Π·Π°ΠΌΠ΅Π½ΡΡΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΡΠ΅Β Π°Π»Π΅ΡΡΡ.
PageSlide
ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΡΠΊΡΡΡΡΠ΅ Π²ΡΡΠ°Π²Π½ΡΠ΅ Π±ΠΎΠΊΠΎΠ²ΡΠ΅ ΠΏΠ°Π½Π΅Π»ΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠ³ΡΡ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ Π»ΡΠ±ΡΡ Π½ΡΠΆΠ½ΡΡΒ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ.Β
jQueryΒ Collapse
ΠΠ΅Π³ΠΊΠΎΠ΅ ΠΌΠΎΠ΄ΡΠ»ΡΠ½ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ ΠΏΡΠΎΡΡΠΎΠΉ ΠΎΡΠ³Π°Π½ΠΈΠ·Π°ΡΠΈΠΈ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ ΡΡΒ ΠΏΠ°Π½Π΅Π»Π΅ΠΉ.
Avgrund
ΠΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΏΡΠΎΡΡΠΎΠΉ ΡΡΡΠ΅ΠΊΡ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉΒ ΡΡΡΠ°Π½ΠΈΡΡ.Β
jQuery One PageΒ Navigation
ΠΠ»Π°Π²Π½Π°Ρ ΠΏΡΠΎΠΊΡΡΡΠΊΠ° ΠΊ Π½ΡΠΆΠ½ΠΎΠΌΡ ΡΠ°Π·Π΄Π΅Π»Ρ Π½Π°Β ΡΡΡΠ°Π½ΠΈΡΠ΅.
jqPagination
ΠΡΠ»ΠΈΡΠ½ΡΠΉ Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠ°Π·Π±ΠΈΠ΅Π½ΠΈΡ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π²Π²Π΅ΡΡΠΈ Π½ΠΎΠΌΠ΅Ρ Π½ΡΠΆΠ½ΠΎΠΉΒ ΡΡΡΠ°Π½ΠΈΡΡ.
jQuery Joyride Feature TourΒ Plugin
ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΎΡΒ ZURB, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΏΡΠ°Π²Π»ΡΡΡ ΠΏΡΠΎΡΠ΅ΡΡΠΎΠΌ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ ΠΏΠΎΡΠ΅ΡΠΈΡΠ΅Π»Π΅ΠΉ Ρ ΡΡΡΠΎΠΌ ΠΏΠΎ Π²Π°ΡΠ΅ΠΌΡΒ ΡΠ°ΠΉΡΡ
ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅Β ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ
jQueryΒ PowerTip
ΠΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π½Π°Π΄Π΅ΠΆΠ½ΡΠΉ ΠΈ ΠΌΠΎΡΠ½ΡΠΉΒ JQueryΒ ΠΏΠ»Π°Π³ΠΈΠ½ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ Β ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ.
tipsy
ΠΡΡΠ³ΠΎΠΉ ΠΎΡΠ»ΠΈΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ.Β ΠΠ°Π΅Ρ Π½Π°ΠΌ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Π²Β ΡΡΠΈΠ»Π΅Β Β Facebook.Β
Π‘Π»Π°ΠΉΠ΄Π΅ΡΡ
jQuery SliderΒ Shock
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΡΠΉ JQuery / WordPress ΡΠ»Π°ΠΉΠ΄Π΅Ρ Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎΠΌ Π½Π°ΡΡΡΠΎΠ΅ΠΊ, ΡΡΠΈΠ»Π΅ΠΉ ΠΈΒ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠ΅ΠΉ.Β
Backstretch
Backstretch -ΡΠ»Π°ΠΉΠ΄Π΅Ρ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡ ΡΠΎΠ½ΠΎΠ²ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π΄Π»Ρ Π»ΡΠ±ΠΎΠΉ ΡΡΡΠ°Π½ΠΈΡΡΒ ΠΈΠ»ΠΈΒ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.
jQueryΒ Anystretch
Anystretch ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ JQuery , ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΡΠΎΠ½ΠΎΠ²ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½Π° Π»ΡΠ±ΡΡ ΡΡΡΠ°Π½ΠΈΡΡΒ ΠΈΠ»ΠΈ Π±Π»ΠΎΡΠ½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ.Β ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π±ΡΠ΄Π΅Ρ ΡΠ°ΡΡΡΠ³ΠΈΠ²Π°ΡΡΡΡ, ΡΡΠΎΠ±Ρ ΠΏΠΎΠΌΠ΅ΡΠ°ΡΡΡΡ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΈ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΏΡΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠ°Β ΠΎΠΊΠ½Π°.
jQueryΒ Lightbox
FlexSliderΒ 2
FlexSlider ΡΠ²Π»ΡΠ΅ΡΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠΌΒ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠΎΠΌ.Β
ColorBox
ΠΡΠ΅ ΠΎΠ΄ΠΈΠ½ ΠΏΡΠΎΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π»Π°ΠΉΡΠ±ΠΎΠΊΡ.Β ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠ° ΡΠΎΡΠΎ, Π³ΡΡΠΏΠΏΠΈΡΠΎΠ²ΠΊΠ°, ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ, AJAX, inline, ΠΈ iframedΒ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. Β
WOWΒ Slider
ΠΡΠΊΠ²Π°Π»ΡΠ½ΠΎ ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· Π»ΡΡΡΠΈΡ , ΡΠ°ΠΌΡΠΉ ΠΌΠΎΡΠ½ΡΠΉ ΠΈ ΠΏΠΎΠ»Π½ΠΎΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΉ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠΎΠ².Β ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΡΠΉ, ΠΈΠΌΠ΅Π΅Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΎΠ².Β Β
ΠΡΡΠ³ΠΈΠ΅
Timeago
ΠΡΡΡΡΡΠΉ, Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ»Π΅Π΄ΠΈΡ Π·Π° Π²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌΠΈ ΠΎΡΠΌΠ΅ΡΠΊΠ°ΠΌΠΈ ΠΈ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΎΠ±Π½ΠΎΠ²Π»ΡΠ΅ΡΒ ΠΈΡ ,
JQueryΒ ΠΏΡΠΎΠ²Π΅ΡΠΊΠ°
jQuery Validation PluginΒ ΡΠΌΠ΅Π΅Ρ ΠΏΡΠΎΠ²Π΅ΡΡΡΡ ΡΠΎΡΠΌΡ Π½Π° ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎΡΡΡ Π·Π°ΠΏΠΎΠ»Π΅Π½Π½ΡΡ Β Π΄Π°Π½Π½ΡΡ .
jQuery File UploadΒ Demo
ΠΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ Π½Π°Π΄Π΅ΠΆΠ½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ°Β ΡΠ°ΠΉΠ»ΠΎΠ².
jQueryΒ Instagram
ΠΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΡ Ρ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡΠΌΠΈ Ρ Instagram ΠΏΠΎ Π·Π°Π΄Π°Π½Π½ΠΎΠΌΡ ΡΠ΅Π³ΡΒ ΠΈΠ»ΠΈ Π³Π΅ΠΎΠ³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΌΒ ΠΊΠΎΠΎΡΠ΄ΠΈΠ½Π°ΡΠ°ΠΌ.
jQuery ShadowΒ Plugin
ΠΠΎΠΌΠΎΠΆΠ΅Ρ Π»Π΅Π³ΠΊΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π²ΡΠ΅ Π²ΠΈΠ΄Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΠ΅Π½Π΅ΠΉ Β ΠΊΒ HTML-ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ.
MotionCAPTCHA
MotionCAPTCHAΒ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ Π²Π°ΠΌ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠΈΠΏΡ ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ-ΠΊΡΠΏΡΠ΅ΠΉ, Π²ΠΊΠ»ΡΡΠ°Ρ Π΄Π°ΠΆΠ΅ ΡΠΈΡΡΠ΅ΠΌΡ, ΠΊΠΎΠ³Π΄Π° ΡΠ΅Π»ΠΎΠ²Π΅ΠΊ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π½Π°ΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠ²ΠΈΠ΄Π΅Π½Π½ΡΡ ΡΠΈΠ³ΡΡΡ Π² ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΠΎΠΌΒ ΠΏΠΎΠ»Π΅.
jQueryΒ Transit
CSS3 ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΠΎΠ²Π°Π½ΠΈΡ ΠΈ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Ρ Π΄Π»Ρ JQuery.Β ΠΠΎΠ²ΠΎΡΠΎΡ, ΠΏΠ΅ΡΡΠΏΠ΅ΠΊΡΠΈΠ²Π°, Π½Π°ΠΊΠ»ΠΎΠ½, ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅Β Π΄ΡΡΠ³ΠΎΠ΅.
ΠΠ²ΡΠΎΡ:Β JoshuaΒ Johnson
ΠΠ΅ΡΠ΅Π²ΠΎΠ΄Β βΒ ΠΠ΅ΠΆΡΡΠΊΠ°
Π‘ΠΌΠΎΡΡΠΈΡΠ΅Β ΡΠ°ΠΊΠΆΠ΅:
50 ΠΏΠΎΠ»Π΅Π·Π½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² JQueryΒ 2012Β Π³ΠΎΠ΄Π°
Β
10 Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΡ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² / ΠΠΎΠ»Π΅Π·Π½ΠΎΠ΅ / Π‘Π°ΠΉΡΡ ΠΈ Π±ΠΈΡΠΆΠΈ ΡΡΠΈΠ»Π°Π½ΡΠ°. ΠΠ±Π·ΠΎΡΡ ΡΡΠΈΠ»Π°Π½Ρ Π±ΠΈΡΠΆ. ΠΠΎΠ²ΠΎΡΡΠΈ. Π‘ΠΎΠ²Π΅ΡΡ. Π€ΡΠΈΠ»Π°Π½Ρ Π΄Π»Ρ Π½Π°ΡΠΈΠ½Π°ΡΡΠΈΡ . FREELANCE.TODAY
Π‘ ΠΌΠΎΠΌΠ΅Π½ΡΠ° ΠΏΠΎΡΠ²Π»Π΅Π½ΠΈΡ jQuery ΠΏΡΠΎΡΠ»ΠΎ ΠΏΠΎΡΡΠΈ 10 Π»Π΅Ρ ΠΈ Π½Π° ΡΠ΅Π³ΠΎΠ΄Π½ΡΡΠ½ΠΈΠΉ Π΄Π΅Π½Ρ ΡΡΠΎ ΡΠ°ΠΌΠ°Ρ ΠΏΠΎΠΏΡΠ»ΡΡΠ½Π°Ρ JavaScript-Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ°. ΠΠ΅ΡΡΡΡ Π»Π΅Ρ Π½Π°Π·Π°Π΄ Π΄ΠΎΡΡΡΠΏ Π² ΠΈΠ½ΡΠ΅ΡΠ½Π΅Ρ Π±ΡΠ» Π²ΠΎΠ·ΠΌΠΎΠΆΠ΅Π½ ΡΠ΅ΡΠ΅Π· ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Π½ΠΎΠ΅ ΡΠΈΡΠ»ΠΎ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ², ΡΠΏΡΠΎΠ΅ΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΡ ΡΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΡΡΠΎΠ±Ρ Β ΡΠ²Π΅ΡΡΠΈ ΠΊ ΠΌΠΈΠ½ΠΈΠΌΡΠΌΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΌΠ°Π½ΠΈΠΏΡΠ»ΠΈΡΠΎΠ²Π°Π½ΠΈΡ HTML DOM (Document Object Model). JQuery ΠΎΠΊΠ°Π·Π°Π»ΡΡ ΠΏΠ°Π»ΠΎΡΠΊΠΎΠΉ-Π²ΡΡΡΡΠ°Π»ΠΎΡΠΊΠΎΠΉ Π΄Π»Ρ ΠΌΠ½ΠΎΠ³ΠΈΡ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ², ΡΡΡΠ΅ΠΌΠΈΠ²ΡΠΈΡ ΡΡ ΠΊ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠΌΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΡΠ°ΠΉΡΠΎΠ² Π²ΠΎ Π²ΡΠ΅Ρ ΡΡΡΠ΅ΡΡΠ²ΡΡΡΠΈΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ . Π Π°Π·Π²ΠΈΠ²Π°Π²ΡΠΈΠ΅ jQuery ΡΠ½ΡΡΠ·ΠΈΠ°ΡΡΡ ΡΡΡΠ΅ΠΌΠΈΠ»ΠΈΡΡ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½ΠΈΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ² ΠΈ ΡΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΡΠΎΠ·Π΄Π°ΡΡ ΠΎΠ±ΡΠΈΠΉ Π΄Π»Ρ Π²ΡΠ΅Ρ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ, ΠΊΠΎΡΠΎΡΡΠΉ Π±ΡΠ΄Π΅Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π½Π΅Π·Π°Π²ΠΈΡΠΈΠΌΠΎ ΠΎΡ ΡΠΈΠΏΠ° ΠΈ Π²Π΅ΡΡΠΈΠΈ Π±ΡΠ°ΡΠ·Π΅ΡΠ°. ΠΡΠ½ΠΎΠ²Π½Π°Ρ Π·Π°ΡΠ»ΡΠ³Π° ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² ΡΠΎΡΡΠΎΠΈΡ Π² ΡΠΎΠΌ, ΡΡΠΎ ΠΎΠ½ΠΈ ΡΠΎΠ·Π΄Π°Π»ΠΈ Π½ΠΎΠ²ΡΠ΅ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΡ API, ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠ»ΠΈ Π»ΡΡΡΠ΅ Β«ΡΠΎΠ΄Π½ΡΡ Β» Π±ΡΠ°ΡΠ·Π΅ΡΠ½ΡΡ ΠΈ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Π»ΠΈ ΡΡΠ½ΠΊΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π»ΠΈΡΡ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠ½ΡΠΌ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠΎΠΌ Π±ΡΠ°ΡΠ·Π΅ΡΠ°. ΠΠ΄Π½Π°ΠΊΠΎ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ Π½Π΅ ΡΠΊΠ»ΠΎΠ½Ρ ΠΏΠ΅ΡΠ΅ΠΎΡΠ΅Π½ΠΈΠ²Π°ΡΡ ΡΠΎΠ»Ρ jQuery Π² ΡΠ΅ΡΠ΅Π½ΠΈΠΈ ΠΏΡΠΎΠ±Π»Π΅ΠΌ ΠΊΡΠΎΡΡΠ±ΡΠ°ΡΠ·Π΅ΡΠ½ΠΎΡΡΠΈ ΠΈ Π½Π°ΡΡΠ°ΠΈΠ²Π°ΡΡ Π½Π° ΡΠΎΠΌ, ΡΡΠΎ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° ΡΡΠ°Π»Π° ΡΡΠΎΠ»Ρ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΠΎΠΉ Π±Π»Π°Π³ΠΎΠ΄Π°ΡΡ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ querySelectors. ΠΠ°ΠΊ ΠΎΠ±ΡΡΠ½ΠΎ, ΠΈΡΡΠΈΠ½Π° Π³Π΄Π΅-ΡΠΎ ΠΏΠΎΡΠ΅ΡΠ΅Π΄ΠΈΠ½Π΅.
Β
ΠΠ° ΡΠ΅Π³ΠΎΠ΄Π½ΡΡΠ½ΠΈΠΉ Π΄Π΅Π½Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ½Π°Ρ ΡΠΊΠΎΡΠΈΡΡΠ΅ΠΌΠ° ΡΠ²Π»ΡΠ΅ΡΡΡ Π½Π΅ ΡΠ°ΠΊΠΎΠΉ ΡΠ»ΠΎΠΆΠ½ΠΎΠΉ, ΠΊΠ°ΠΊ ΡΡΠΎ Π±ΡΠ»ΠΎ 10 Π»Π΅Ρ Π½Π°Π·Π°Π΄. ΠΠ΅ΡΠΌΠΎΡΡΡ Π½Π° ΡΠΎ, ΡΡΠΎ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΡ Π½Π΅ ΠΌΠΎΠ³ΡΡ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²Π°ΡΡ Π²ΡΠ΅, ΡΡΠΎ ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ HTML5 API, Π²ΡΠ΅ ΠΆΠ΅ Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² Π² Π½Π°ΡΠ΅ Π²ΡΠ΅ΠΌΡ Π³ΠΎΡΠ°Π·Π΄ΠΎ ΠΌΠ΅Π½ΡΡΠ΅ ΠΏΡΠΎΠ±Π»Π΅ΠΌ Ρ ΠΊΡΠΎΡΡΠ±ΡΠ°ΡΠ·Π΅ΡΠ½ΠΎΡΡΡΡ ΠΈ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠ΅ΠΉ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΡΠ½ΠΊΡΠΈΠΉ. ΠΡΠ»ΠΈ ΡΠ΅Π³ΠΎΠ΄Π½Ρ ΡΡΠΎ-ΡΠΎ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π² Chrome, ΡΠΎ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, ΡΡΠΎ ΡΠ°ΠΊΠΆΠ΅ Π±ΡΠ΄Π΅Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π² Firefox ΠΈΠ»ΠΈ Edge. ΠΡΠ½ΠΎΠ²Π½ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ JavaScript Π½Π°ΡΡΠ΄Ρ Ρ querySelectors Ρ ΠΎΡΠΎΡΠΎ Π·Π°Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½Ρ ΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ Π²ΡΠ΅ΠΌΠΈ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠΌΠΈ Β Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ². ΠΠΎΡΡΠΎΠΌΡ Π½Π° ΠΏΠ΅ΡΠ²ΡΠΉ Π²Π·Π³Π»ΡΠ΄ ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΠΊΠ°Π·Π°ΡΡΡΡ, ΡΡΠΎ ΡΠ΅ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ΅ΡΠ°Π΅Ρ jQuery, Π±ΠΎΠ»Π΅Π΅ ΡΠ°ΠΊΠΎΠ²ΡΠΌΠΈ Π½Π΅ ΡΠ²Π»ΡΡΡΡΡ. Π§ΠΈΡΡΡΠΉ JavaScript Π²ΡΠ΅Π³Π΄Π° Π±ΡΠ΄Π΅Ρ Π±ΡΡΡΡΠ΅Π΅, ΡΠ΅ΠΌ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ, ΡΠ°ΠΊ ΡΡΠΎ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ Π²ΠΎΠΏΡΠΎΡ: Π° Π½ΡΠΆΠ½ΠΎ Π»ΠΈ ΡΠ΅Π³ΠΎΠ΄Π½Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ΅Ρ Π½ΠΎΠ»ΠΎΠ³ΠΈΡ, ΠΊΠΎΡΠΎΡΠ°Ρ Β Π² ΠΊΠ°ΠΊΠΎΠΉ-ΡΠΎ ΠΌΠ΅ΡΠ΅ ΡΠΆΠ΅ ΡΡΡΠ°ΡΠ΅Π»Π°? Π¦ΠΈΠΊΠ» CPU ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠΎΠ²Π°ΡΠΎΠΌ, Π° Π²ΡΠ΅ΠΌΡ Π½Π΅Ρ. ΠΡΠ΄Π΅Ρ Π»ΠΈ ΡΠΊΠΎΠ½ΠΎΠΌΠΈΡ 30 ΠΊΠ ΠΎΠΏΡΠ°Π²Π΄Π°Π½Π½ΠΎΠΉ, Π΅ΡΠ»ΠΈ ΠΏΡΠΈΠ΄Π΅ΡΡΡ ΠΏΠΈΡΠ°ΡΡ ΠΊΠΎΠ΄, ΡΠ΅ΡΡΠΈΡΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ, Π΅ΡΠ»ΠΈ ΡΠΆΠ΅ Π΅ΡΡΡ Π³ΠΎΡΠΎΠ²ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅?
Β
ΠΡΠ΅ ΡΡΠΎ Π²ΠΎΠΏΡΠΎΡ Π²ΡΠ±ΠΎΡΠ°. ΠΡΠΎ-ΡΠΎ ΡΡΡΠ΅ΠΌΠΈΡΡΡ ΠΊ ΡΠΎΠ²Π΅ΡΡΠ΅Π½Π½ΠΎΠΌΡ ΠΊΠΎΠ΄Ρ, ΠΊΡΠΎ-ΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ ΡΡΠ°Π³ΠΌΠ΅Π½ΡΡ ΠΊΠΎΠ΄Π°, ΡΠΎΠ·Π΄Π°Π½Π½ΡΠ΅ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ°ΠΌΠΈ. ΠΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° jQuery Π½Π°ΡΡΠΈΡΡΠ²Π°Π΅Ρ ΡΡΡΡΡΠΈ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°ΡΡΠΈΡ ΠΈ Ρ ΠΎΡΠΎΡΠΎ Π·Π°Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½Π½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠ²ΡΡΠ°ΡΡ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΡ ΠΈ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²ΡΠ²Π°ΡΡ ΡΠ°ΠΌΡΠ΅ ΡΠΌΠ΅Π»ΡΠ΅ ΠΈΠ΄Π΅ΠΈ. ΠΠ½ΠΎΠ³ΠΈΠ΅ ΠΈΠ· ΡΡΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² ΠΊ ΡΠΎΠΌΡ ΠΆΠ΅ ΡΠΎΠ²Π΅ΡΡΠ΅Π½Π½ΠΎ Π±Π΅ΡΠΏΠ»Π°ΡΠ½Ρ. ΠΡΠ΅Π΄Π»Π°Π³Π°Π΅ΠΌ Π²Π°ΡΠ΅ΠΌΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΡ 10 Π»ΡΡΡΠΈΡ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Π°ΠΊΡΠΈΠ²Π½ΠΎ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ ΠΈ ΡΠ΅Π³ΡΠ»ΡΡΠ½ΠΎ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡΡΡΡ ΠΈΡ ΡΠΎΠ·Π΄Π°ΡΠ΅Π»ΡΠΌΠΈ.
Β
FREEWALL
Β
Firewall ΡΡΠΎ ΠΎΡΠ΅Π½Ρ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΠΉ ΠΊΡΠΎΡΡΠ±ΡΠ°ΡΠ·Π΅ΡΠ½ΡΠΉ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½, ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½Π½ΡΠΉ Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ Ρ ΠΌΠ°ΠΊΠ΅ΡΠ°ΠΌΠΈ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ ΠΌΠΎΠ΄ΡΠ»ΡΠ½ΠΎΠΉ ΡΠ΅ΡΠΊΠΈ. ΠΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π²ΠΏΠ΅ΡΠ°ΡΠ»ΡΡΡΠΈΠ΅ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΎΠ½Π½ΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠ΅ΠΉ SCC3 ΠΈ Ρ
ΠΎΡΠΎΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Ρ call back events. ΠΡΠ»ΠΈ Π½ΡΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π³ΠΈΠ±ΠΊΠΈΠ΅ ΠΌΠ°ΠΊΠ΅ΡΡ Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎΠΌ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΡΠΈΠΏΠ° Pinterest, ΡΠΎ Firewall ΡΠ²Π»ΡΠ΅ΡΡΡ Π½Π°ΠΈΠ»ΡΡΡΠΈΠΌ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΡ
ΡΠ΅ΡΠΎΠΊ. Freewall ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π²ΠΎ Π²ΡΠ΅Ρ
ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ
Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ
ΠΈ Π΄Π°ΠΆΠ΅ Π² Π΄ΡΠ΅Π²Π½Π΅ΠΌ IE8, ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΡΠΌ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠΌ.
Β
MULTISCROLL.JS
Β
ΠΠ»Π°Π³ΠΈΠ½ multiscroll.js ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π½Π° ΡΠ°ΠΉΡ ΡΠ°Π·Π½ΠΎΠ½Π°ΠΏΡΠ°Π²Π»Π΅Π½Π½ΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΡ ΠΎΡΠ½ΠΎΠ²Π½ΡΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² Π΄ΠΈΠ·Π°ΠΉΠ½Π°. ΠΡΠΎ ΠΎΠ±Π»Π΅Π³ΡΠ°Π΅Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΌΡΠ»ΡΡΠΈΠΏΡΠΎΠΊΡΡΡΠΊΠΈ Π΄Π»Ρ ΡΠ°ΠΉΡΠΎΠ² Ρ Π΄Π²ΡΠΌΡ ΠΊΠΎΠ»ΠΎΠ½ΠΊΠ°ΠΌΠΈ ΠΈΠ»ΠΈ ΠΏΠ°Π½Π΅Π»ΡΠΌΠΈ. ΠΡΠ½ΠΎΠ²Π½ΠΎΠ΅ Π½Π°Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Π° Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΠΏΡΠΈΠ²Π»Π΅ΡΠ΅Π½ΠΈΠΈ Π²Π½ΠΈΠΌΠ°Π½ΠΈΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΊ Π³Π»Π°Π²Π½ΠΎΠΌΡ ΠΊΠΎΠ½ΡΠ΅Π½ΡΡ Π±Π΅Π· ΡΡΠ΅ΡΠ±Π° Π΄Π»Ρ UX. ΠΠ»Π°Π³ΠΈΠ½ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΊΠ°ΠΊ Π½Π° ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ
, ΡΠ°ΠΊ ΠΈ Π½Π° ΡΡΡΠ°ΡΠ΅Π²ΡΠΈΡ
Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ
ΠΈ, ΠΊΠΎΠ½Π΅ΡΠ½ΠΎ, Π² ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠΉ ΡΡΠ΅Π΄Π΅.
Β
ROWGRID.JS
Β
RowGrid.js β ΡΡΠΎ ΠΏΡΠΎΡΡΠ΅Π½ΡΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½Π° ΡΠ°ΠΉΡΠ΅ ΡΠΎΠ²Π½ΡΠΌΠΈ ΡΡΠ΄Π°ΠΌΠΈ, ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠ΄Π΅Π»Π°Π½ΠΎ Π² ΠΏΠΎΠΈΡΠΊΠ΅ ΠΏΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌ Google. ΠΡΠΎ ΠΌΠΎΠ΄Π½ΠΎ, ΠΊΡΠ°ΡΠΈΠ²ΠΎ ΠΈ Π½Π΅ ΡΠ»ΠΈΡΠΊΠΎΠΌ Π½Π°Π²ΡΠ·ΡΠΈΠ²ΠΎ. RowGrid.js ΡΠ°ΡΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² ΡΡΠ΄Π°Ρ
, ΠΎΡΠΈΠ΅Π½ΡΠΈΡΡΡΡΡ Π½Π° ΡΠ°Π·ΠΌΠ΅Ρ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°: ΠΎΠ½ ΠΏΠΎΠ΄Π±ΠΈΡΠ°Π΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΡΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΈ Π³Π°ΡΠΌΠΎΠ½ΠΈΡΠ½ΠΎ ΡΠΌΠΎΡΡΠ΅Π»ΠΈΡΡ Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ
ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΡΡ
Π³ΡΠ°Π½ΠΈΡ, ΠΏΡΠΈ ΡΡΠΎΠΌ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΏΠΎΠ΄Π²Π΅ΡΠ³Π°ΡΡΡΡ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°Π½ΠΈΡ. ΠΠ΄Π½Π°ΠΊΠΎ ΠΏΡΠΈ ΡΠ°Π±ΠΎΡΠ΅ Ρ ΡΡΠΈΠΌ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ Π½ΡΠΆΠ½ΠΎ ΠΏΠΎΠΌΠ½ΠΈΡΡ, ΡΡΠΎ Π²ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π΄ΠΎΠ»ΠΆΠ½Ρ Π±ΡΡΡ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΡΠΌΠΈ ΠΏΠΎ Π²ΡΡΠΎΡΠ΅, ΠΈΠ½Π°ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½ Π½Π΅ Π±ΡΠ΄Π΅Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΠΈ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠΉ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ»ΡΠ½ΠΎΠΉ ΡΠ΅ΡΠΊΠΈ Π½Π΅ ΠΏΠΎΠ»ΡΡΠΈΡΡΡ.
Β
SLIDEBARS
Β
JQuery-ΠΏΠ»Π°Π³ΠΈΠ½ Slidebars, ΠΊΠ°ΠΊ ΠΏΠΎΠ½ΡΡΠ½ΠΎ ΠΈΠ· Π½Π°Π·Π²Π°Π½ΠΈΡ, ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π½Π° ΡΠ°ΠΉΡ Π²ΡΠ΅Π·ΠΆΠ°ΡΡΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ Π±ΠΎΠΊΠΎΠ²ΡΠ΅ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΈΠ»ΠΈ ΡΠΊΡΡΡΡΠ΅ ΠΌΠ΅Π½Ρ. ΠΡΠΎΡΠ°Ρ Π²Π΅ΡΡΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½Π° Π±ΡΠ»Π° ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΠΏΠ΅ΡΠ΅ΠΏΠΈΡΠ°Π½Π° Ρ ΡΡΠ΅ΡΠΎΠΌ Π²ΡΠ΅Ρ
ΠΏΡΠ΅ΠΆΠ½ΠΈΡ
Π½Π΅Π΄ΠΎΡΠ°Π±ΠΎΡΠΎΠΊ ΠΈ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π½Π΅ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Π½ΠΎΠ΅ ΡΠΈΡΠ»ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ², ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π½ΡΡ
Π²Π½Π΅ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ³ΠΎ ΡΠΊΡΠ°Π½Π°.
Β
PAGEPILING.JS
Β
ΠΠ»Π°Π³ΠΈΠ½ pagePilings.js ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²Π°ΡΡ ΠΎΡΠ΅Π½Ρ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ Π²ΠΏΠ΅ΡΠ°ΡΠ»ΡΡΡΠ΅ ΡΠΌΠΎΡΡΡΡΡΡ Π½Π° ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΠΈΠΊΠ°Ρ
. ΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΏΡΠΎΡΠΌΠ°ΡΡΠΈΠ²Π°Π΅Ρ ΠΊΠΎΠ½ΡΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Π΅ΡΡΡ Π²Π²Π΅ΡΡ
ΠΈ Π²Π½ΠΈΠ·, Π° ΡΠΊΡΠΈΠΏΡ ΡΡΠ΅Π·Π°Π΅Ρ Π²Π΅ΡΡ
Π½ΠΈΠ΅ ΡΠ»ΠΎΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ, ΡΠ΅ΠΌ ΡΠ°ΠΌΡΠΌ ΡΠ΅Π°Π»ΠΈΠ·ΡΡ ΡΠ»Π°ΠΉΠ΄Π΅Ρ. ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Π° ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ ΡΠΎΠ·Π΄Π°ΡΡ Π½Π΅Π·Π°Π±ΡΠ²Π°Π΅ΠΌΡΠΉ ΠΎΠΏΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ. ΠΠ°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΠΈ ΡΠΊΠΎΡΠΎΡΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ ΠΌΠΎΠΆΠ½ΠΎ Π»Π΅Π³ΠΊΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ β Π² ΡΡΠΎΠΌ ΠΏΠ»Π°Π½Π΅ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΎΠ±Π»Π°Π΄Π°Π΅Ρ ΠΎΡΠ΅Π½Ρ Π±ΠΎΠ»ΡΡΠΈΠΌΠΈ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡΠΌΠΈ. PagePilings.js ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠΉ, ΠΎΠ½ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π½Π° Π»ΡΠ±ΠΎΠΌ ΡΠΊΡΠ°Π½Π΅ ΠΈ Ρ
ΠΎΡΠΎΡΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π² Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²Π΅ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ
Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ².
Β
ANIMISITION
Β
ΠΡΠ½ΠΎΠ²Π½ΠΎΠ΅ Π½Π°Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½Π°Β β ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΏΠ»Π°Π²Π½ΡΡ
ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΡΠ°Π½ΠΈΡΠ°ΠΌΠΈ, ΡΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠ»ΡΡΡΠΈΡΡ ΠΎΠΏΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ. ΠΡΠΎΡ Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΏΠ»Π°Π²Π½ΡΠ΅ ΠΈ ΠΊΡΠ°ΡΠΈΠ²ΡΠ΅ CSS-Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΎΠΏΡΠΎΠ²ΠΎΠΆΠ΄Π°ΡΡ ΡΠΌΠ΅Π½Ρ ΡΡΡΠ°Π½ΠΈΡ. ΠΠ»Π°Π³ΠΈΠ½ ΠΈΠΌΠ΅Π΅Ρ ΡΠ²ΡΡΠ΅ 60 ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ
ΡΡΡΠ΅ΠΊΡΠΎΠ², Π²ΠΊΠ»ΡΡΠ°Ρ ΡΠ°ΠΊΠΈΠ΅ ΡΠ°ΡΠΏΡΠΎΡΡΡΠ°Π½Π΅Π½Π½ΡΠ΅, ΠΊΠ°ΠΊ Π·Π°ΡΡΡ
Π°Π½ΠΈΠ΅, ΠΏΡΠΎΡΠ²Π»Π΅Π½ΠΈΠ΅, ΠΏΠΎΠ²ΠΎΡΠΎΡ ΠΏΠ»ΠΎΡΠΊΠΎΡΡΠΈ ΠΊΠ°Π΄ΡΠ°, ΡΠ»ΠΈΠΏ, Π·ΡΠΌ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅.
Β
ZOOMOVIE
Β
Π’Π°ΠΊΠΎΠΉ ΡΡΡΠ΅ΠΊΡ, ΠΊΠ°ΠΊ ΡΠ²Π΅Π»ΠΈΡΠ΅Π½ΠΈΠ΅ ΠΌΠ°ΡΡΡΠ°Π±Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ° ΠΌΡΡΠΈ, Π½Π΅ΠΊΠΎΡΠΎΡΡΡ
ΡΠ°Π·Π΄ΡΠ°ΠΆΠ°Π΅Ρ, Π½ΠΎ ΠΈΠ½ΠΎΠ³Π΄Π° ΠΎΠ½ Π±ΡΠ²Π°Π΅Ρ ΠΎΡΠ΅Π½Ρ Π½ΡΠΆΠ΅Π½. Π’Π°ΠΊ ΡΡΠΎ Π΅ΡΠ»ΠΈ Π² ΠΏΡΠΎΠ΅ΠΊΡΠ΅ Π½ΡΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ, ΡΠΎ ΡΡΠΎΠΈΡ ΠΎΠ±ΡΠ°ΡΠΈΡΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° jQuery-ΠΏΠ»Π°Π³ΠΈΠ½ ZooMovie. ΠΠ»Π°Π³ΠΈΠ½ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΡΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ, Π½ΠΎ ΠΈ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°ΡΡ Π΄Π΅ΡΠ°Π»ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΠΏΠ΅ΡΠ΅Π΄Π²ΠΈΠ³Π°Ρ ΠΊΡΡΡΠΎΡ. ΠΡΠ΅ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΠΎ ΠΈ ΠΏΡΠ΅Π΄ΡΠΊΠ°Π·ΡΠ΅ΠΌΠΎ.
Β
RIPPLERIA
Β
Rippleria ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠΎΠ·Π΄Π°Π½Π½ΡΠΌ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ ΠΊΠΎΠ½ΡΠ΅ΠΏΡΠΈΠΈ Material Design ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠΎΠ·Π΄Π°Π΅Ρ ΡΡΡΠ΅ΠΊΡ Π²ΠΎΠ»Π½Ρ ΠΏΡΠΈ ΠΊΠ»ΠΈΠΊΠΈ ΠΌΡΡΠΊΠΈ ΠΏΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ. ΠΡΡΠ΅ΠΊΡ ΠΌΠΎΠΆΠ΅Ρ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ ΠΊ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌ ΠΎΠ±ΡΠ΅ΠΊΡΠ°ΠΌ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΊ ΠΊΠ½ΠΎΠΏΠΊΠ°ΠΌ, ΠΈΠΊΠΎΠ½ΠΊΠ°ΠΌ ΠΈΠ»ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌ. ΠΠ»Π°Π³ΠΈΠ½ Π»Π΅Π³ΠΊΠΎ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΡΡΡ ΠΈ Ρ
ΠΎΡΠΎΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π²ΠΎ Π²ΡΠ΅Ρ
ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ
Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ
.
Β
FLICKITY
Β
ΠΠ»Π°Π³ΠΈΠ½ Flickity ΠΎΡΠ»ΠΈΡΠ°Π΅ΡΡΡ ΠΎΡΠ΅Π½Ρ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎΠΉ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠ΅ΠΉ. ΠΠ΅ΡΡ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π» ΠΏΠΎΠ½ΡΡΠ½ΠΎ ΠΎΠΏΠΈΡΠ°Π½ ΠΈ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΈ ΡΡΡΡΠΊΡΡΡΠΈΡΠΎΠ²Π°Π½. ΠΡΠΎ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· ΡΠ°ΠΌΡΡ
Β«ΠΎΡΡΠ»ΠΈΡΠΎΠ²Π°Π½Π½ΡΡ
Β» jQuery-ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Π΄Π»Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ ΡΡΡΠ΅ΠΊΡΠ° ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ. ΠΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ Flickity ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΡ
ΡΠ»Π°ΠΉΠ΄Π΅ΡΠΎΠ² ΠΏΡΠ΅Π²ΡΠ°ΡΠ°Π΅ΡΡΡ Π² Π»Π΅Π³ΠΊΡΡ ΡΠ°Π±ΠΎΡΡ, ΡΠ°ΠΊ ΠΊΠ°ΠΊ Π² ΠΏΠ»Π°Π³ΠΈΠ½Π΅ Π΅ΡΡΡ Π²ΡΠ΅ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΡ Π΄Π»Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ Π»ΡΠ±ΠΎΠΉ ΠΈΠ΄Π΅ΠΈ. ΠΠ»Π°Π³ΠΈΠ½ ΡΡΠ»ΠΎΠ²Π½ΠΎ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΠΉ, Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π² ΠΊΠΎΠΌΠΌΠ΅ΡΡΠ΅ΡΠΊΠΈΡ
ΠΏΡΠΎΠ΅ΠΊΡΠ°Ρ
ΠΏΡΠΈΠ΄Π΅ΡΡΡ ΠΏΡΠΈΠΎΠ±ΡΠ΅ΡΡΠΈ ΠΏΠ»Π°ΡΠ½ΡΡ Π²Π΅ΡΡΠΈΡ.
Β
UNSLYDER
Β
ΠΡΠ»ΠΈ Π½ΡΠΆΠ½ΠΎ Π±ΡΡΡΡΠΎ ΠΈ Π±Π΅Π· ΠΎΡΠΎΠ±ΡΡ
Π·Π°ΡΠ΅ΠΉ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠ»Π°ΠΉΠ΄Π΅Ρ Π½Π° ΡΠ²ΠΎΠΉ ΡΠ°ΠΉΡ, ΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ jQuery-ΠΏΠ»Π°Π³ΠΈΠ½ Unslyder. ΠΠ»Π°Π³ΠΈΠ½ Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΉ, Π½ΠΎ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π³ΠΈΠ±ΠΊΠΈΠΉ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΠΉ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΡ ΠΌΠ΅Π½ΡΡΡ ΡΡΠ΅Π½Π°ΡΠΈΠΈ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ°Π·Π½ΡΡ
ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² ΠΈ ΠΎΠΏΡΠΈΠΉ, ΠΌΠ΅ΡΠΎΠ΄ΠΎΠ² ΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ ΠΎΠ±ΡΠ°ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠ·ΠΎΠ²Π°.
ΠΡΡΠΎΡΠ½ΠΈΠΊΒ
Β
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ jQuery ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΡΡ ΡΠ°ΠΉΡΠΎΠ²
ΠΠ±ΡΡΠ½ΠΎ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΡΠΉ ΡΠ°ΠΉΡ ΠΎΡΠΈΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½ Π½Π° ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΠΎΡΠ΅Π½Ρ ΡΠ΅ΡΠΊΠΈΡ ΡΠ΅Π»Π΅ΠΉ ΠΈΠ»ΠΈ Π·Π°Π΄Π°Ρ. ΠΡΠΈ ΡΠ°Π±Π»ΠΎΠ½Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π»ΡΡΡΠ΅ Π²ΡΠ΅Π³ΠΎ Π΄Π»Ρ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΉ, ΡΡΠΈΠ»Π°Π½ΡΠ΅ΡΠΎΠ² ΠΈ ΠΈΠ½ΡΠ΅ΡΠ½Π΅Ρ-ΠΏΡΠΎΠ΅ΠΊΡΠΎΠ², ΠΊΠΎΡΠΎΡΡΠΌ Π½ΡΠΆΠ΅Π½ ΠΎΠ½Π»Π°ΠΉΠ½ ΡΠ΅ΡΡΡΡ Π΄Π»Ρ ΠΎΠ±ΠΌΠ΅Π½Π° ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠ΅ΠΉ. Π Π°Π·Π΄Π²ΠΈΠΆΠ½ΡΠ΅ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡ ΠΌΠ΅Π½Ρ ΡΠ°ΠΊΠΆΠ΅ ΡΠ°ΡΠΏΡΠΎΡΡΡΠ°Π½Π΅Π½Ρ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΎΠ½ΠΈ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°ΡΡ Π΅ΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π° ΠΌΠ΅ΠΆΠ΄Ρ ΠΎΠ±Π»Π°ΡΡΡΠΌΠΈ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°.
ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΡΡΡΠΎΠΈΡΡ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠ°Π±Π»ΠΎΠ½ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΠΎΠ³ΠΎ ΡΠ°ΠΉΡΠ° Ρ Π½ΡΠ»Ρ, ΠΈΠΌΠ΅Ρ ΠΎΠ±ΡΠΈΠ΅ Π·Π½Π°Π½ΠΈΡ ΠΎ ΠΌΠ΅ΡΠΎΠ΄Π°Ρ Π²Π΅Π±-ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ°. ΠΠΎ Π΅ΡΡΡ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎ Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠ³ΡΡ ΠΏΠΎΠΌΠΎΡΡ Ρ fixed nav ΠΌΠ΅Π½Ρ, Π°Π½ΠΈΠΌΠ°ΡΠΈΠ΅ΠΉ, ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡ ΡΠΎΠ΄Π΅ΡΠΆΠ°Π½ΠΈΠ΅ΠΌ, ΠΈ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΡΠΌΠ΅ΠΆΠ½ΡΠΌΠΈ ΡΡΠ½ΠΊΡΠΈΡΠΌΠΈ. Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅, Π²Ρ ΡΠ·Π½Π°Π΅ΡΠ΅ ΠΎ ΠΌΠ½ΠΎΠ³ΠΈΡ ΡΡΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½Π°Ρ , ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠΌΠΎΠ³Π°ΡΡ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ°ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π±ΡΡΡΡΡΠ΅ ΠΈ ΡΡΡΠ΅ΠΊΡΠΈΠ²Π½ΡΠ΅ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΡΠ΅ Π²Π΅Π±-ΠΏΡΠΎΠ΅ΠΊΡΡ. ΠΡΠ΅ ΡΡΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠ²Π»ΡΡΡΡΡ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΠΌΠΈ ΠΈ open source Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π½Π° Π»ΡΠ±ΡΡ ΡΠΈΠΏΠ°Ρ ΡΠ°Π±ΠΎΡ. ΠΡ ΡΠ²Π΅ΡΠ΅Π½Ρ ΡΡΠΎ ΡΡΠ° ΡΡΡΠ°Π½ΠΈΡΠ° Π·Π°ΡΠ»ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΌΠ΅ΡΡΠΎ Π² Π²Π°ΡΠΈΡ Π·Π°ΠΊΠ»Π°Π΄ΠΊΠ°Ρ !
Cool Kitten
ΠΡΠΎ open source ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡ-ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Ρ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ Π΅ΡΡΡ ΠΏΠΎΡΡΠΈ Π²ΡΠ΅, ΡΡΠΎ Π½ΡΠΆΠ½ΠΎ Π΄Π»Ρ ΠΏΠΎΠ»Π½ΠΎΡΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡ ΡΠ°ΠΉΡΠ°. ΠΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ ΡΠ°Π±Π»ΠΎΠ½Ρ Π½Π° ΡΠΌΠ°ΡΡΡΠΎΠ½Π°Ρ ΠΈ ΠΏΠ»Π°Π½ΡΠ΅ΡΠ°Ρ , Π° ΡΠ°ΠΊΠΆΠ΅ ΠΏΠΎΠ»Π½ΠΎΡΠΊΡΠ°Π½Π½ΡΠ΅ Π½Π°ΡΡΠΎΠ»ΡΠ½ΡΠ΅ ΠΌΠΎΠ½ΠΈΡΠΎΡΡ. ΠΠ½ ΠΎΠΏΠΈΡΡΠ²Π°Π΅ΡΡΡ Π±ΠΎΠ»Π΅Π΅ ΠΊΠ°ΠΊ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊ, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΠΉ HTML / CSS ΡΠ΅ΡΡΡΡΡ, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ Normalize.css.
Cool Kitten ΡΡΠ°Π½Π΅Ρ ΠΎΡΠ»ΠΈΡΠ½ΡΠΌ Π²ΡΠ±ΠΎΡΠΎΠΌ Π΄Π»Ρ ΡΠ΅Ρ , ΠΊΡΠΎ ΡΠΎΠ»ΡΠΊΠΎ Π½Π°ΡΠΈΠ½Π°Π΅Ρ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΈ Π½Π΅ Ρ ΠΎΡΠ΅Ρ ΠΏΠΈΡΠ°ΡΡ ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΊΠΎΠ΄Π°. ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠ°ΡΠ°ΡΡ ΠΏΡΡΠΌΠΎ Ρ Github, ΠΊΠΎΡΠΎΡΡΠΉ Π²ΠΊΠ»ΡΡΠ°Π΅Ρ Π² ΡΠ΅Π±Ρ Π΄Π΅ΠΌΠΎ ΡΠ΅Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠ±ΡΠ°Π·ΡΠ°. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΠΈΠ³ΡΠ°ΡΡ Ρ ΡΡΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΡΠΎΠΌ ΠΈ Π»Π΅Π³ΠΊΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ ΡΠ²ΠΎΠΉ, ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡ-ΡΡΡΠ΅ΠΊΡ Π΄ΠΈΠ·Π°ΠΉΠ½ ΡΠ°ΠΉΡΠ°.
SMINT
Smint ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΏΡΠΎΡΡΡΡ jQuery ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ², ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ°ΠΊΠΆΠ΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π΅ΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΡΠΉ ΡΠΊΠΎΠ»ΡΠ·ΡΡΠΈΠΉ ΡΡΡΠ΅ΠΊΡ. ΠΠ°ΡΠ°Π»Π»Π°ΠΊΡ ΡΠΊΡΠΎΠ»Π»ΠΈΠ½Π³ ΡΠ²Π»ΡΠ΅ΡΡΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΠΏΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ²ΠΎΠΌ ΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠ°Π½ΠΈΠ΅ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΡΡ ΠΌΠ΅Π½Ρ Π·Π°ΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΡΡ ΡΠ²Π΅ΡΡ Ρ, ΡΠ²Π»ΡΠ΅ΡΡΡ Π±Π»Π°Π³ΠΎΠΏΡΠΈΡΡΠ½ΡΠΌ Π΄Π»Ρ Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ°. Π£ Smint ΠΏΠ»Π°Π³ΠΈΠ½Π° ΡΠ°Π½ΡΠ°ΡΡΠΈΡΠ΅ΡΠΊΠ°Ρ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ ΠΈ ΠΎΠ½Π° ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ Π±ΠΎΠ»ΡΡΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΡ Π½Π°ΡΡΡΠΎΠ΅ΠΊ Π΄Π»Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ².
Ascensor.js
ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΎΡΠ»ΠΈΡΠ°Π΅ΡΡΡ ΠΎΡ Π΄ΡΡΠ³ΠΈΡ ΡΠ΅ΡΠ΅Π½ΠΈΠΉ. ΠΠ½ ΠΏΠΎΡΡΡΠΎΠ΅Π½ Π΄Π»Ρ ΡΠ°Π·Π΄Π²ΠΈΠΆΠ½ΡΡ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡ ΡΡΡΠ΅ΠΊΡΠΎΠ² ΠΌΠ΅ΠΆΠ΄Ρ div ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ fixed Π½Π° ΡΠΎΠΉ ΠΆΠ΅ ΡΡΡΠ°Π½ΠΈΡΠ΅. Ascensor ΠΌΠΎΠΆΠ΅Ρ Π΄Π΅Π»Π°ΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΡ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎ ΠΈ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΉ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΠΎΠΉ ΡΠΈΡΡΠ΅ΠΌΡ Π² ΡΠ³Π»Ρ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΡΠΎ, ΠΊΠΎΠ½Π΅ΡΠ½ΠΎ ΠΆΠ΅, Π±ΠΎΠ»Π΅Π΅ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ Π²Π°ΡΠΈΠ°Π½Ρ, ΡΠ΅ΠΌ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ, ΠΈ Π΅ΡΠ»ΠΈ ΡΡΠΎΡ ΡΡΠΈΠ»Ρ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΈΡ Π²Π°ΡΠ΅ΠΌΡ ΡΠ°ΠΉΡΡ, ΡΠΎ ΡΡΠΎ ΠΏΡΠ΅ΠΊΡΠ°ΡΠ½ΡΠΉ Π²ΡΠ±ΠΎΡ.
Curtain.js
Π₯ΠΎΡΡ Curtain. js Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΠΌΡΠΌ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ, ΠΎΠ½ Π²ΡΠ΅ Π΅ΡΠ΅ ΡΠ»ΡΠΆΠΈΡ Ρ ΠΎΡΠΎΡΠ΅ΠΉ ΠΎΡΠΏΡΠ°Π²Π½ΠΎΠΉ ΡΠΎΡΠΊΠΎΠΉ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΡΡ ΡΠ°Π±Π»ΠΎΠ½ΠΎΠ². ΠΠ°ΠΆΠ΄Π°Ρ ΠΏΠ°Π½Π΅Π»Ρ ΡΠ°Π·Π΄Π΅Π»Π΅Π½Π° ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ ΠΈ ΠΏΡΠ΅Π΄ΡΡΠ°Π²ΠΈΡΡΡ ΠΏΠΎΠ΄ ΡΠ΅ΠΊΡΡΠ΅ΠΉ ΠΏΠ°Π½Π΅Π»ΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΏΡΠΎΠΊΡΡΡΠΈΡ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΠΎΡ ΠΎΠΆΠ΅ Π½Π° ΡΠΎ, ΠΊΠ°ΠΊ Π·Π°Π½Π°Π²Π΅Ρ ΠΏΠΎΠ΄Π½ΠΈΠΌΠ°Π΅ΡΡΡ, ΡΡΠΎΠ±Ρ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΡΡ ΠΏΠ°Π½Π΅Π»Ρ, Ρ ΠΎΡΡ ΡΡΠΎ ΠΊΠΎΠ½ΡΠ΅Π½Ρ Π²ΡΠ΅ Π΅ΡΠ΅ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π² ΡΠΎΠΌ ΠΆΠ΅ HTML ΡΠ°ΠΉΠ»Π΅.
Skrollr
ΠΠΎΡ Π΅ΡΠ΅ ΠΎΠ΄ΠΈΠ½ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΡΠΉ Π² ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡ ΡΡΠΈΠ»Π΅ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°Π΅Ρ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΠΎΠΉ ΡΡΠ½Π΄Π°ΠΌΠ΅Π½Ρ. ΠΡ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°ΡΡ Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎ Π½ΠΎΠ²ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS3 transitions ΠΈΠ»ΠΈ jQuery ΡΡΠ½ΠΊΡΠΈΠΈ Π·Π°ΠΌΠ΅Π΄Π»Π΅Π½ΠΈΡ (easing). ΠΠ΅ΠΌΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π° ΠΎΡΠ΅Π½Ρ Π²ΠΏΠ΅ΡΠ°ΡΠ»ΡΠ΅Ρ, ΠΊΠ°ΠΊ ΡΠΎΠ»ΡΠΊΠΎ Π²Ρ ΠΏΡΠΎΠΊΡΡΡΠΈΡΠ΅ Π²ΡΠ΅ ΠΏΠ°Π½Π΅Π»ΠΈ. Π§ΡΠΎΠ±Ρ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΠΈΠΌΠ΅Π½Π½ΠΎ ΡΠΎ ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅, Ρ Π²Π°Ρ Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΡΠΉΡΠΈ Π½Π΅ΠΌΠ°Π»ΠΎ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ Π½Π° ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΡ. Skrollr ΠΏΡΠ΅ΠΊΡΠ°ΡΠ΅Π½, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΡΡΡ Π² Π»ΡΠ±ΠΎΠΉ Π²Π΅Π±-ΠΏΡΠΎΠ΅ΠΊΡ ΠΈ ΠΎΠ½ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°Π΅Ρ Π»Π΅Π³ΠΊΡΡ Π΄Π»Ρ ΡΡΠ΅Π½ΠΈΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ Github.
Single Page Nav
ΠΡ ΠΎΡΠ΅Π½Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΠΌ ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΎΡΠ½ΠΎΠ²Ρ Π΄Π»Ρ ΠΏΠΎΡΡΡΠΎΠ΅Π½ΠΈΡ Π»ΡΠ±ΠΎΠ³ΠΎ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΠΎΠ³ΠΎ ΡΠ°ΠΉΡΠ°. Single Page Nav ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΡ ΠΏΠ°Π½Π΅Π»Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΠ°ΠΊΠΆΠ΅ ΠΏΠΎΠ΄ΡΠ΅ΡΠΊΠΈΠ²Π°Π΅Ρ Π°ΠΊΡΠΈΠ²Π½ΡΠ΅ ΠΏΡΠ½ΠΊΡΡ ΠΌΠ΅Π½Ρ. ΠΡΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ ΠΊΠΎΠ΄Π° Π΄ΠΎΠ²ΠΎΠ»ΡΠ½Π° ΠΏΡΠΎΡΡΠ°, ΠΈ ΠΏΠΎΡΡΡΠΎΠ΅Π½Π° ΠΎΠ½Π° ΠΏΠΎΠ²Π΅ΡΡ jQuery βeasingβ ΡΡΠ½ΠΊΡΠΈΠΈ.
Single Page Nav, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, ΠΎΠ΄ΠΈΠ½ ΠΈΠ· Π»ΡΡΡΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Π΄Π»Ρ ΡΠ΅Ρ , ΠΊΡΠΎ ΡΠΎΠ»ΡΠΊΠΎ Π½Π°ΡΠΈΠ½Π°Π΅Ρ. ΠΠ΅Π±-ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π΅ ΡΠΎΠ·Π΄Π°Π²Π°Π»ΠΈ ΠΌΠ½ΠΎΠ³ΠΎ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΡΡ ΡΠ°Π±Π»ΠΎΠ½ΠΎΠ², ΠΌΠΎΠ³ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠ°ΠΊ Π²Π²Π΅Π΄Π΅Π½ΠΈΠ΅ Π² ΡΡΠΈΠ»Ρ Π΄ΠΈΠ·Π°ΠΉΠ½Π°.
jQuery One Page Nav
ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΎΡΠ΅Π½Ρ ΠΏΠΎΡ ΠΎΠΆ Π½Π° Single Page Nav, Ρ ΠΎΡΡ ΠΎΠ½ Π±ΡΠ» Π²ΡΠΏΡΡΠ΅Π½ ΡΠ°Π½ΡΡΠ΅. Π‘ΠΊΡΠΈΠΏΡ Π·Π΄Π΅ΡΡ Π³ΠΎΡΠ°Π·Π΄ΠΎ Π±ΠΎΠ»Π΅Π΅ Β«Π³ΠΎΠ»ΡΠΉΒ» Π² ΡΡΠ°Π²Π½Π΅Π½ΠΈΠΈ, ΡΡΠΎ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΈΡ Π΄Π»Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Ρ ΠΎΡΡΡ Π½Π°ΡΠ°ΡΡ ΡΠ°Π±ΠΎΡΡ Ρ ΡΠ΅Π³ΠΎ-ΡΠΎ ΡΠΈΡΡΠΎΠ³ΠΎ. jQuery One Page Nav ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ Ρ ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΊΠΎΠΉ ΠΊΠ»Π°ΡΡΠ° Π΄Π»Ρ Π²ΡΠ±ΡΠ°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠ½ΠΊΡΠ° ΠΌΠ΅Π½Ρ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΡΠΌΠΎΡΡΠ΅ΡΡ, ΠΊΠ°ΠΊ ΠΎΠ½ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π½Π° ΡΡΠΎΠΉ Π΄Π΅ΠΌΠΎ ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΈ ΡΠΊΠ°ΡΠ°ΡΡ Π»ΠΎΠΊΠ°Π»ΡΠ½ΡΡ ΠΊΠΎΠΏΠΈΡ ΠΈΠ· Github. ΠΡΠ»ΠΈ Ρ Π²Π°Ρ Π²ΠΎΠ·Π½ΠΈΠΊΠ»ΠΈ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ Ρ Single Page Nav, ΡΠΎΠ³Π΄Π° Π΄Π°ΠΉΡΠ΅ ΡΠ°Π½Ρ ΡΡΠΎΠΌΡ ΠΏΠ»Π°Π³ΠΈΠ½Ρ!
jQuery.SnapScroll
Π₯ΠΎΡΡ ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΈ Π½Π΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΏΠΎΠ»Π½ΡΡ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡΠ°, ΠΎΠ½ Π±ΡΠ΄Π΅Ρ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΌ, Π΅ΡΠ»ΠΈ Ρ ΠΠ°Ρ Π΅ΡΡΡ Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΡΠΎΡΡΠ΅Π΄ΠΎΡΠΎΡΠ΅Π½Π½ΡΠΉ Π½Π° Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠΌ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ΅. SnapScroll Π±ΡΠ΄Π΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΡΠΈΠ²ΡΠ·ΡΠ²Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ ΠΊ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌ ΡΠ°Π·Π΄Π΅Π»Π°ΠΌ ΡΠΎΠ΄Π΅ΡΠΆΠ°Π½ΠΈΡ, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΏΠ΅ΡΠ΅Π»ΠΈΡΡΡΠ²Π°Π΅Ρ ΡΠ°ΠΉΡ. ΠΠ΅ΠΌΠΎ Π±ΡΠ΄Π΅Ρ ΠΎΡΠ»ΠΈΡΠ½ΡΠΌ ΡΠΏΠΎΡΠΎΠ±ΠΎΠΌ ΠΏΠΎΠ½ΡΡΡ, ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ. ΠΠ°ΠΌ Π½ΡΠΆΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°ΡΡ ΠΏΠΎΠ»Π½ΡΠΉ ΡΠ°Π·Π΄Π΅Π» ΡΠΎΠ΄Π΅ΡΠΆΠ°Π½ΠΈΡ ΠΈ ΡΡΠΈΠ»ΠΈΠ·ΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Ρ CSS, ΡΡΠΎΠ±Ρ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°ΡΡ Π²ΡΡΠΎΡΠ΅ ΡΠΊΡΠ°Π½Π°. SnapScroll ΠΌΠΎΠΆΠ΅Ρ ΡΡΠ°ΡΡ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΌ Π² ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡΡ , Π³Π΄Π΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π½Π°ΠΏΠΈΡΠΊΠ°Π½ΠΎ ΡΡΠ½ΠΊΡΠΈΡΠΌΠΈ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠΉ Π±Π»ΠΎΠΊΠΈΡΠΎΠ²ΠΊΠΈ.
jQuery Waypoints
Waypoints ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ»ΡΡΠΈΠ» ΡΠ²ΠΎΡ ΠΈΠ·Π²Π΅ΡΡΠ½ΠΎΡΡΡ ΠΏΠΎΡΠΎΠΌΡ, ΡΡΠΎ ΠΎΠ½ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π²ΠΊΠ»ΡΡΠ΅Π½ ΠΊΠ°ΠΊ ΡΠ΅ΡΡΡΡ, Π½Π°ΡΡΠ΄Ρ Ρ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Π°ΠΌΠΈ. Waypoints ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡΡ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ°ΠΌ Π·Π°ΠΏΡΡΠΊΠ°ΡΡ ΡΡΠ½ΠΊΡΠΈΠΈ ΡΠΎΠ³Π΄Π°, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°Π΅Ρ Π² ΡΠ°Π·Π΄Π΅Π»Ρ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΡΠΎ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ ΠΈΠ»ΠΈ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΠΉ ΡΠΊΡΠΎΠ»Π»ΠΈΠ½Π³ Ρ ΡΡΠ½ΠΊΡΠΈΠ΅ΠΉ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡΠ°. Waypoints ΡΠ°Π½ΡΠ°ΡΡΠΈΡΠ΅ΡΠΊΠΈΠΉ Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π² ΡΠ°Π±Π»ΠΎΠ½Π°Ρ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΠΎΠ³ΠΎ ΡΠ°ΠΉΡΠ°, ΠΈΠ·-Π·Π° ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²Π° Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΡ ΡΡΠ½ΠΊΡΠΈΠΉ.
jQuery Parallax
ΠΠ»Ρ ΡΠ΅Ρ , ΠΊΠΎΠΌΡ Π½ΡΠΆΠ½ΠΎ ΡΡΠΎ-ΡΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ βΠ΄ΡΡΠ³ΠΎΠ΅β, jQuery Parallax ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΡΡ ΡΠ°Π·Π΄Π²ΠΈΠΆΠ½ΡΡ ΠΏΠ°Π½Π΅Π»Π΅ΠΉ Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ. ΠΡΠΎΡ ΡΡΡΠ΅ΠΊΡ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡΠ° Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΠ»Π΅Π·Π΅Π½ ΠΏΡΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΡ ΡΠΈΠΏΠΎΠ² Π΄Π°Π½Π½ΡΡ ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ. ΠΠ΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΎΠ½Π½Π°Ρ ΡΡΡΠ°Π½ΠΈΡΠ° ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠ΅ΠΊΡΡΡΡΡ ΡΠΎΠ½Π°, ΡΡΠΎΠ±Ρ ΡΠ°Π·Π»ΠΈΡΠΈΡΡ ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΡΠ°Π·Π΄Π΅Π»ΠΎΠ².
Single.js
Single.js ΠΎΡΠ΅Π½Ρ ΠΏΠΎΡ ΠΎΠΆ Π½Π° jQuery Parallax? Π½ΠΎ Ρ Π½Π΅Π³ΠΎ Π΅ΡΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π²Π°ΡΠΈΠ°Π½ΡΡ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΡΡΡΠΎΠΈΡΡ Π²ΠΏΠ΅ΡΠ΅Π΄ / Π½Π°Π·Π°Π΄ ΡΡΡΠ»ΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ ΠΌΠ΅ΠΆΠ΄Ρ ΠΏΠ°Π½Π΅Π»ΡΠΌΠΈ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π΄Π»Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ ΡΠ°Π±Π»ΠΎΠ½ΠΎΠ² ΠΈ ΡΠ΅ΡΠΈΠ½Π° Π΄ΠΈΡΠΏΠ»Π΅ΠΈ. Single.js ΡΠ²Π»ΡΠ΅ΡΡΡ Π΅ΡΠ΅ ΠΎΠ΄Π½ΠΈΠΌ ΠΎΡΠ»ΠΈΡΠ½ΡΠΌ Π²ΡΠ±ΠΎΡΠΎΠΌ Π΄Π»Ρ ΠΏΠΎΡΡΡΠΎΠ΅Π½ΠΈΡ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΠ°Π±Π»ΠΎΠ½Π° Π²Π΅Π±-ΡΠ°ΠΉΡΠ° Ρ ΡΠ΅ΠΊΡΠΈΠ΅ΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ.
14-03-2016
Adi.js — jQuery ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΎΠ±Π½Π°ΡΡΠΆΠ΅Π½ΠΈΡ Adblock | XoZblog
ΠΠ΄ΡΠ°Π²ΡΡΠ²ΡΠΉΡΠ΅, ΡΠ²Π°ΠΆΠ°Π΅ΠΌΡΠ΅ ΡΠΈΡΠ°ΡΠ΅Π»ΠΈ XoZbloga! Π Π°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ° Adblock ΠΈ Π΅ΠΌΡ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΠ΅ ΠΏΡΠΎΡΠ½ΠΎ Π²ΠΎΡΠ»ΠΈ Π² Π½Π°ΡΡ ΠΆΠΈΠ·Π½Ρ. ΠΠ½ΠΎΠ³ΠΈΠ΅ ΠΏΡΠΎΡΡΠΎ Π½Π΅ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΡΡ ΠΊΠ°ΠΊ ΡΠ°Π½ΡΡΠ΅ ΠΌΠΎΠ³Π»ΠΈ Π±Π΅Π· Π½ΠΈΡ ΠΎΠ±Ρ ΠΎΠ΄ΠΈΡΡΡΡ ΠΈ ΡΠΈΡΠ»ΠΎ ΡΠ°ΠΊΠΈΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ ΠΏΠΎΡΡΠΎΡΠ½Π½ΠΎ ΡΠ°ΡΡΠ΅Ρ. ΠΠ΄Π½Π°ΠΊΠΎ Π΄Π»Ρ Π²Π»Π°Π΄Π΅Π»ΡΡΠ΅Π² ΡΠ°ΠΉΡΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Π·Π°ΡΠ°Π±Π°ΡΡΠ²Π°ΡΡ Π½Π° ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΠΈ ΡΠ΅ΠΊΠ»Π°ΠΌΡ Π½Π° ΡΠ²ΠΎΠΈΡ ΡΠ΅ΡΡΡΡΠ°Ρ , ΡΡΠΎ ΡΠ΅ΡΡΠ΅Π·Π½ΡΠΉ ΡΠ΄Π°Ρ ΠΏΠΎ ΠΊΠΎΡΠ΅Π»ΡΠΊΡ. Π ΡΠ²ΡΠ·ΠΈ Ρ ΡΡΠΈΠΌ Π²ΡΡΠΎΡΠ»ΠΎ ΡΠΈΡΠ»ΠΎ ΡΠ°ΠΉΡΠΎΠ² Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΠ΅Π»ΡΠΌΠΈ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΡ Adblock. Π‘ ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· ΠΊΠΎΡΠΎΡΡΡ ΠΌΡ ΠΈ ΠΏΠΎΠ·Π½Π°ΠΊΠΎΠΌΠΈΠΌΡΡ Π² ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅. ΠΠ»Π°Π³ΠΈΠ½ Π½Π°Π·ΡΠ²Π°Π΅ΡΡΡ Adi.js, ΠΈ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΎΠ½ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ jQuery. Π‘ΡΡΠ°Π½ΠΈΡΠ° Π°Π²ΡΠΎΡΠ° Π½Π° GitHub.
ΠΡΠΎΡΠΌΠΎΡΡ Π΄Π΅ΠΌΠΎ ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ ΡΠΊΠ°ΡΠΈΠ²Π°Π½ΠΈΠ΅ ΠΈΡΡ ΠΎΠ΄Π½ΠΈΠΊΠΎΠ² Π½Π΅ Π΄ΠΎΡΡΡΠΏΠ½ΠΎ
Π£Π²Π°ΠΆΠ°Π΅ΠΌΡΠΉ ΡΠΈΡΠ°ΡΠ΅Π»Ρ, XoZblog ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΠΈ ΡΠ°Π·Π²ΠΈΠ²Π°Π΅ΡΡΡ Π·Π° ΡΡΡΡ Π΄ΠΎΡ ΠΎΠ΄ΠΎΠ² ΠΎΡ Π½Π΅Π½Π°Π²ΡΠ·ΡΠΈΠ²ΠΎΠΉ ΡΠ΅ΠΊΠ»Π°ΠΌΡ. ΠΡΠ»ΠΈ Π½Π΅ Π·Π°ΡΡΡΠ΄Π½ΠΈΡ, Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΡΡΠΎΡ ΡΠ°ΠΉΡ Π² ΠΈΡΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ AdBlock. Π‘ΠΏΠ°ΡΠΈΠ±ΠΎ Π·Π° ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅!
Π£ΡΡΠ°Π½ΠΎΠ²ΠΊΠ°
ΠΡΠ°ΠΊ, Π΄Π»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ Π²ΡΠ΅ Π·Π°ΡΠ°Π±ΠΎΡΠ°Π»ΠΎ Π½ΡΠΆΠ½ΠΎ:
- ΠΠΎΠ΄ΠΊΠ»ΡΡΠΈΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΡ jQuery
- ΠΠΎΠ΄ΠΊΠ»ΡΡΠΈΡΡ ΡΠ°ΠΉΠ» advertisement.js ΠΈ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ Π²Π½ΡΡΡΠΈ ΡΠ°ΠΉΠ»Π° Π΅ΡΡΡ jQuery.adblock = False;
- ΠΠΎΠ΄ΠΊΠ»ΡΡΠΈΡΡ ΡΠ°ΠΉΠ» ΠΏΠ»Π°Π³ΠΈΠ½Π° jquery.adi.js
- ΠΠΎΠ΄ΠΊΠ»ΡΡΠΈΡΡ ΡΡΠΈΠ»ΠΈ Π΄Π»Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π° jquery.adi.css
Π ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎ Π²ΡΠΏΠΎΠ»Π½ΠΈΡΡ Π²ΡΠ·ΠΎΠ²:
1 | $. adi({ /* Π·Π΄Π΅ΡΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ */ }) |
ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΈ ΠΌΠ΅ΡΠΎΠ΄Ρ
Π£ ΠΏΠ»Π°Π³ΠΈΠ½Π° ΠΏΡΠΈΡΡΡΡΡΠ²ΡΡΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ Π΄Π»Ρ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° ΠΈ ΠΌΠ΅ΡΠΎΠ΄Ρ Π΄Π»Ρ ΠΎΠ±ΡΠ°Π±ΠΎΡΠΊΠΈ ΠΏΠΎΠ»ΡΡΠ΅Π½Π½ΠΎΠ³ΠΎ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ°. ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° Π²ΡΠ΅Π³ΠΎ ΡΡΠΈ:
- title β ΡΠΈΠΏ string/html β Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π°;
- content β ΡΠΈΠΏ string/html β ΡΠ΅ΠΊΡΡ Π² ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠΌ ΠΎΠΊΠ½Π΅;
- theme β ΡΠΈΠΏ string β ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΠ°Ρ ΡΠ΅ΠΌΠ° ΠΎΡΠΎΡΠΌΠ»Π΅Π½ΠΈΡ, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½Ρ Π²Π°ΡΠΈΠ°Π½ΡΡ: light, dark (ΠΏΠΎ-ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ: light).
ΠΠ°Π»Π΅Π΅ ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π° ΡΠ°Π±Π»ΠΈΡΠ° Ρ ΠΌΠ΅ΡΠΎΠ΄Π°ΠΌΠΈ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π°:
ΠΠ΅ΡΠΎΠ΄ | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ |
active() | ΡΡΠ½ΠΊΡΠΈΡ ΠΎΠ±ΡΠ°ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠ·ΠΎΠ²Π°, ΡΡΠ°Π±Π°ΡΡΠ²Π°Π΅Ρ ΠΊΠΎΠ³Π΄Π° Adblock Π°ΠΊΡΠΈΠ²Π΅Π½; |
inactive() | ΡΡΠ½ΠΊΡΠΈΡ ΠΎΠ±ΡΠ°ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠ·ΠΎΠ²Π°, ΡΡΠ°Π±Π°ΡΡΠ²Π°Π΅Ρ ΠΊΠΎΠ³Π΄Π° Adblock Π½Π΅ Π°ΠΊΡΠΈΠ²Π΅Π½; |
onOpen() | ΡΡΠ½ΠΊΡΠΈΡ ΠΎΠ±ΡΠ°ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠ·ΠΎΠ²Π°, ΡΡΠ°Π±Π°ΡΡΠ²Π°Π΅Ρ ΠΊΠΎΠ³Π΄Π° ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΎ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ display Π² Π·Π½Π°ΡΠ΅Π½ΠΈΠΈ block; |
onClose() | ΡΡΠ½ΠΊΡΠΈΡ ΠΎΠ±ΡΠ°ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠ·ΠΎΠ²Π°, ΡΡΠ°Π±Π°ΡΡΠ²Π°Π΅Ρ ΠΊΠΎΠ³Π΄Π° ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° display ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ none. |
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
ΠΡΠ΅Π½ΠΈΡΡ ΠΊΠ°ΠΊ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΏΠ»Π°Π³ΠΈΠ½ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π° Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΉ ΡΡΡΠ°Π½ΠΈΡΠ΅, ΡΡΡΠ»ΠΊΠ° ΡΠ²Π΅ΡΡ
Ρ. ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΊΠ°ΡΠ°ΡΡ ΠΈΡΡ
ΠΎΠ΄Π½ΠΈΠΊΠΈ, ΡΡΠΎΠ±Ρ ΡΠΆΠ΅ Π±ΠΎΠ»Π΅Π΅ Π΄Π΅ΡΠ°Π»ΡΠ½ΠΎ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅.
ΠΠ° Π΄Π΅ΠΌΠΎ ΡΡΡΠ°Π½ΠΈΡΠ΅ Π½Π°Ρ
ΠΎΠ΄ΠΈΡΡΡ ΠΏΠΎΠ΄Π³ΠΎΡΠΎΠ²Π»Π΅Π½Π½ΡΠΉ Π±Π»ΠΎΠΊ div Π² ΠΊΠΎΡΠΎΡΡΠΉ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ° Π²ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ/ΠΎΡΠΊΠ»ΡΡΠ΅Π½ΠΈΡ Adblock ΠΏΠΎΠΌΠ΅ΡΠ°Π΅ΡΡΡ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ.
1 | <div></div> |
Π ΠΎΠ±ΡΠ΅ΠΌ Π²ΠΈΠ΄Π΅ Π²ΡΠ·ΠΎΠ² ΠΏΠ»Π°Π³ΠΈΠ½Π° Π±ΡΠ» Π²ΡΠΏΠΎΠ»Π½Π΅Π½ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ:
1 | $.adi({ |
ΠΠ° ΡΡΠΎΠΌ Π²ΡΠ΅. ΠΡΠ»ΠΈ Π²Ρ Π·Π½Π°Π΅ΡΠ΅ ΠΈΠ½ΡΠ΅ ΡΠΏΠΎΡΠΎΠ±Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΠΎΠ³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Adblock ΠΈΠ»ΠΈ Π½Π΅Ρ, ΠΏΠΎΠ΄Π΅Π»ΠΈΡΠ΅ΡΡ Π² ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡΡ .
ΠΡΡΠΎΡΠ½ΠΈΠΊ ΡΡΠ°ΡΡΠΈ/ΡΡΠΎΠΊΠ°: https://xozblog.ru
ΠΡΠ°Π²ΠΈΠ»Π° ΠΏΠ΅ΡΠ΅ΠΏΠ΅ΡΠ°ΡΠΊΠΈ
Π§ΡΠΎΠ±Ρ ΠΎΡΡΠ°Π²Π°ΡΡΡΡ Π² ΠΊΡΡΡΠ΅ ΡΠ²Π΅ΠΆΠΈΡ ΡΡΠ°ΡΠ΅ΠΉ ΠΈ ΡΡΠΎΠΊΠΎΠ² ΠΏΠΎΠ΄ΠΏΠΈΡΡΠ²Π°ΠΉΡΠ΅ΡΡ Π½Π°Β Π΅ΠΆΠ΅Π½Π΅Π΄Π΅Π»ΡΠ½ΡΡ ΠΏΠΎΡΡΠΎΠ²ΡΡ ΡΠ°ΡΡΡΠ»ΠΊΡ ΠΈΠ»ΠΈ Π½Π° Π½ΠΎΠ²ΠΎΡΡΠ½ΡΡ Π»Π΅Π½ΡΡ RSS. Π‘ΠΏΠ°ΡΠΈΠ±ΠΎ!
22 Π²Π΅Π»ΠΈΠΊΠΎΠ»Π΅ΠΏΠ½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½Π° jQuery | Creative Bloq
ΠΠ»Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ jQuery Π±ΡΠ»ΠΈ Π½Π°ΠΏΠΈΡΠ°Π½Ρ Π΄Π΅ΡΡΡΠΊΠΈ ΡΡΡΡΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ jQuery. ΠΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° jQuery, ΡΠΎΠ·Π΄Π°Π½Π½Π°Ρ Π² 2006 Π³ΠΎΠ΄Ρ ΠΠΆΠΎΠ½ΠΎΠΌ Π Π΅ΡΠΈΠ³ΠΎΠΌ, ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΠ΄Π½ΠΎΠΉ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ JavaScript. ΠΡΠΎ ΡΠ°Π½ΡΠ°ΡΡΠΈΡΠ΅ΡΠΊΠΈΠΉ ΡΠ΅ΡΡΡΡ Π΄Π»Ρ Π±ΡΡΡΡΠΎΠ³ΠΎ ΠΏΡΠΎΠ΅ΠΊΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΠΈ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΡ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠΉ. ΠΡΠ΄Ρ ΡΠΎ Π³Π°Π»Π΅ΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΈΠ»ΠΈ ΡΠΎΡΠΌΠ°, CSS-Π°Π½ΠΈΠΌΠ°ΡΠΈΡ Ρ ΡΠ°ΡΠΊΡΡΡΠΈΠ΅ΠΌ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΠΈΠ»ΠΈ ΡΡΡΠ΅ΠΊΡ Π²Π·ΡΡΠ²Π°, Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΎΡΠ½ΠΎΠ²Π½ΡΠ΅ ΡΡΡΠΎΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ Π±Π»ΠΎΠΊΠΈ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΠ΅ Π±ΡΡΡΡΠΎ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΏΡΠΎΡΠΎΡΠΈΠΏΡ ΠΈ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΡΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ Ρ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΡΠΌΠΈ Π·Π°ΡΡΠ°ΡΠ°ΠΌΠΈ ΠΊΠΎΠ΄Π° ΠΈ ΡΡΠΈΠ»ΠΈΠΉ.
ΠΠ΄Π½Π°ΠΊΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ Π»ΠΈ ΡΡΠΎ, ΡΡΠΎ Π²Ρ Π΄ΠΎΠ»ΠΆΠ½Ρ Π΄Π΅Π»Π°ΡΡ ΡΡΠΎ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΠΎΡΠΎΠΌΡ, ΡΡΠΎ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΎΠ·Π΄Π°ΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π»ΡΠ±ΠΎΠΉ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ? ΠΠΎΠ½Π΅ΡΠ½ΠΎ, Π½Π΅Ρ! ΠΠ΅Ρ Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎ Π½ΠΈΠΊΠ°ΠΊΠΎΠΉ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ ΠΈΠ·ΠΎΠ±ΡΠ΅ΡΠ°ΡΡ Π²Π΅Π»ΠΎΡΠΈΠΏΠ΅Π΄ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ°Π·, ΠΊΠΎΠ³Π΄Π° Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ ΡΠΎΠ·Π΄Π°ΡΡ ΡΡΠΎ-ΡΠΎ ΠΎΠ±ΡΠ΅Π΅; ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΠΌΠ³Π½ΠΎΠ²Π΅Π½Π½ΠΎΠ³ΠΎ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΡ. ΠΡΠΎ ΡΡΠΊΠΎΠ½ΠΎΠΌΠΈΡ Π²Π°ΠΌ Π΅ΡΠ΅ Π±ΠΎΠ»ΡΡΠ΅ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ ΠΈ ΡΡΠΈΠ»ΠΈΠΉ. ΠΠΈΠΆΠ΅ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ ΡΠΏΠΈΡΠΎΠΊ ΠΏΠΎΠ»Π΅Π·Π½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² jQuery. ΠΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²ΠΎ ΠΈΠ· Π½ΠΈΡ ΡΠΎΠΆΠ΅ Π±Π΅ΡΠΏΠ»Π°ΡΠ½Ρ.
Π§ΡΠΎΠ±Ρ ΠΏΠΎΠ»ΡΡΠΈΡΡ Π±ΠΎΠ»ΡΡΠ΅ ΠΏΠΎΠ»Π΅Π·Π½ΡΡ ΡΠ΅ΡΡΡΡΠΎΠ² ΠΏΠΎ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Ρ, ΠΈΠ·ΡΡΠΈΡΠ΅ Π½Π°Ρ ΡΠΏΠΈΡΠΎΠΊ Π»ΡΡΡΠΈΡ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠ² Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π°, Π»ΡΡΡΠΈΠ΅ API-ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΡ JavaScript ΠΈ Π½Π°Ρ Π²ΡΠ±ΠΎΡ Π»ΡΡΡΠΈΡ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠΎΠ² JavaScript Π΄Π»Ρ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΡ.
01. CZM Social Chat Support
ΠΠ΅Π³ΠΊΠΎ Π΄ΠΎΠ±Π°Π²Π»ΡΠΉΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠ°ΡΠ° Π½Π° ΡΠ²ΠΎΠΉ ΡΠ°ΠΉΡ (ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½ΠΎ CzMMedia)ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ jquery Π΄Π»Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΈ ΡΠΎΡΠΈΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΠ°ΡΠ° ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΠΌ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΡ Π½Π΅ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²Π° ΡΡΠ΅ΡΠ½ΡΡ Π·Π°ΠΏΠΈΡΠ΅ΠΉ ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΠ΅ΠΉ, Π²ΠΊΠ»ΡΡΠ°Ρ Whatsapp, Messenger, Skype, Twitter, Telegram ΠΈ Instagram. ΠΠ³ΠΎ Π»Π΅Π³ΠΊΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ, ΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΡΡΡΠΎΠΈΡΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΏΠΎ ΡΠ²ΠΎΠ΅ΠΌΡ ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΡ. Π ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²Π° ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Π² ΡΡΠΎΠΌ ΡΠΏΠΈΡΠΊΠ΅, ΠΎΠ½ ΠΏΠ»Π°ΡΠ½ΡΠΉ, ΠΈ Π΅Π³ΠΎ Π·Π°Π³ΡΡΠ·ΠΊΠ° Π±ΡΠ΄Π΅Ρ ΡΡΠΎΠΈΡΡ Π²Π°ΠΌ 9 Π΄ΠΎΠ»Π»Π°ΡΠΎΠ².
02. RTO + P Video Player
Π‘ΠΎΠ·Π΄Π°ΠΉΡΠ΅ ΡΠ²ΠΎΠΉ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ Π²ΠΈΠ΄Π΅ΠΎΠΏΡΠΎΠΈΠ³ΡΡΠ²Π°ΡΠ΅Π»Ρ, Π° Π½Π΅ ΠΏΠΎΠ»Π°Π³Π°ΠΉΡΠ΅ΡΡ Π½Π° Π²ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΡΠ΅ ΡΠ°ΠΉΠ»Ρ YouTube (ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½ΠΎ: RTO + P)ΠΠΎΠ½Π΅ΡΠ½ΠΎ, Π²ΡΡΡΠΎΠΈΡΡ Π²ΠΈΠ΄Π΅ΠΎ Ρ YouTube ΠΈΠ»ΠΈ Π³Π΄Π΅-Π»ΠΈΠ±ΠΎ Π΅ΡΠ΅ Π»Π΅Π³ΠΊΠΎ, Π½ΠΎ Π΅ΡΠ»ΠΈ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π±ΠΎΠ»ΡΡΠ΅ ΠΊΠΎΠ½ΡΡΠΎΠ»Ρ Π½Π°Π΄ Π²Π°ΡΠΈΠΌ Π²ΠΈΠ΄Π΅ΠΎ, ΡΠ΅ΠΌ RTO + P Video Player ΠΏΡΠΎΡΡΠΎ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌ.ΠΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π»Π΅Π³ΠΊΠΎ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΈ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°ΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ Π²ΠΈΠ΄Π΅ΠΎΠΏΠ»Π΅Π΅Ρ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ»ΡΡΠ°Π΅Ρ Π²ΠΈΠ΄Π΅ΠΎ Π»ΠΈΠ±ΠΎ Ρ Π²Π°ΡΠ΅Π³ΠΎ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠ΅ΡΠ²Π΅ΡΠ°, Π»ΠΈΠ±ΠΎ ΠΈΠ· CDN, Π»ΠΈΠ±ΠΎ ΠΈΠ· ΠΎΠ±ΡΠ΅Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ³ΠΎ ΠΏΠΎΡΠΎΠΊΠ° Vimeo. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΠ΅Π³ Π²ΠΈΠ΄Π΅ΠΎ HTML5, ΡΡΠΎΠ±Ρ ΡΠΏΡΠΎΡΡΠΈΡΡ ΠΆΠΈΠ·Π½Ρ, ΠΈΠ»ΠΈ Π΄Π»Ρ ΠΏΠΎΠ²ΡΡΠ΅Π½ΠΈΡ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡ ΠΎΡΠ»ΠΎΠΆΠ΅Π½Π½ΠΎΠΉ Π·Π°Π³ΡΡΠ·ΠΊΠΈ.
03. Slick
ΠΠ°ΠΊΡΡ Π±Ρ ΠΊΠ°ΡΡΡΠ΅Π»Ρ Π²Ρ Π½ΠΈ Π²ΡΠ±ΡΠ°Π»ΠΈ, ΡΠ΄Π΅Π»Π°ΠΉΡΠ΅ Π΅Π΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Slick (ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½ΠΎ ΠΠ΅Π½ΠΎΠΌ Π£ΠΈΠ»Π΅ΡΠΎΠΌ)ΠΡΠΎ ΠΏΠΎΡΠ»Π΅Π΄Π½ΡΡ ΠΊΠ°ΡΡΡΠ΅Π»Ρ, ΠΊΠΎΡΠΎΡΠ°Ρ Π²Π°ΠΌ ΠΊΠΎΠ³Π΄Π°-Π»ΠΈΠ±ΠΎ ΠΏΠΎΠ½Π°Π΄ΠΎΠ±ΠΈΡΡΡ? ΠΠΎΠ½Π΅ΡΠ½ΠΎ, ΠΌΠΎΠ³Π»ΠΎ Π±ΡΡΡ; Slick — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ Π΄Π°Π΅Ρ Π²Π°ΠΌ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠ΅ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π»ΡΠ±ΠΎΠ³ΠΎ ΡΠΈΠΏΠ°, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΠΆΠ΅Π»Π°ΡΡ, ΡΠΎ Π²ΡΠ΅ΠΌΠΈ Π²ΠΈΠ΄Π°ΠΌΠΈ ΠΎΠΏΡΠΈΠΉ Π΄Π»Ρ ΠΈΠ³ΡΡ, Π²ΠΊΠ»ΡΡΠ°Ρ Π»Π΅Π½ΠΈΠ²ΡΡ Π·Π°Π³ΡΡΠ·ΠΊΡ, Π°Π²ΡΠΎΠ²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΠ΅, ΠΎΠ±ΡΠ°ΡΠ½ΡΠ΅ Π²ΡΠ·ΠΎΠ²Ρ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅.
04. Muuri
ΠΠΈΠ±ΠΊΠΈΠ΅ ΠΌΠ°ΠΊΠ΅ΡΡ Muuri — ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠ΅, ΡΠΎΡΡΠΈΡΡΠ΅ΠΌΡΠ΅, ΡΠΈΠ»ΡΡΡΡΠ΅ΠΌΡΠ΅ ΠΈ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π΅ΠΌΡΠ΅.ΠΠ»Ρ ΠΏΠΎΠ»ΡΡΠ΅Π½ΠΈΡ ΠΌΠ°ΠΊΡΠΈΠΌΠ°Π»ΡΠ½ΠΎΠΉ Π³ΠΈΠ±ΠΊΠΎΡΡΠΈ ΠΌΠ°ΠΊΠ΅ΡΠΎΠ² ΡΡΠΎΠΈΡ Π²Π·Π³Π»ΡΠ½ΡΡΡ Π½Π° Muuri ΠΠΈΠΊΠ»Π°ΡΠ° Π ΡΠΌΡ. ΠΠ³ΠΎ ΡΠΈΡΡΠ΅ΠΌΠ° ΠΌΠ°ΠΊΠ΅ΡΠ° ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΠΌ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠ΅ΡΠΊΠΈ ΡΠ°Π·Π½ΡΡ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² Π² ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ΅ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π»ΡΠ±ΡΠΌ ΠΌΡΡΠ»ΠΈΠΌΡΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΈ ΠΎΠ½Π° Π°Π΄Π°ΠΏΡΠΈΠ²Π½Π°, ΡΠΎΡΡΠΈΡΡΠ΅ΡΡΡ, ΡΠΈΠ»ΡΡΡΡΠ΅ΡΡΡ ΠΈ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π΅ΡΡΡ. ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΎΠ½ ΡΠΏΠΎΡΡΠ΄ΠΎΡΠΈΠ²Π°Π΅Ρ Π²ΡΠ΅ ΠΏΠΎ ΠΏΡΠΈΠ½ΡΠΈΠΏΡ Β«ΡΠ½Π°ΡΠ°Π»Π° ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΈΡΒ», Π½ΠΎ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΡΠ²ΠΎΠΉ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ Π°Π»Π³ΠΎΡΠΈΡΠΌ ΠΌΠ°ΠΊΠ΅ΡΠ° Π΄Π»Ρ Π΄ΡΡΠ³ΠΎΠ³ΠΎ ΡΡΠΈΠ»Ρ ΠΌΠ°ΠΊΠ΅ΡΠ°.
05. Timeline.js
Timeline Π΄Π΅Π»Π°Π΅Ρ ΠΈΠΌΠ΅Π½Π½ΠΎ ΡΠΎ, ΡΡΠΎ Π½Π°ΠΏΠΈΡΠ°Π½ΠΎ Π½Π° Π±Π°Π½ΠΊΠ΅, ΠΈ ΡΠΎΠ·Π΄Π°Π΅Ρ ΠΏΠΎΠ»Π·ΡΠ½ΠΎΠΊ Π²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ ΡΠΊΠ°Π»Ρ.ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΠΏΠΎΠ²ΠΎΡΠΎΡ Π² ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ΅ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ: Timeline.js ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ Π²Π°ΠΌ Π²ΡΠ΅ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΠ΅ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΡΠΊΠ°Π»Π° Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ (Ρ. Π΅. ΠΏΠΎΠ»Π·ΡΠ½ΠΎΠΊ, ΠΊΠΎΡΠΎΡΡΠΉ Π΄Π²ΠΈΠΆΠ΅ΡΡΡ ΠΏΠΎ Ρ ΡΠΎΠ½ΠΎΠ»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΈΠΌ ΡΠΎΡΠΊΠ°ΠΌ). ΠΠ½ Π²ΠΊΠ»ΡΡΠ°Π΅Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΠΎΠΏΡΠΈΠΉ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΠΎΠΉ ΠΈ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΠΉ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ.
06. ΠΠ°ΠΊΠ»ΠΎΠ½Π½Π°Ρ ΠΏΡΠΎΠΊΡΡΡΠΊΠ° ΡΡΡΠ°Π½ΠΈΡ
ΠΠ°ΠΊΠ»ΠΎΠ½Π΅Π½Π½Π°Ρ ΠΏΡΠΎΠΊΡΡΡΠΊΠ° ΡΡΡΠ°Π½ΠΈΡ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π°ΠΊΠΊΡΡΠ°ΡΠ½ΡΠΉ ΡΡΠ΅Ρ ΠΌΠ΅ΡΠ½ΡΠΉ ΡΡΡΠ΅ΠΊΡ Π½Π° Π²Π°ΡΠΈ ΡΡΡΠ°Π½ΠΈΡΡΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΎΡ ΠΠΈΡΠ° Π . — ΠΎΡΠ»ΠΈΡΠ½ΡΠΉ ΡΠΏΠΎΡΠΎΠ± ΠΏΡΠΈΠ²Π»Π΅ΡΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π»ΡΠ΄Π΅ΠΉ ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π³Π»ΡΠ±ΠΈΠ½Ρ Π²Π°ΡΠ΅ΠΌΡ ΡΠ°ΠΉΡΡ. ΠΡΠ»ΠΈ ΠΎΠ½ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½, ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π±ΡΠ΄ΡΡ Π½Π°ΠΊΠ»ΠΎΠ½ΡΡΡΡΡ ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ Π²Π²Π΅ΡΡ ΠΈ ΡΠ½ΠΎΠ²Π° Π½Π°ΠΊΠ»ΠΎΠ½ΡΡΡΡΡ ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ Π²Π²Π΅ΡΡ Ρ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΡΠΎ ΠΊΡΠ°ΡΠΈΠ²ΡΠΉ ΡΡΡΠ΅ΠΊΡ, ΠΊΠΎΡΠΎΡΡΠΉ Π»Π΅Π³ΠΊΠΎ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²Π°ΡΡ.
07. Focuspoint
ΠΠΎΠΏΡΠΎΡΠ°ΠΉΡΠ΅ΡΡ Ρ ΠΏΠ»ΠΎΡ ΠΎ ΠΎΠ±ΡΠ΅Π·Π°Π½Π½ΡΠΌΠΈ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠΌΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈΠ‘Π°ΠΌΠΎΠ΅ Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ΅ Π² Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΌ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ — ΡΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΠΎΠ·Π΄Π°ΡΡ Π΅Π΄ΠΈΠ½ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΊΠΎΡΠΎΡΠ°Ρ Π±ΡΠ΄Π΅Ρ Ρ ΠΎΡΠΎΡΠΎ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ Π½Π° Π»ΡΠ±ΠΎΠΌ ΡΡΡΡΠΎΠΉΡΡΠ²Π΅.ΠΠ΄Π½Π°ΠΊΠΎ, Π΅ΡΠ»ΠΈ Π²Π°Ρ ΡΠ°ΠΉΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΎΠ±ΡΠ΅Π·Π°Π΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΈ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°Π»ΠΈ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΠΌ ΠΎΠΊΠ½Π°ΠΌ ΠΏΡΠΎΡΠΌΠΎΡΡΠ°, ΠΎΠ½ ΡΠ°ΡΡΠΎ ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΡΠ΅ΡΡΡΡ ΡΠΎΠΊΡΡ. Π‘ ΠΏΠΎΠΌΠΎΡΡΡ Focuspoint Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ Π²Π°ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠΌΠΎΡΡΠΈΡΡΡ Π² Π»ΡΠ±ΠΎΠΌ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ΅, ΡΠΊΠ°Π·Π°Π² ΡΠΎΠΊΡΡ Π΄Π»Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, Π° ΠΏΠ»Π°Π³ΠΈΠ½ ΠΎΠ±ΡΠ΅ΠΆΠ΅Ρ Π½Π΅Π½ΡΠΆΠ½ΡΠ΅ ΡΠ°ΡΡΠΈ ΠΏΠ΅ΡΠ΅Π΄ Π²Π°ΠΆΠ½ΡΠΌΠΈ.
08. SVGMagic
SVGMagic ΡΠΎΠ·Π΄Π°Π΅Ρ PNG Π΄Π»Ρ Π·Π°ΠΌΠ΅Π½Ρ SVG ΡΠ°ΠΌ, Π³Π΄Π΅ ΠΎΠ½ΠΈ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ SVG — Ρ ΠΎΡΠΎΡΠ°Ρ ΠΈΠ΄Π΅Ρ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΎΠ½ΠΈ Π±ΡΠ΄ΡΡ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠ΅ΡΠΊΠΈΠΌΠΈ ΠΏΡΠΈ Π»ΡΠ±ΠΎΠΌ ΡΠ°Π·ΠΌΠ΅ΡΠ΅, ΠΈ ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π²Π°ΠΌ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΠΎ, Π½Π΅ Π±Π΅ΡΠΏΠΎΠΊΠΎΡΡΡ ΠΎ Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΡ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡ. ΠΠ½ ΠΈΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ SVG ΠΈ Π·Π°ΠΌΠ΅Π½ΡΠ΅Ρ ΠΈΡ Π²Π΅ΡΡΠΈΡΠΌΠΈ PNG, Π΅ΡΠ»ΠΈ SVG Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ.
09. ΠΠ±Π½Π°ΡΡΠΆΠ΅Π½ΠΈΠ΅ Π»ΠΈΡ
ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°Π΅Ρ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΌΠΎΡΠ½ΠΎΠΉ ΡΠ΅Ρ Π½ΠΎΠ»ΠΎΠ³ΠΈΠΈ. ΠΠ±Π½Π°ΡΡΠΆΠ΅Π½ΠΈΠ΅ ΠΈ ΠΏΠΎΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΊΠΎΠΎΡΠ΄ΠΈΠ½Π°Ρ ΡΠ΅Π»ΠΎΠ²Π΅ΡΠ΅ΡΠΊΠΈΡ Π»ΠΈΡ Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΡ , Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Ρ ΠΎΠ»ΡΡΠ°Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π°, ΠΊΠΎΡΠΎΡΡΠΉ Π±ΡΠ» Π½Π°ΠΏΠΈΡΠ°Π½ ΠΠΆΠ΅Π΅ΠΌ Π‘Π°Π»ΡΠ²Π°ΡΠΎΠΌ ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Π»ΠΈΡΠΎ ΠΡ ΠΡ Π°Π»Π³ΠΎΡΠΈΡΠΌ ΠΎΠ±Π½Π°ΡΡΠΆΠ΅Π½ΠΈΡ.
10. ΠΡΡΠ³Π»ΡΠΉ ΠΏΠΎΠ»Π·ΡΠ½ΠΎΠΊ
ΠΠΎΠ»Π·ΡΠ½ΠΎΠΊ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΡΠ΅ΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΎΡΠΎΡΠΌΠ»Π΅Π½ Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ Π²Π°ΡΠΈΠΌΠΈ ΡΠ΅Π»ΡΠΌΠΈ.ΠΡΠΎΡ ΠΊΡΡΠ³Π»ΡΠΉ ΠΏΠΎΠ»Π·ΡΠ½ΠΎΠΊ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π²ΡΠ±ΡΠ°ΡΡ Π΄ΠΈΠ°ΠΏΠ°Π·ΠΎΠ½ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ, Π½Π°Π²Π΅Π΄Ρ ΠΊΡΡΡΠΎΡ ΠΌΡΡΠΈ Π½Π° ΠΊΡΡΠ³.ΠΠΎΠ»Π½ΡΠΉ ΠΏΠΎΠ»Π·ΡΠ½ΠΎΠΊ ΡΠ²Π»ΡΠ΅ΡΡΡ Π½Π°ΡΡΡΠΎΠΉΠΊΠΎΠΉ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, Π½ΠΎ Π²Ρ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π΄Π»Ρ ΠΏΠΎΠ»ΡΡΠ΅Π½ΠΈΡ ΡΠΎΡΠΌ ΡΠ΅ΡΠ²Π΅ΡΡΠΈ ΠΊΡΡΠ³Π°, ΠΏΠΎΠ»ΡΠΊΡΡΠ³Π° ΠΈ ΠΊΡΡΠ³ΠΎΠ²ΠΎΠΉ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΡ. Π‘ΡΡΠ΅ΡΡΠ²ΡΡΡ ΡΡΠΈΠ»ΠΈ CSS, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π°Π΄Π°ΠΏΡΠΈΡΠΎΠ²Π°ΡΡ ΠΊ ΡΠ΅ΠΌΠ΅ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌΠΈ ΡΠΏΠΎΡΠΎΠ±Π°ΠΌΠΈ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΈ Π²ΡΠ³Π»ΡΠ΄Π΅Π»ΠΈ ΠΊΠ°ΠΊ ΡΠΏΠΈΠ΄ΠΎΠΌΠ΅ΡΡ. ΠΠΈΠΊΠ°ΠΊΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½Π΅ Π·Π°Π΄Π΅ΠΉΡΡΠ²ΠΎΠ²Π°Π½Ρ; Π²ΡΠ΅ ΡΡΠΎ ΡΠ΄Π΅Π»Π°Π½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS ΠΈ JavaScript.
ΠΠ΅Π³ΠΊΠΎΠ΅ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΡΡΡΠ΅ΠΊΡΠ° ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡΠ°jInvertscroll ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π»Π΅Π³ΠΊΠΎ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²Π°ΡΡ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΡ Ρ ΡΡΡΠ΅ΠΊΡΠΎΠΌ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡΠ°. ΠΡΠΎΠΊΡΡΡΠΈΡΠ΅ ΠΊΠΎΠ»Π΅ΡΠΈΠΊΠΎ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ Π½Π° ΠΈΡ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΡΠ΅, ΡΡΠΎΠ±Ρ ΡΠΊΠΎΠ»ΡΠ·ΠΈΡΡ Π±ΠΎΠΊΠΎΠΌ, Π² ΡΠΎ Π²ΡΠ΅ΠΌΡ ΠΊΠ°ΠΊ Π΄Π²Π° ΡΠ»ΠΎΡ Π»Π°Π½Π΄ΡΠ°ΡΡΠ° Π΄Π²ΠΈΠΆΡΡΡΡ Ρ ΡΠ°Π·Π½ΠΎΠΉ ΡΠΊΠΎΡΠΎΡΡΡΡ, ΡΠΎΠ·Π΄Π°Π²Π°Ρ ΠΈΠ»Π»ΡΠ·ΠΈΡ Π³Π»ΡΠ±ΠΈΠ½Ρ.
12. Slinky
ΠΠΈΠ·Π°ΠΉΠ½ ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π΅ Π²ΡΠΉΠ΄Π΅Ρ ΠΈΠ· ΠΌΠΎΠ΄Ρ?Slinky — ΡΡΠΎ ΡΠ»Π΅Π³Π°Π½ΡΠ½ΡΠΉ, Π²Π½Π΅Π²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ»Π΅Π·Π΅Π½ Π΄Π»Ρ Π»ΡΠ±ΠΎΠ³ΠΎ ΡΡΠ΅Π½Π°ΡΠΈΡ, Π² ΠΊΠΎΡΠΎΡΠΎΠΌ Ρ Π²Π°Ρ Π΅ΡΡΡ ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ΄ΠΌΠ΅Π½Ρ. ΠΡΠ±Π΅ΡΠΈΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΈ ΠΏΠΎΠ΄ΠΌΠ΅Π½Ρ Π±ΡΠ΄Π΅Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ. ΠΠ΄Π΅ΡΡ Π΅ΡΡΡ Π΄Π΅ΠΌΠΎ.
13. TwentyTwenty
ΠΠ»Π°Π³ΠΈΠ½ ZURB ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ ΡΡΠ°Π²Π½ΠΈΠ²Π°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΠΌΠ΅ΡΡΠΎ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ Π΄Π²Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΡΠ΄ΠΎΠΌ, ΡΡΠΎΠ±Ρ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ ΡΠ°Π·Π»ΠΈΡΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρ Π½ΠΈΠΌΠΈ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠΌΠ΅ΡΠ°Π΅Ρ ΠΎΠ΄Π½ΠΎ ΠΏΠΎΠ²Π΅ΡΡ Π΄ΡΡΠ³ΠΎΠ³ΠΎ.ΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°ΡΡ ΠΏΠΎΠ»Π·ΡΠ½ΠΎΠΊ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΡΠΊΠ²ΠΎΠ·Ρ Π½Π΅Π³ΠΎ ΠΏΡΠΎΡΠ²Π΅ΡΠΈΠ²Π°Π»ΠΎ Π½ΠΈΠΆΠ½Π΅Π΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΡΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΈΠΌ ΡΠ²ΠΈΠ΄Π΅ΡΡ, ΡΡΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ»ΠΎΡΡ Π² ΡΠΈΡΡΠ°ΡΠΈΠΈ Π΄ΠΎ ΠΈ ΠΏΠΎΡΠ»Π΅.
14. ΠΠ΅ΡΠ°ΡΡ ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»ΡΠ½ΠΎΠ³ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Π°
ΠΠ½ΠΈΠΌΠ°ΡΠΈΡ ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΠΌΠΎΡΡ Π½Π°ΠΏΡΠ°Π²ΠΈΡΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉΠΡΡΠ΅ΠΊΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ ΠΈΠ΅ΡΠ°ΡΡ ΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΌΠΎΠ³ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π΄Π»Ρ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ ΠΈ ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π° ΠΎΡ ΠΎΠ΄Π½ΠΎΠΉ ΡΠΎΡΠΊΠΈ ΠΊ Π΄ΡΡΠ³ΠΎΠΉ Π² ΠΏΡΠΎΡΠ΅ΡΡΠ΅. ΠΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ Π²Π°ΡΠΈΠΌ Π΄ΠΈΠ·Π°ΠΉΠ½ΠΎΠΌ, ΠΈ ΠΎΠ½Π° ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΠΎΡΠ»ΠΈΡΠ½ΡΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ, ΠΊΠΎΡΠΎΡΠ°Ρ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π²Π°ΠΌ Π½Π°ΡΠ°ΡΡ ΡΠ°Π±ΠΎΡΡ.
15.Tabslet
ΠΠΈΠ½ΠΈΠΌΠ°Π»ΠΈΡΡΠΈΡΠ½ΡΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ Π²ΠΊΠ»Π°Π΄ΠΎΠΊΠΠ°ΠΊ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΈΠ· Π½Π°Π·Π²Π°Π½ΠΈΡ, Tabslet — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ. ΠΠ½ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ / ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ, ΡΠΎΡΠ°ΡΠΈΡ, Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ, Π³Π»ΡΠ±ΠΎΠΊΠΈΠ΅ ΡΡΡΠ»ΠΊΠΈ ΠΈ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ Π΄ΡΡΠ³ΠΈΡ ΠΏΠΎΠ»Π΅Π·Π½ΡΡ ΡΡΠ½ΠΊΡΠΈΠΉ. ΠΠ·Π³Π»ΡΠ½ΠΈΡΠ΅ Π½Π° Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ, ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΈΡ Π»ΠΈ ΠΎΠ½Π° Π²Π°ΡΠΈΠΌ ΠΏΠΎΡΡΠ΅Π±Π½ΠΎΡΡΡΠΌ.
16. nanogallery2
ΠΠΎΠ»Π½ΠΎΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½Π°Ρ, Π±ΡΡΡΡΠ°Ρ Π³Π°Π»Π΅ΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉnanogallery2 ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½Π° Π΄Π»Ρ ΡΠΏΡΠΎΡΠ΅Π½ΠΈΡ Π²Π°ΡΠΈΡ Π³Π°Π»Π΅ΡΠ΅ΠΉ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΈ ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΠΌΠ½ΠΎΠ³ΠΎΡΡΠΎΠ²Π½Π΅Π²ΡΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ Π² Π°Π»ΡΠ±ΠΎΠΌΠ°Ρ , Π»Π°ΠΉΡΠ±ΠΎΠΊΡ, ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡΡΠ΅ΠΌΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ Π½Π° ΡΡΠΊΠΈΠ·Ρ, ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ, ΠΏΠΎΠ»Π½ΠΎΡΠΊΡΠ°Π½Π½ΡΠΉ ΡΠ΅ΠΆΠΈΠΌ, ΡΠ°Π·Π±ΠΈΠ΅Π½ΠΈΠ΅ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π»Π΅Π½ΠΈΠ²Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ°.ΠΠ½ ΡΠ΅Π½ΡΠΎΡΠ½ΡΠΉ, ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠΉ, Π±ΡΡΡΡΡΠΉ ΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΎΠ±Π»Π°ΡΠ½ΠΎΠ΅ Ρ ΡΠ°Π½ΠΈΠ»ΠΈΡΠ΅.
ΠΠ΅ΡΡΠΈΡ 2 ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΡΠ»ΡΡΡΠ΅Π½Π½ΡΠΉ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ ΠΈ Π½ΠΎΠ²ΡΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ ΡΠΈΠ»ΡΡΡ ΠΏΠΎ ΠΊΠ»ΡΡΠ΅Π²ΡΠΌ ΡΠ»ΠΎΠ²Π°ΠΌ, ΠΊΠΎΡΠ·ΠΈΠ½Π° Π΄Π»Ρ ΠΏΠΎΠΊΡΠΏΠΎΠΊ, ΡΠΎΠ²ΠΌΠ΅ΡΡΠ½ΠΎΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ Π² ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΡΡ , ΡΠ°ΡΡΠΈΡΠ΅Π½Π½ΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ, ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Ρ ΠΌΠ΅ΠΆΠ΄Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΡΡΠΊΠΈΠ·ΠΎΠ², ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΎΠ½Π½Π°Ρ ΡΡΡΠ°Π½ΠΈΡΠ° Ρ ΠΌΠ΅ΡΡΠΎΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ΠΌ Π½Π° ΠΠ°ΡΡΠ°Ρ Google ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅.
ΠΠ΅ΠΎΠ±ΡΡΠ½ΡΠ΅ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Ρ TooltipsterTooltipster — ΡΡΠΎ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΉ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ ΠΊ ΠΊΠ»Π°ΡΡΠΈΡΠ΅ΡΠΊΠΎΠΉ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ΅, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΠΉ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Ρ ΠΏΠΎΠ»Π½ΠΎΠΉ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΎΠΉ HTML Π² ΡΠ΅ΠΌΠ°Π½ΡΠΈΡΠ΅ΡΠΊΠΎΠΉ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠ΅ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ CSS Π΄Π»Ρ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ.Π‘ΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΡΠΈΡΠΎΠΊΠΈΠΉ ΡΠΏΠ΅ΠΊΡΡ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΈ, ΡΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°ΡΡ Π΅Π³ΠΎ Π΄Π»Ρ Π»ΡΠ±ΠΎΠ³ΠΎ ΡΡΠ΅Π½Π°ΡΠΈΡ.
ΠΠ΅Π³ΠΊΠΈΠΉ ΠΈ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ Π»Π°ΠΉΡΠ±ΠΎΠΊΡΠΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π»Π°ΠΉΡΠ±ΠΎΠΊΡΠ° Π΄Π»Ρ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΡΡΡΠ΅ΠΌΠΈΡΡΡ Π±ΡΡΡ ΠΌΠ°ΠΊΡΠΈΠΌΠ°Π»ΡΠ½ΠΎ Π»Π΅Π³ΠΊΠΈΠΌ ΠΈ ΡΠΎΠ²ΠΌΠ΅ΡΡΠΈΠΌΡΠΌ. Π Π°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊ ΡΠΎΡΡΠ΅Π΄ΠΎΡΠΎΡΠΈΠ»ΡΡ Π½Π° ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΠΈ ΠΈ ΡΠ΄ΠΎΠ±ΡΡΠ²Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ, ΠΏΠΎΡΡΠΎΠΌΡ ΠΎΠ½ Π½Π΅ ΠΎΠ±Π»Π°Π΄Π°Π΅Ρ Π²ΡΠ΅ΠΌΠΈ ΡΡΠ½ΠΊΡΠΈΡΠΌΠΈ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Π΄Π»Ρ Π»Π°ΠΉΡΠ±ΠΎΠΊΡΠΎΠ², Π½ΠΎ ΠΎΠ½ ΡΡΠΏΠ΅ΡΠ±ΡΡΡΡΡΠΉ ΠΈ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π½Π° ΠΎΠ³ΡΠΎΠΌΠ½ΠΎΠΌ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²Π΅ ΡΡΡΡΠΎΠΉΡΡΠ², Π²ΠΊΠ»ΡΡΠ°Ρ ΡΡΡΡΠΎΠΉΡΡΠ²Π° Ρ Π²ΡΡΠΎΠΊΠΈΠΌ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ (Retina), ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ MacBook Pro.
19. jQuery Knob
Π‘Π΅Π½ΡΠΎΡΠ½ΡΠ΅ Π΄ΠΈΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°ΠΊΠΆΠ΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π½Π° Π½Π°ΡΡΠΎΠ»ΡΠ½ΠΎΠΌ ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ΅jQuery Knob ΠΏΡΠΈΠ½ΠΈΠΌΠ°Π΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π²Π²ΠΎΠ΄Π° ΠΈ ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΡΠ΅Ρ ΠΈΡ Π² ΡΠ΄ΠΎΠ±Π½ΡΠ΅ Π΄Π»Ρ ΠΊΠ°ΡΠ°Π½ΠΈΡ ΡΠΈΡΠ΅ΡΠ±Π»Π°ΡΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°ΠΊΠΆΠ΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π½Π° ΡΠ°Π±ΠΎΡΠ΅ΠΌ ΡΡΠΎΠ»Π΅. ΠΡΠΎ ΠΎΡΠ»ΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π°Π΄Π°ΠΏΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠ²ΠΎΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ Π½ΠΎΠ²ΡΠΌΠΈ ΠΏΠ°ΡΠ°Π΄ΠΈΠ³ΠΌΠ°ΠΌΠΈ, ΠΈ ΡΡΠΎΠΈΡ ΠΏΠΎΠΏΡΠΎΠ±ΠΎΠ²Π°ΡΡ ΠΊΠ°ΠΊ ΠΌΠΈΠ½ΠΈΠΌΡΠΌ ΡΠ΅Ρ Π½ΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΏΠΎΠ΄Ρ ΠΎΠ΄.
20. Typeahead.js
Π£Π΄ΠΎΠ±Π½ΡΠΉ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ Π°Π²ΡΠΎΠ·Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ, ΡΠΎΠ·Π΄Π°Π½Π½ΡΠΉ ΠΊΠΎΠΌΠ°Π½Π΄ΠΎΠΉ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² Twitter.ΠΡΠΎΠ΄ΡΠΊΡ ΠΊΠΎΠΌΠ°Π½Π΄Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² Twitter, Type Ahead — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ Π² ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΈΠ·Π²Π»Π΅ΠΊΠ°Π΅Ρ Π΄Π°Π½Π½ΡΠ΅ ΠΈΠ· Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΈΠ»ΠΈ Π²Π½Π΅ΡΠ½Π΅Π³ΠΎ ΠΈΡΡΠΎΡΠ½ΠΈΠΊΠ° Π΄Π°Π½Π½ΡΡ ΠΎΡ ΠΈΠΌΠ΅Π½ΠΈ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ. Π²Π²ΠΎΠ΄ΠΈΡ ΡΠ΅ΠΊΡΡ Π² ΠΏΠΎΠ»Π΅ Π²Π²ΠΎΠ΄Π°, ΠΏΡΠ΅Π΄Π»Π°Π³Π°Ρ Π°Π²ΡΠΎΠ·Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΏΠΎ ΠΌΠ΅ΡΠ΅ ΠΈΡ ΠΏΠΎΡΡΡΠΏΠ»Π΅Π½ΠΈΡ.
21. Lettering.js
ΠΠΎΠ»ΡΡΠΈΡΠ΅ ΡΠΎΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΡΠΎΠ»Ρ Π½Π°Π΄ Π²Π°ΡΠΈΠΌ ΡΠΈΠΏΠΎΠΌLettering.js ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°Π΅Ρ Π΄Π΅ΡΠ°Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΡΠΎΠ»Ρ Π½Π°Π΄ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠΌΠΈ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π²Π°ΡΠ΅Π³ΠΎ ΡΠΈΠΏΠ°, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡ Π²Π°ΠΌ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡ ΠΊΠ΅ΡΠ½ΠΈΠ½Π³, ΡΠ°ΡΠΊΡΠ°ΡΠΈΠ²Π°ΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠ΅ Π±ΡΠΊΠ²Ρ ΠΈ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ Ρ ΠΎΡΠΎΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Ρ FitText (Π½ΠΈΠΆΠ΅), ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΡ Π²Π°ΠΌ ΠΊΠΎΠ½ΡΡΠΎΠ»Ρ Π½Π°Π΄ ΡΠΈΠΏΠΎΠ³ΡΠ°ΡΠΈΠΊΠΎΠΉ Π² ββΡΡΠΈΠ»Π΅ ΡΠ°Π±ΠΎΡΠ΅Π³ΠΎ ΡΡΠΎΠ»Π°, ΠΎΡΡΠ°Π²Π°ΡΡΡ ΠΏΡΠΈ ΡΡΠΎΠΌ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠΌ.
22. FitText
ΠΠ²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° Π΄Π»Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ²ΠΡΠΎΡ ΡΠ΄ΠΎΠ±Π½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ ΡΠΈΡΠΈΠ½Ρ Π²Π°ΡΠ΅Π³ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° Π²Π°ΡΠΈΠΌ ΡΡΠΈΡΡΠΎΠΌ, Π½ΠΎ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΡΠ΅Ρ ΡΠ°Π·ΠΌΠ΅Ρ ΡΠ΅ΠΊΡΡΠ° Π²Π²Π΅ΡΡ ΠΈΠ»ΠΈ Π²Π½ΠΈΠ· Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ ΡΡΠ΅Π±ΠΎΠ²Π°Π½ΠΈΡΠΌΠΈ. ΠΠ»Π°Π³ΠΈΠ½, ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½Π½ΡΠΉ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΡ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ², ΡΠ°ΠΊΠΆΠ΅ ΠΈΠ½ΡΠ΅Π³ΡΠΈΡΡΠ΅ΡΡΡ Ρ Lettering.js, ΡΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°ΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠ΅ ΡΡΠΈΠ»ΠΈ Π΄Π»Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠΈΠΌΠ²ΠΎΠ»Π°.
Π‘ΡΠ°ΡΡΠΈ ΠΏΠΎ ΡΠ΅ΠΌΠ΅:
ΠΠ°ΡΠ΅Π³ΠΎΡΠΈΠΈ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉjQuery | Π‘ΠΊΡΠΈΠΏΡ jQuery
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΠΎΠ΅ jQuery Accordion Menu, Accordion Slider ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π² ΡΡΠΈΠ»Π΅ Accordion.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ jQuery Scrolling, Parallax Scrolling, Text Animation, CSS3-based Animation ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½Π°Ρ ΠΊΡΡΠ³ΠΎΠ²Π°Ρ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΠ° jQuery, Π³ΠΈΡΡΠΎΠ³ΡΠ°ΠΌΠΌΠ°, ΠΊΠΎΠ»ΡΡΠ΅Π²Π°Ρ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΠ°, Π»ΠΈΠ½Π΅ΠΉΠ½Π°Ρ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΠ° ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΡ ΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ Π²ΠΈΠ·ΡΠ°Π»ΠΈΠ·Π°ΡΠΈΠΈ Π΄Π°Π½Π½ΡΡ .
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery CSS3 ΠΈ HTML5.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½Π°Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠ° ΡΠΎΡΠΌΡ jQuery, ΠΌΠ°ΡΠΊΠ° Π²Π²ΠΎΠ΄Π°, Π²ΡΠ±ΠΎΡ, ΡΠ»Π°ΠΆΠΎΠΊ, ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»Ρ, Textarea ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΡΠ»ΡΡΡΠ΅Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΠΎΡΠΌΡ.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ jQuery #Gallery Lightbox, #Photo Gallery, #Polaroid Gallery ΠΈ #Gallery Slider.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠΉ ΠΌΠ°ΠΊΠ΅Ρ ΡΠ΅ΡΠΊΠΈ jQuery, ΠΌΠ°ΠΊΠ΅Ρ Π² ΡΡΠΈΠ»Π΅ Pinterest, ΠΏΡΠΎΠΊΡΡΡΠΊΠ° ΠΎΠ΄Π½ΠΎΠΉ ΡΡΡΠ°Π½ΠΈΡΡ, Π²ΠΊΠ»Π°Π΄ΠΊΠΈ, ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° Π² Π²ΠΈΠ΄Π΅ Π΄Π΅ΡΠ΅Π²Π°.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery Modal, Popup, Gallery Lightbox ΠΈ Image & Content Lightbox.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠΉ ΡΡΠ΅ΡΡΠΈΠΊ Π·Π°Π³ΡΡΠ·ΠΊΠΈ jQuery, ΠΎΡΠ»ΠΎΠΆΠ΅Π½Π½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ°, Π·Π°Π³ΡΡΠ·ΠΊΠ° ΠΎΠ²Π΅ΡΠ»Π΅Ρ, ΠΏΠ°Π½Π΅Π»Ρ Progrss, ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΈ Π΄ΡΡΠ³ΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ jQuery Off-canvas, Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ, push-ΠΌΠ΅Π½Ρ, ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π΅ΡΡ ΠΌΠ΅Π½Ρ, ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ, Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ, ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΠΌΠ΅Π½Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery Π΄Π»Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡ ΠΈ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ.
ΠΡΡΠ³ΠΈΠ΅ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΠ΅ ΠΌΠΎΠ΄ΡΠ»ΠΈ jQuery Π±Π΅Π· ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΠΉ.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery Image Rotator, Text Rotator, Banner Rotator.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery Image Slider, Content Slider, Carousel ΠΈ Range Slider.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ jQuery Π΄Π»Ρ ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΈ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΈ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΡΠΎΠ½ΠΎΠ²ΡΡ ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ jQuery #Social Share, #Social Button ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΠ΅ΠΉ.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ jQuery Data Table, Data Grid, Table Sort ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ Ρ ΡΠ°Π±Π»ΠΈΡΠ°ΠΌΠΈ.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠΉ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΠΉ ΡΡΡΠ΅ΠΊΡ jQuery, Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΡΠ΅ΠΊΡΡΠ°, ΡΠ΅ΠΊΡΡΠΎΠ²ΡΠΉ ΡΠ΅Π΄Π°ΠΊΡΠΎΡ WYSIWYG, ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΡΠ΅ΠΊΡΡΠ°, ΡΡΠ΅Π΄ΡΡΠ²ΠΎ Π²ΡΠ°ΡΠ΅Π½ΠΈΡ ΡΠ΅ΠΊΡΡΠ° ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ, ΡΠ²ΡΠ·Π°Π½Π½ΡΠ΅ Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΠΎΠ΅ ΡΡΠ΅Π΄ΡΡΠ²ΠΎ Π²ΡΠ±ΠΎΡΠ° Π΄Π°ΡΡ ΠΈ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ jQuery, ΡΡΠ΅ΡΡΠΈΠΊ, ΡΠ°ΠΉΠΌΠ΅Ρ ΠΎΠ±ΡΠ°ΡΠ½ΠΎΠ³ΠΎ ΠΎΡΡΡΠ΅ΡΠ°, ΡΠ°ΡΡ ΠΈ ΠΊΠ°Π»Π΅Π½Π΄Π°ΡΡ ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ, ΡΠ²ΡΠ·Π°Π½Π½ΡΠ΅ Ρ Π΄Π°ΡΠΎΠΉ ΠΈ Π²ΡΠ΅ΠΌΠ΅Π½Π΅ΠΌ.
jQuery Simple and Stylish Tooltip Plugins.
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery Image Zoom, Inner Zoom, Magnifying Glass Effect.
50 Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ»Π΅Π·Π½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² jQuery Π΄Π»Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ Π²Π΅Π±-ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ°
ΠΠΎΡΡΡΠΏΠ½ΠΎ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ Π΄ΡΡΠ³ΠΈΡ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠΎΠ² JavaScript, Π½ΠΎ jQuery, Π½Π΅ΡΠΎΠΌΠ½Π΅Π½Π½ΠΎ, ΡΠ²Π»ΡΠ΅ΡΡΡ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΠΌ (ΠΏΠΎ Π΄Π°Π½Π½ΡΠΌ BuiltWith, Π² Π½Π°ΡΡΠΎΡΡΠ΅Π΅ Π²ΡΠ΅ΠΌΡ Π΅Π³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ Π±ΠΎΠ»Π΅Π΅ 78% ΠΈΠ· ΠΌΠΈΠ»Π»ΠΈΠΎΠ½ΠΎΠ² ΡΠ°ΠΉΡΠΎΠ²). Π¦Π΅Π»Ρ jQuery — ΡΠΏΡΠΎΡΡΠΈΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΠΈ Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΌΠ½ΠΎΠ³ΠΈΡ ΡΡΠ½ΠΊΡΠΈΠΉ JavaScript, Π΄Π»Ρ ΠΊΠΎΡΠΎΡΡΡ ΠΎΠ±ΡΡΠ½ΠΎ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΠΌΠ½ΠΎΠ³ΠΎ ΡΡΡΠΎΠΊ ΠΊΠΎΠ΄Π°, ΠΏΡΡΠ΅ΠΌ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½Π΅Π½ΠΈΡ ΠΈΡ Π² ΠΌΠ΅ΡΠΎΠ΄Ρ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π²ΡΠ·ΡΠ²Π°ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΎΠ΄Π½ΠΎΠΉ ΡΡΡΠΎΠΊΠΈ ΠΊΠΎΠ΄Π°.ΠΠ½ Π»Π΅Π³ΠΊΠΈΠΉ ΠΈ ΡΠ°ΡΡΠΈΡΡΠ΅ΠΌΡΠΉ, ΠΏΠΎΡΡΠΎΠΌΡ Π΅ΡΡΡ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery Π΄Π»Ρ ΠΏΠΎΡΡΠΈ Π²ΡΠ΅Ρ ΡΡΠ½ΠΊΡΠΈΠΉ, ΠΎ ΠΊΠΎΡΠΎΡΡΡ Π²Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΠ΄ΡΠΌΠ°ΡΡ.
Π§ΡΠΎΠ±Ρ ΠΏΠΎΠΌΠΎΡΡ Π²Π°ΠΌ Π±ΡΡΡΡΠΎ Π½Π°ΠΉΡΠΈ ΠΈΠΌΠ΅Π½Π½ΠΎ ΡΠΎ, ΡΡΠΎ Π²Ρ ΠΈΡΠ΅ΡΠ΅, ΠΌΡ ΠΊΠ»Π°ΡΡΠΈΡΠΈΡΠΈΡΠΎΠ²Π°Π»ΠΈ Π²ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ jQuery ΠΏΠΎ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌ ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΡΠΌ: ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π²Π΅Π±- ΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΠΌΠ°ΠΊΠ΅ΡΠΎΠ², ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΌΠ΅Π½Ρ ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΠΌΡΠ»ΡΡΠΈΠΌΠ΅Π΄ΠΈΠ°, ΡΠ»Π°ΠΉΠ΄Π΅ΡΡ, ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΠΈ Π³Π°Π»Π΅ΡΠ΅ΠΈ, ΡΠ΅ΠΊΡΡΠΎΠ²ΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ. ΠΠ»Π°Π³ΠΈΠ½Ρ, ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠΎΡΠΌ ΠΈ, Π½Π°ΠΊΠΎΠ½Π΅Ρ, ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ ΡΠ»ΡΠΆΠ΅Π±Π½ΡΡ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌ Π±Π΅Π· ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΠΉ.
ΠΠ°Π½Π΅Π»Ρ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠ² Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ΡΠ°
ΠΠ΅ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Π½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ Π·Π°Π³ΡΡΠ·ΠΎΠΊ: Π±ΠΎΠ»Π΅Π΅ 1 000 000 Π²Π΅Π±-ΡΠ°Π±Π»ΠΎΠ½ΠΎΠ², ΡΠ΅ΠΌ, ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ², ΡΠ΅ΡΡΡΡΠΎΠ² Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅!
ΠΠ»Π°Π³ΠΈΠ½Ρ jQuery Π΄Π»Ρ Π²Π΅Π±- ΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΠΌΠ°ΠΊΠ΅ΡΠΎΠ²
pagePiling.js — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ Β«Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΡΒ» ΡΠ°Π·Π΄Π΅Π»ΠΎΠ² ΠΌΠ°ΠΊΠ΅ΡΠ° Π΄ΡΡΠ³ Π½Π° Π΄ΡΡΠ³Π° ΠΈ Π΄ΠΎΡΡΡΠΏΠ° ΠΊ Π½ΠΈΠΌ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ.
fullPage.js — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΏΠΎΠ»Π½ΠΎΡΠΊΡΠ°Π½Π½ΡΡ
ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°Π΅ΠΌΡΡ
Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ².
JQuery Tilted Page Scroll ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΡΠΉ ΠΈ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ ΡΡΠ΅Ρ
ΠΌΠ΅ΡΠ½ΡΠΉ ΡΡΡΠ΅ΠΊΡ Π½Π°ΠΊΠ»ΠΎΠ½Π½ΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ Π½Π° Π²Π°ΡΠ΅ΠΌ Π²Π΅Π±-ΡΠ°ΠΉΡΠ΅.
gridscrolling.js — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΠ°Π·Π΄Π΅Π»ΠΎΠ² ΠΈ ΡΡΠΎΡΠΎΠ½ Π² ΡΠ΅ΡΠΊΠ΅ ΠΈ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠΈΠΉ Π»Π΅Π³ΠΊΠΎ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΊΠ»Π°Π²ΠΈΡ ΠΊΡΡΡΠΎΡΠ°.
Flickerplate — ΡΡΠΎ Π³ΠΈΠ±ΠΊΠΈΠΉ, ΡΠ΅Π½ΡΠΎΡΠ½ΡΠΉ ΠΈ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Β«ΠΏΡΠΎΠ»ΠΈΡΡΡΠ²Π°ΡΡΒ» ΠΊΠΎΠ½ΡΠ΅Π½Ρ.
jInvertScroll — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ Ρ ΡΡΡΠ΅ΠΊΡΠΎΠΌ ΠΏΠ°ΡΠ°Π»Π»Π°ΠΊΡΠ° ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ Π²Π½ΠΈΠ·.
Animsition — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² ΡΡΡΠ°Π½ΠΈΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS-Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ.
Brick Work — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ (15 ΠΠ) ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ
Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΡ
ΠΌΠ°ΠΊΠ΅ΡΠΎΠ².
ScrollMe — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ ΠΏΡΠΎΡΡΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ ΠΊ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ°ΠΌ.
jquery.smoothState.js — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΡΡΠ΅ΠΏΠ΅Π½Π½ΠΎ ΡΠ»ΡΡΡΠ°Π΅Ρ ΡΡΡΠ°Π½ΠΈΡΡ, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΠΏΠΎΡ
ΠΎΠ΄ΠΈΠ»ΠΈ Π½Π° ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΠΎΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅.
multiscroll.js — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ² Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²Π΅Π½Π½ΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΎΠΉ ΠΈ Π΄Π²ΡΠΌΡ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΡΠΌΠΈ ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°Π΅ΠΌΡΠΌΠΈ ΠΏΠ°Π½Π΅Π»ΡΠΌΠΈ.
jquery.matchHeight.js — Π±ΠΎΠ»Π΅Π΅ Π½Π°Π΄Π΅ΠΆΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ ΡΠ°Π²Π½ΠΎΠΉ Π²ΡΡΠΎΡΡ Π΄Π»Ρ jQuery.
ΠΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ ΠΈ ΠΌΠ΅Π½Ρ jQuery
Slidebars — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ (2 ΠΠ) ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ push-ΠΌΠ΅Π½Ρ Π² ΡΡΠΈΠ»Π΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ.
scotchPanels.js — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΌΠ΅Π½Ρ ΠΈ ΠΏΠ°Π½Π΅Π»ΠΈ Π²Π½Π΅ Ρ
ΠΎΠ»ΡΡΠ° jQuery.
ΠΠ»Π°Π³ΠΈΠ½Ρ jQuery Π΄Π»Ρ ΠΌΡΠ»ΡΡΠΈΠΌΠ΅Π΄ΠΈΠ° (ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈ Π²ΠΈΠ΄Π΅ΠΎ)
Focuspoint — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΎΠΉ ΠΎΠ±ΡΠ΅Π·ΠΊΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΡΡΠΎΠ±Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ Π±Π΅Π· Π²ΡΡΠ΅Π·Π°Π½ΠΈΡ ΠΎΠ±ΡΠ΅ΠΊΡΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ.
Fluidbox — ΡΡΠΎ ΡΠ΅ΠΏΠ»ΠΈΠΊΠ°ΡΠΈΡ ΠΌΠΎΠ΄ΡΠ»Ρ Π»Π°ΠΉΡΠ±ΠΎΠΊΡΠ° Medium.com Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠΌΠΈ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Π½ΡΠΌΠΈ ΡΠ»ΡΡΡΠ΅Π½ΠΈΡΠΌΠΈ.
GifPlayer — ΡΡΠΎ Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΠΌ ΡΠΏΡΠ°Π²Π»ΡΡΡ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΠ΅ΠΌ ΠΈ ΠΎΡΡΠ°Π½ΠΎΠ²ΠΊΠΎΠΉ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΡ
GIF-ΡΠ°ΠΉΠ»ΠΎΠ².
rowGrid.js — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π² ΡΠ΅ΡΠΊΠ΅ Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΎΠΉ Π±Π΅ΡΠΊΠΎΠ½Π΅ΡΠ½ΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ.
SVGMagic — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠ΅Π·Π΅ΡΠ²Π½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ SVG, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π°Ρ
ΠΎΠ΄ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ SVG Π½Π° Π²Π°ΡΠ΅ΠΌ ΡΠ°ΠΉΡΠ΅ ΠΈ ΡΠΎΠ·Π΄Π°Π΅Ρ Π²Π΅ΡΡΠΈΠΈ PNG, Π΅ΡΠ»ΠΈ Π±ΡΠ°ΡΠ·Π΅Ρ ΠΈΡ
Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ.
Vide — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΠΏΡΠΎΡΡΠΎΠ³ΠΎ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΡΠΎΠ½ΠΎΠ²ΠΎΠ³ΠΎ Π²ΠΈΠ΄Π΅ΠΎ ΠΊ Π²Π°ΡΠΈΠΌ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ°ΠΌ.
Dense.js — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠ΄ΠΎΠ±Π½ΠΎΠΉ ΡΠ°Π±ΠΎΡΡ Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ, Π³ΠΎΡΠΎΠ²ΡΠΌΠΈ ΠΊ ΡΠ΅ΡΡΠ°ΡΠΊΠ΅.
Covervid — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ Π²Π°ΠΌ Π·Π°ΡΡΠ°Π²ΠΈΡΡ Π²ΠΈΠ΄Π΅ΠΎ HTML5 Π²Π΅ΡΡΠΈ ΡΠ΅Π±Ρ ΠΊΠ°ΠΊ ΡΠΎΠ½ΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅.
jQuery-Cropbox — Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΎΠ±ΡΠ΅Π·ΠΊΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° ΠΌΠ΅ΡΡΠ΅ (ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈ ΠΏΠ°Π½ΠΎΡΠ°ΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅, Π² ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ Π²ΡΠ±ΠΎΡΠ° ΠΈ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π½ΠΈΡ).
Face Detection — ΡΡΠΎ ΠΌΠΎΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery / Zepto, ΠΊΠΎΡΠΎΡΡΠΉ ΠΎΠ±Π½Π°ΡΡΠΆΠΈΠ²Π°Π΅Ρ Π»ΠΈΡΠ° Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΡ
, Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Ρ
ΠΎΠ»ΡΡΠ°Ρ
.
BttrLazyLoading — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΡΠ΅ΠΌΡ Π²Π΅Π±-ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ Π·Π°Π³ΡΡΠΆΠ°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΠΎΠ»ΡΠΊΠΎ Π² ΠΎΠ±Π»Π°ΡΡΠΈ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ.
ΠΠ»Π°Π³ΠΈΠ½Ρ jQuery Slider, Carousel ΠΈ Gallery
Simple jQuery Slider — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ ΡΠ»Π°ΠΉΠ΄Π΅Ρ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ Π΄Π΅Π»Π°Π΅Ρ ΠΈΠΌΠ΅Π½Π½ΠΎ ΡΠΎ, ΡΡΠΎ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π΄Π΅Π»Π°ΡΡ ΡΠ»Π°ΠΉΠ΄Π΅Ρ: Β«ΡΠ»Π°ΠΉΠ΄Ρ ΡΠ»Π°ΠΉΠ΄ΠΎΠ²Β».
FSVS — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ ΠΏΠΎΠ»Π½ΠΎΡΠΊΡΠ°Π½Π½ΡΠΉ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ ΡΠ»Π°ΠΉΠ΄Π΅Ρ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΠΈΠΉ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Ρ CSS3 Ρ ΡΠ΅Π·Π΅ΡΠ²Π½ΡΠΌ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠΌ jQuery.
anoFlow — ΠΌΠ½ΠΎΠ³ΠΎΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΉ ΠΈ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π»Π°ΠΉΡΠ±ΠΎΠΊΡΠΎΠ² / Π³Π°Π»Π΅ΡΠ΅ΠΈ.
nanoGALLERY — ΡΡΠΎ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠΉ, ΡΠ΅Π½ΡΠΎΡΠ½ΡΠΉ ΠΈ ΠΏΡΠΎΡΡΠΎΠΉ Π² ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΠΏΠ»Π°Π³ΠΈΠ½ Π³Π°Π»Π΅ΡΠ΅ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ.
ΠΠ±ΠΎΡΠ½ΠΎΠ²Π°Π½ΠΎ.js — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠΎΠ·Π΄Π°Π΅Ρ Π²ΡΡΠΎΠ²Π½Π΅Π½Π½ΡΡ ΡΠ΅ΡΠΊΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ.
Shuffle Images — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΠΈ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠΈΠ²Π°ΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π² Π³Π°Π»Π΅ΡΠ΅Π΅, ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Ρ ΠΈΠ»ΠΈ Π²ΡΡΡΡΡ
ΠΈΠ²Π°Ρ ΠΊΡΡΡΠΎΡ.
Skippr — ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΠΎΠΉ ΠΈ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ Π΄Π»Ρ jQuery.
ΠΠ»Π°Π³ΠΈΠ½Ρ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ² jQuery
jQuery.fontFlex.js — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΡΡΠΈΡΡΠ°.
t.js — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΡ
ΡΡΡΠ΅ΠΊΡΠΎΠ², ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΡ
ΠΏΠ΅ΡΠ°ΡΠ½ΠΎΠΉ ΠΌΠ°ΡΠΈΠ½ΠΊΠ΅.
CurvedText — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²ΡΡΠΎΠ²Π½ΡΡΡ ΡΠ΅ΠΊΡΡ ΠΏΠΎ Π»ΡΠ±ΠΎΠΉ ΠΊΡΠΈΠ²ΠΎΠΉ.
Morphext — ΠΏΠ»Π°Π³ΠΈΠ½ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ jQuery Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Animate.css Π΄Π»Ρ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΡ
ΡΡΠ°Π·.
Splitchar — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΠΌ ΡΡΠΈΠ»ΠΈΠ·ΠΎΠ²Π°ΡΡ ΠΈ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΏΠ΅ΡΠ²ΡΡ, Π²ΡΠΎΡΡΡ ΠΈΠ»ΠΈ ΠΎΠ±Π΅ ΠΏΠΎΠ»ΠΎΠ²ΠΈΠ½Ρ ΠΏΠ΅ΡΡΠΎΠ½Π°ΠΆΠ°.
ΠΠ»Π°Π³ΠΈΠ½Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΠΎΡΠΌΡ jQuery
BootstrapValidator — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΡΠΎΡΠΌ Bootstrap.
Labelauty — ΠΊΡΠ°ΡΠΈΠ²ΡΠΉ ΠΈ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΡΠΈΠ΄Π°Π΅Ρ ΠΊΡΠ°ΡΠΎΡΡ ΡΠ»Π°ΠΆΠΊΠ°ΠΌ ΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»ΡΠΌ.
Guardian — ΡΡΠΎ Π³ΠΈΠ±ΠΊΠΈΠΉ ΠΈ Π»Π΅Π³ΠΊΠΎ ΡΠ°ΡΡΠΈΡΡΠ΅ΠΌΡΠΉ ΡΠ½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΡΠΎΡΠΌΡ.
fontIconPicker — ΡΡΠΎ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²ΠΊΠ»ΡΡΠ°ΡΡ ΠΏΡΠΎΡΡΠΎΠΉ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ Π²ΡΠ±ΠΎΡΠ° Π·Π½Π°ΡΠΊΠΎΠ² (Ρ ΠΏΠΎΠΈΡΠΊΠΎΠΌ ΠΈ ΡΠ°Π·Π±ΠΈΠ²ΠΊΠΎΠΉ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ) Π² Π»ΡΠ±ΡΡ ΡΠΎΡΠΌΡ.
HideSeek — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠΉ, Π½ΠΎ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΠΏΠΎΠΈΡΠΊΠ° Π² ΡΠ΅Π°Π»ΡΠ½ΠΎΠΌ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ.
ClockPicker — ΡΡΠΎ ΡΡΠ΅Π΄ΡΡΠ²ΠΎ Π²ΡΠ±ΠΎΡΠ° Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ Π² ΡΡΠΈΠ»Π΅ ΡΠ°ΡΠΎΠ² Π΄Π»Ρ jQuery ΠΈΠ»ΠΈ Bootstrap.
ΠΠ»Π°Π³ΠΈΠ½Ρ ΡΡΠΈΠ»ΠΈΡΡ jQuery
jQuery Confirm Mailto — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΆΠ΄Π΅Π½ΠΈΡ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΠΌΠΈ ΠΏΠ΅ΡΠ΅Π΄ ΠΎΡΠΊΡΡΡΠΈΠ΅ΠΌ Π»ΡΠ±ΠΎΠΉ ΡΡΡΠ»ΠΊΠΈ mailto:
ΡΠ΅ΡΠ΅Π· ΠΈΡ
ΠΏΠΎΡΡΠΎΠ²ΡΠΉ ΠΊΠ»ΠΈΠ΅Π½Ρ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ.
jNottery — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ Π·Π°ΠΌΠ΅ΡΠΊΠΈ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ.
Responsive Tabs — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ
Π²ΠΊΠ»Π°Π΄ΠΎΠΊ.
jquery. adaptive-backgrounds.js — ΡΡΠΎ ΠΎΡΠ»ΠΈΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΈΠ·Π²Π»Π΅ΠΊΠ°Π΅Ρ Π΄ΠΎΠΌΠΈΠ½ΠΈΡΡΡΡΠΈΠΉ ΡΠ²Π΅Ρ ΠΈΠ· ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° Π²Π°ΡΠ΅ΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΈ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅Ρ ΡΡΠΎΡ ΡΠ²Π΅Ρ ΠΊ ΠΈΡ
ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΈΠΌ.
β¦ ΠΈ Π½Π°ΠΊΠΎΠ½Π΅Ρβ¦
jQuery.planetarium — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠ΅ ΠΏΠ»Π°Π½Π΅ΡΡ ΠΈ ΡΡΡΠΎΠΈΡΡ ΠΡΠ΅Π»Π΅Π½Π½ΡΡ!
table-dragger — Π»Π΅Π³ΠΊΠΎ Π΄ΠΎΠ±Π°Π²Π»ΡΠΉΡΠ΅ ΡΠΎΡΡΠΈΡΠΎΠ²ΠΊΡ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΊ Π²Π°ΡΠ΅ΠΉ ΡΠ°Π±Π»ΠΈΡΠ΅ Π±Π΅Π· jQuery.
Selector — ΠΠΈΠΊΡΠΎ-Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° JavaScript, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΠ°Ρ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π°ΠΌΠ΅Π½Ρ jQuery, Π²Π΅ΡΠΈΡ ΠΏΠΎΡΡΠΈ 5 ΠΠ.
jquery.wanker.js — ΡΡΠΎ ΡΠΌΠΎΡΠΈΡΡΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ Π²ΡΡΠ²Π»ΡΠ΅Ρ ΠΏΡΠ±Π»ΠΈΡΠ½ΠΎΠ΅ ΠΎΠ±ΡΡΠ²Π»Π΅Π½ΠΈΠ΅, ΠΊΠΎΠ³Π΄Π° Π»ΡΠ΄ΠΈ Π½Π°ΡΠΈΠ½Π°ΡΡ ΡΡΠ΅Π·ΠΌΠ΅ΡΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΡΠ²ΠΎΠ΅Π³ΠΎ Π½Π°ΡΡΠΎΠ»ΡΠ½ΠΎΠ³ΠΎ Π±ΡΠ°ΡΠ·Π΅ΡΠ°, ΠΏΡΡΠ°ΡΡΡ ΡΠ²ΠΈΠ΄Π΅ΡΡ Π²Π°ΡΠΈ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠ΅ ΡΠΎΡΠΊΠΈ ΠΎΡΡΠ°Π½ΠΎΠ²Π°. ΠΠ°ΠΊ Π³ΠΎΠ²ΠΎΡΠΈΡΡΡ: Β«ΠΠ½ΡΠ΅ΡΠ½Π΅Ρ ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½ Π΄Π»Ρ ΡΡΠ΅Π½ΠΈΡ, Π° Π½Π΅ Π΄Π»Ρ ΡΠΆΠ°ΡΠΈΡΒ».
ΠΠΎΡΠΎΠ²ΠΎ!
ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ jQuery, ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ² jQuery, ΡΡΠ°ΡΠ΅ΠΉ jQuery, ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ² jQuery, Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΉ jQuery
Luckysheet — ΡΠ»Π΅ΠΊΡΡΠΎΠ½Π½Π°Ρ ΡΠ°Π±Π»ΠΈΡΠ° Excel ΠΊΠ°ΠΊ ΠΎΠ½Π»Π°ΠΉΠ½ Ρ ΠΌΠΎΡΠ½ΡΠΌΠΈ ΡΡΠ½ΠΊΡΠΈΡΠΌΠΈ
21 ΡΠ΅Π²ΡΠ°Π»Ρ 2021 Π³. 8 Π‘ΡΠΎΠ»ΡLuckysheet — ΡΡΠΎ ΡΠ»Π΅ΠΊΡΡΠΎΠ½Π½Π°Ρ ΡΠ°Π±Π»ΠΈΡΠ°, ΠΏΠΎΠ΄ΠΎΠ±Π½Π°Ρ Excel, ΠΌΠΎΡΠ½Π°Ρ, ΠΏΡΠΎΡΡΠ°Ρ Π² Π½Π°ΡΡΡΠΎΠΉΠΊΠ΅ ΠΈ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΠΎΡΠΊΡΡΡΠ°Ρ.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
Embla Carousel — ΠΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° ΠΆΠΈΠ΄ΠΊΠΎΠΉ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ Ρ ΡΠΎΡΠ½ΠΎΡΡΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ
embla-carousel — ΡΡΠΎ ΠΏΡΠΎΡΡΠ°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° ΠΊΠ°ΡΡΡΠ΅Π»Π΅ΠΉ Ρ ΠΎΡΠ»ΠΈΡΠ½ΡΠΌ ΠΏΠ»Π°Π²Π½ΡΠΌ Π΄Π²ΠΈΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΈ ΠΏΠΎΡΡΡΡΠ°ΡΡΠ΅ΠΉ ΡΠΎΡΠ½ΠΎΡΡΡΡ ΡΠΌΠ°Ρ ΠΈΠ²Π°Π½ΠΈΡ. ΠΡΠΎ Π½Π΅Π·Π°Π²ΠΈΡΠΈΠΌΡΠΉ ΠΎΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ, ΡΠ²ΠΎΠ±ΠΎΠ΄Π½ΡΠΉ ΠΎΡ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ ΠΈ 100% ΠΎΡΠΊΡΡΡΡΠΉ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΠΊΠΎΠ΄.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
ΠΡΠ»ΠΈΡΠ½ΡΠΉ JavaScript — ΠΠΎΠ»Π»Π΅ΠΊΡΠΈΡ ΠΏΠΎΡΡΡΡΠ°ΡΡΠΈΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ JavaScript
14 ΡΠ΅Π²ΡΠ°Π»Ρ 2021 Π³. 188
Π‘ΠΏΠΈΡΠΎΠΊ Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ ΠΈ ΡΠ΅ΡΡΡΡΠΎΠ² JavaScript Π΄Π»Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ°.
- ΠΠ΅Π½Π΅Π΄ΠΆΠ΅ΡΡ ΠΏΠ°ΠΊΠ΅ΡΠΎΠ²
- Π£ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°ΠΌΠΈ
- ΠΠ°Π³ΡΡΠ·ΡΠΈΠΊΠΈ
- Π£ΠΏΠ°ΠΊΠΎΠ²ΡΠΈΠΊΠΈ
- ΠΡΠΎΠ²Π΅ΡΠΊΠ° ΡΠΈΠΏΠΎΠ²
- Π‘ΡΠ΅Π΄Ρ ΡΠ΅ΡΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
GraphQL.
js — ΡΠΏΡΠ°Π²ΠΎΡΠ½Π°Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ JavaScript Π΄Π»Ρ GraphQL22 ΡΠ½Π²Π°ΡΡ 2021 268
GraphQL.js — ΡΡΠΎ ΡΡΠ°Π»ΠΎΠ½Π½Π°Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ JavaScript Π΄Π»Ρ GraphQL, ΡΠ·ΡΠΊΠ° Π·Π°ΠΏΡΠΎΡΠΎΠ² Π΄Π»Ρ API, ΡΠΎΠ·Π΄Π°Π½Π½ΠΎΠ³ΠΎ Facebook.
GraphQL ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΏΠΎΠ»Π½ΠΎΠ΅ ΠΈ ΠΏΠΎΠ½ΡΡΠ½ΠΎΠ΅ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ Π΄Π°Π½Π½ΡΡ Π² Π²Π°ΡΠ΅ΠΌ API, Π΄Π°Π΅Ρ ΠΊΠ»ΠΈΠ΅Π½ΡΠ°ΠΌ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ Π·Π°ΠΏΡΠ°ΡΠΈΠ²Π°ΡΡ ΠΈΠΌΠ΅Π½Π½ΠΎ ΡΠΎ, ΡΡΠΎ ΠΈΠΌ Π½ΡΠΆΠ½ΠΎ, ΠΈ Π½Π΅ Π±ΠΎΠ»Π΅Π΅ ΡΠΎΠ³ΠΎ, ΡΠΏΡΠΎΡΠ°Π΅Ρ ΡΠ°Π·Π²ΠΈΡΠΈΠ΅ API Ρ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ ΠΈ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΌΠΎΡΠ½ΡΠ΅ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΡ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ°.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
xgplayer — Π²ΠΈΠ΄Π΅ΠΎΠΏΠ»Π΅Π΅Ρ ΠΈ Π°ΡΠ΄ΠΈΠΎΠΏΠ»Π΅Π΅Ρ HTML5
xgplayer — ΡΡΠΎ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° Π²Π΅Π±-Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Π°ΡΠ΄ΠΈΠΎΠΏΠ»Π΅Π΅ΡΠ°, ΡΠΎΠ·Π΄Π°Π½Π½Π°Ρ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ ΡΡΠ΅ΠΌΠ½ΡΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ°.xgplayer ΠΎΡΠ»ΠΈΡΠ°Π΅ΡΡΡ ΡΠΌΠ΅Π»ΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡΡ: ΠΎΠ½ ΠΈΠ·Π±Π°Π²Π»ΡΠ΅ΡΡΡ ΠΎΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ Π²ΠΈΠ΄Π΅ΠΎ, Π±ΡΡΠ΅ΡΠΈΠ·Π°ΡΠΈΠΈ ΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΈ ΡΠΎΡΠΌΠ°ΡΠ° Π΄Π»Ρ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ Π²ΠΈΠ΄Π΅ΠΎ.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
Π£ΡΠΎΠΊΠΈ Π²Π΅Π±-ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ Π΄Π»Ρ Π½Π°ΡΠΈΠ½Π°ΡΡΠΈΡ ΠΎΡ Microsoft
03 ΡΠ½Π²Π°ΡΡ 2021 327
12-Π½Π΅Π΄Π΅Π»ΡΠ½Π°Ρ ΡΡΠ΅Π±Π½Π°Ρ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠ° ΠΈΠ· 24 ΡΡΠΎΠΊΠΎΠ² ΠΏΠΎ ΠΎΡΠ½ΠΎΠ²Π°ΠΌ JavaScript, CSS ΠΈ HTML ΠΎΡ Azure Cloud Advocates Π² Microsoft .
ΠΠ°ΠΆΠ΄ΡΠΉ ΡΡΠΎΠΊ Π²ΠΊΠ»ΡΡΠ°Π΅Ρ Π² ΡΠ΅Π±Ρ:
- Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΉ ΡΡΠΊΠΈΠ·
- Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΉ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ Π²ΠΈΠ΄Π΅ΠΎΡΠΎΠ»ΠΈΠΊ
- ΡΠ΅ΡΡ ΠΏΠ΅ΡΠ΅Π΄ ΡΡΠΎΠΊΠΎΠΌ
- ΠΏΠΈΡΡΠΌΠ΅Π½Π½ΡΠΉ ΡΡΠΎΠΊ
- Π΄Π»Ρ ΡΡΠΎΠΊΠΎΠ² Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ ΠΏΡΠΎΠ΅ΠΊΡΠ°, ΠΏΠΎΡΠ°Π³ΠΎΠ²ΡΠ΅ ΠΈΠ½ΡΡΡΡΠΊΡΠΈΠΈ ΠΏΠΎ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΏΡΠΎΠ΅ΠΊΡΠ°
- ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ Π·Π½Π°Π½ΠΈΠΉ
- Π²ΡΠ·ΠΎΠ²
- Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΡΡΠ΅Π½ΠΈΠ΅
- Π·Π°Π΄Π°Π½ΠΈΠ΅
- Π²ΠΈΠΊΡΠΎΡΠΈΠ½Π° ΠΏΠΎΡΠ»Π΅ ΡΡΠΎΠΊΠ°
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
Ramda — ΠΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠ°Ρ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½Π°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° JavaScript
29 Π½ΠΎΡΠ±ΡΡ, 2020358
Ramda — ΡΡΠΎ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° JavaScript, ΠΊΠΎΡΠΎΡΠ°Ρ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ ΠΏΠΈΡΠ°ΡΡ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΉ, ΠΊΡΠ°ΡΠΊΠΈΠΉ ΠΈ ΠΏΠΎΠ²ΡΠΎΡΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠΉ ΠΊΠΎΠ΄.Ramda ΡΠΎΠΊΡΡΠΈΡΡΠ΅ΡΡΡ Π½Π° Π½Π΅ΠΈΠ·ΠΌΠ΅Π½ΡΠ΅ΠΌΠΎΡΡΠΈ ΠΈ ΡΡΠ½ΠΊΡΠΈΡΡ Π±Π΅Π· ΠΏΠΎΠ±ΠΎΡΠ½ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ².
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
whatsapp-web.js — ΠΠ»ΠΈΠ΅Π½ΡΡΠΊΠ°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° WhatsApp Π΄Π»Ρ NodeJS
17 Π½ΠΎΡΠ±ΡΡ, 2020 993
whatsapp-web.js — ΡΡΠΎ ΠΊΠ»ΠΈΠ΅Π½ΡΡΠΊΠ°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° WhatsApp Π΄Π»Ρ NodeJS, ΠΊΠΎΡΠΎΡΠ°Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ ΡΠ΅ΡΠ΅Π· ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π²Π΅Π±-Π±ΡΠ°ΡΠ·Π΅ΡΠ° WhatsApp. ΠΠ½ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Puppeteer Π΄Π»Ρ Π·Π°ΠΏΡΡΠΊΠ° ΡΠ΅Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° WhatsApp Web, ΡΡΠΎΠ±Ρ ΠΈΠ·Π±Π΅ΠΆΠ°ΡΡ Π±Π»ΠΎΠΊΠΈΡΠΎΠ²ΠΊΠΈ.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
VvvebJs — ΠΠΎΠ½ΡΡΡΡΠΊΡΠΎΡ Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ² Ρ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΈ jQuery ΠΈ Bootstrap
VvvebJs — ΡΡΠΎ javascript-Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° Π΄Π»Ρ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π½ΠΈΡ Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ², ΡΠΎΠ·Π΄Π°Π½Π½Π°Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ jQuery ΠΈ Bootstrap 4.
Π€ΡΠ½ΠΊΡΠΈΠΈ
- ΠΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ ΠΈ Π±Π»ΠΎΠΊΠΈ / ΡΡΠ°Π³ΠΌΠ΅Π½ΡΡ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°ΡΡΡΡ.
- ΠΠΏΠ΅ΡΠ°ΡΠΈΠΈ ΠΎΡΠΌΠ΅Π½Ρ / Π²ΠΎΠ·Π²ΡΠ°ΡΠ°.
- ΠΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ Ρ ΠΎΠ΄Π½ΠΎΠΉ ΠΈΠ»ΠΈ Π΄Π²ΡΠΌΡ ΠΏΠ°Π½Π΅Π»ΡΠΌΠΈ.
- Π€Π°ΠΉΠ»ΠΎΠ²ΡΠΉ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ ΠΏΠΎ ΠΈΠ΅ΡΠ°ΡΡ ΠΈΠΈ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ².
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
Cuttr.js — ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΡΡΠ΅ΡΠ΅Π½ΠΈΡ ΠΌΠ½ΠΎΠ³ΠΎΡΡΡΠΎΡΠ½ΠΎΠ³ΠΎ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ
Cuttr.js — ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ javascript / jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΡΡΠ΅ΠΊΠ°Π΅Ρ ΠΌΠ½ΠΎΠ³ΠΎΡΡΡΠΎΡΠ½ΡΠΉ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΠΌΠ΅ΡΠΎΠ΄ΠΎΠ² ΡΡΠ΅ΡΠ΅Π½ΠΈΡ ΠΈ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΠΎΠ³ΠΎ ΠΌΠ½ΠΎΠ³ΠΎΡΠΎΡΠΈΡ.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
JSDoc — ΠΠ΅Π½Π΅ΡΠ°ΡΠΎΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ API Π΄Π»Ρ JavaScript
23 ΡΠ΅Π½ΡΡΠ±ΡΡ, 2020 567
JSDoc — Π³Π΅Π½Π΅ΡΠ°ΡΠΎΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ API Π΄Π»Ρ JavaScript. ΠΡ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΡΠ΅ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ ΠΊ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ ΠΏΡΡΠΌΠΎ Π² ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΠΊΠΎΠ΄, ΡΡΠ΄ΠΎΠΌ Ρ ΡΠ°ΠΌΠΈΠΌ ΠΊΠΎΠ΄ΠΎΠΌ. ΠΠ½ΡΡΡΡΠΌΠ΅Π½Ρ JSDoc ΠΏΡΠΎΡΠΊΠ°Π½ΠΈΡΡΠ΅Ρ Π²Π°Ρ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΠΊΠΎΠ΄ ΠΈ ΡΠΎΠ·Π΄Π°ΡΡ Π΄Π»Ρ Π²Π°Ρ Π²Π΅Π±-ΡΠ°ΠΉΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ HTML.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
ΞΌPlot — ΠΊΡΠΎΡΠ΅ΡΠ½ΡΠΉ ΠΈ Π±ΡΡΡΡΡΠΉ Π³ΡΠ°ΡΠΈΠΊ Π΄Π»Ρ Π²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ ΡΡΠ΄ΠΎΠ², Π»ΠΈΠ½ΠΈΠΉ, ΠΎΠ±Π»Π°ΡΡΠ΅ΠΉ, ΡΡΠΎΠ»Π±ΡΠΎΠ²
ΞΌPlot — ΡΡΠΎ Π»Π΅Π³ΠΊΠ°Ρ, Π±ΡΡΡΡΠ°Ρ, ΡΠΊΠΎΠ½ΠΎΠΌΠΈΡΠ½Π°Ρ Π΄Π»Ρ ΠΏΠ°ΠΌΡΡΠΈ Π΄Π²ΡΡ ΠΌΠ΅ΡΠ½Π°Ρ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΠ° Canvas Π΄Π»Ρ ΠΏΠΎΡΡΡΠΎΠ΅Π½ΠΈΡ Π²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ ΡΡΠ΄ΠΎΠ², Π»ΠΈΠ½ΠΈΠΉ, ΠΎΠ±Π»Π°ΡΡΠ΅ΠΉ, ΡΡΠΎΠ»Π±ΡΠΎΠ² ΠΈ ΡΡΠΎΠ»Π±ΡΠΎΠ².
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
Fastify — ΠΡΡΡΡΠ°Ρ Π²Π΅Π±-ΠΏΠ»Π°ΡΡΠΎΡΠΌΠ° Ρ Π½ΠΈΠ·ΠΊΠΈΠΌΠΈ ΠΈΠ·Π΄Π΅ΡΠΆΠΊΠ°ΠΌΠΈ Π΄Π»Ρ Node.js
17 Π°Π²Π³ΡΡΡΠ°, 2020 424
Fastify — ΡΡΠΎ Π²Π΅Π±-ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊ, ΠΎΡΠΈΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ Π½Π° ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠ΅Π½ΠΈΠ΅ Π½Π°ΠΈΠ»ΡΡΡΠ΅Π³ΠΎ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ°ΠΌΠΈ Ρ Π½Π°ΠΈΠΌΠ΅Π½ΡΡΠΈΠΌΠΈ Π½Π°ΠΊΠ»Π°Π΄Π½ΡΠΌΠΈ ΡΠ°ΡΡ ΠΎΠ΄Π°ΠΌΠΈ ΠΈ ΠΌΠΎΡΠ½ΠΎΠΉ Π°ΡΡ ΠΈΡΠ΅ΠΊΡΡΡΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ².
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
Bootstrap Icons — ΠΎΡΠΈΡΠΈΠ°Π»ΡΠ½Π°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° SVG-ΠΈΠΊΠΎΠ½ΠΎΠΊ Ρ ΠΎΡΠΊΡΡΡΡΠΌ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΌ ΠΊΠΎΠ΄ΠΎΠΌ Π΄Π»Ρ Bootstrap
03 Π°Π²Π³ΡΡΡΠ° 2020 571 ΠΡΡΡΡΡΠ°ΠΏBootstrap Icons — ΡΡΠΎ ΠΎΡΠΈΡΠΈΠ°Π»ΡΠ½Π°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° ΠΈΠΊΠΎΠ½ΠΎΠΊ Ρ ΠΎΡΠΊΡΡΡΡΠΌ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΌ ΠΊΠΎΠ΄ΠΎΠΌ, ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π½Π½Π°Ρ ΠΈ ΡΠΎΠ·Π΄Π°Π½Π½Π°Ρ Π΄Π»Ρ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² Bootstrap.
ΠΠΊΠΎΠ½ΠΊΠΈ Bootstrap — ΡΡΠΎ SVG, ΠΏΠΎΡΡΠΎΠΌΡ ΠΎΠ½ΠΈ Π±ΡΡΡΡΠΎ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΡΡΡΡΡ ΠΈ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ Π»Π΅Π³ΠΊΠΎ ΡΡΠΈΠ»ΠΈΠ·ΠΎΠ²Π°Π½Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS. ΠΠ½ ΡΠΎΠ·Π΄Π°Π½ Π΄Π»Ρ Bootstrap, Π½ΠΎ Π±ΡΠ΄Π΅Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ Π»ΡΠ±ΡΠΌ ΠΏΡΠΎΠ΅ΠΊΡΠΎΠΌ.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
Scroll Loop Menu — ΠΠ΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ Π±Π΅ΡΠΊΠΎΠ½Π΅ΡΠ½ΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΎΠΉ
ΠΠ΅Π½Ρ ΡΠΈΠΊΠ»Π° ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ — ΡΡΠΎ ΠΏΡΠΎΡΡΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ Π±Π΅ΡΠΊΠΎΠ½Π΅ΡΠ½ΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΎΠΉ, ΠΎΡΠ½ΠΎΠ²Π°Π½Π½ΠΎΠ΅ Π½Π° ΠΈΠ»Π»ΡΠ·ΠΈΠΈ ΡΠΈΠΊΠ»ΠΈΡΠ΅ΡΠΊΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ ΠΊΠ»ΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ².
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Β»
24 ΠΊΠ»Π°ΡΡΠ½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½Π° ΠΈ ΡΡΡΠ΅ΠΊΡΠΎΠ² jQuery Π΄Π»Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ²
ΠΠΎΠ»Π³ΠΎΠΆΠ΄Π°Π½Π½Π°Ρ Π²Π΅ΡΡΠΈΡ 3 jQuery Π½Π°ΠΊΠΎΠ½Π΅Ρ-ΡΠΎ ΠΏΠΎΡΡΡΠΏΠΈΠ»Π° Π½Π° ΠΏΡΠΈΠ»Π°Π²ΠΊΠΈ, ΠΈ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΠΏΠΎ Π²ΡΠ΅ΠΌΡ ΠΌΠΈΡΡ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π½Π°Π΄ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π½ΠΎΠ²ΡΡ ΡΡΠ½ΠΊΡΠΈΠΉ ΠΈ ΠΏΠ΅ΡΠ΅Π½ΠΎΡΠΎΠΌ ΡΡΡΠ΅ΡΡΠ²ΡΡΡΠΈΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ Π² Π½ΠΎΠ²ΡΡ ΡΠΈΡΡΠ΅ΠΌΡ ΠΊΠΎΠ΄Π°.Π Π°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Π½Π΅Π΄ΡΡΠ»ΠΈ jQuery Π΄Π»Ρ ΡΡΠ°ΡΡΡ Π²Π΅ΡΡΠΈΠΉ IE, Π±ΡΠ΄ΡΡ ΡΠ°Π·ΠΎΡΠ°ΡΠΎΠ²Π°Π½Ρ ΠΎΡΡΡΡΡΡΠ²ΠΈΠ΅ΠΌ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΈ ΡΡΠ°ΡΡΡ Π²Π΅ΡΡΠΈΠΉ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ², Π½ΠΎ Π΅ΡΡΡ Π΅ΡΠ΅ ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ΅Π³ΠΎ ΠΎΠΆΠΈΠ΄Π°ΡΡ. jQuery Π·Π°Π»ΠΎΠΆΠΈΠ» ΠΌΠΎΠ½ΡΠΌΠ΅Π½ΡΠ°Π»ΡΠ½ΡΡ ΠΎΡΠ½ΠΎΠ²Ρ, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΠ΅ΠΏΠ΅ΡΡ ΡΠΏΡΠ°Π²Π»ΡΠ΅Ρ Π±ΠΎΠ»ΡΡΠ΅ΠΉ ΡΠ°ΡΡΡΡ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΠΈ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΎΠΏΡΡΠ°, ΠΊΠΎΡΠΎΡΡΠΉ ΠΌΡ ΠΈΡΠΏΡΡΡΠ²Π°Π΅ΠΌ Π² ΠΠ½ΡΠ΅ΡΠ½Π΅ΡΠ΅. Π‘ΠΎΡΠ΅ΡΠ°Π½ΠΈΠ΅ ΠΈΠΌΠ΅ΡΡΠΈΡ ΡΡ Π·Π½Π°Π½ΠΈΠΉ jQuery Ρ ΡΠ°ΠΊΠΈΠΌΠΈ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠ°ΠΌΠΈ, ΠΊΠ°ΠΊ React ΠΈ Angular, ΠΌΠΎΠΆΠ΅Ρ ΠΏΡΠΈΠ²Π΅ΡΡΠΈ ΠΊ ΡΡΠ΅Π·Π²ΡΡΠ°ΠΉΠ½ΠΎ ΡΠ°Π·Π½ΠΎΠΎΠ±ΡΠ°Π·Π½ΡΠΌ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ°ΠΌ.
ΠΠ°ΡΠ°Π±ΠΎΡΠ½Π°Ρ ΠΏΠ»Π°ΡΠ°jQuery Π½Π΅ ΡΠ°ΠΊ ΡΠΆ ΠΈ ΠΏΠ»ΠΎΡ Π°, ΠΏΠΎ ΠΊΡΠ°ΠΉΠ½Π΅ΠΉ ΠΌΠ΅ΡΠ΅, Π½Π΅ Π² ΡΠ΅Ρ ΡΡΠ°ΡΠ°Ρ , Π³Π΄Π΅ ΡΡΠ΅Π΄Π½ΠΈΠΉ Π΄ΠΎΡ ΠΎΠ΄ ΠΎΠΏΡΡΠ½ΠΎΠ³ΠΎ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ° jQuery Π²ΡΡΠΎΡ Π΄ΠΎ Π±ΠΎΠ»Π΅Π΅ ΡΠ΅ΠΌ 90 000 Π΄ΠΎΠ»Π»Π°ΡΠΎΠ².ΠΠΎΠ»ΡΡΠΈΡΡ jQuery ΠΌΠΎΠΆΠ½ΠΎ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΠΎ, Π° ΡΠ°ΠΊΠΈΠ΅ ΠΏΠ»Π°ΡΡΠΎΡΠΌΡ, ΠΊΠ°ΠΊ Khan Academy ΠΈ Codecademy, ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΡΡ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΎΠ±ΡΡΠ°ΡΡΠΈΠ΅ Π²Π΅Π±-ΠΊΡΡΡΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠΌΠΎΠ³ΡΡ Π²Π°ΠΌ Π½Π°ΡΠ°ΡΡ ΡΠ°Π±ΠΎΡΡ. ΠΠ° GitHub ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½Ρ Π΄Π΅ΡΡΡΠΊΠΈ ΡΡΡΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ jQuery, Π²ΡΠ΅ ΠΈΠ· ΠΊΠΎΡΠΎΡΡΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΡΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π΄Π»Ρ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ² ΠΊΠΎΠ΄Π°, ΡΡΠΎ Π΅ΡΠ΅ Π±ΠΎΠ»ΡΡΠ΅ ΡΠΊΡΠ΅ΠΏΠΈΡ ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΡΡΠΎΠΉ ΡΠ΅Π½ΠΎΠΌΠ΅Π½Π°Π»ΡΠ½ΠΎΠΉ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ JavaScript.
Π‘ΡΠ΅Π΄Π½ΠΈΠΉ Π²Π΅Π±-ΠΌΠ°ΡΡΠ΅Ρ ΠΈ Π²Π΅Π±-ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊ, ΠΎΠ΄Π½Π°ΠΊΠΎ, ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°ΡΡ jQuery ΠΊΠ°ΠΊ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΠ°ΡΡΠΈΡΠΈΡΡ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ Π²Π΅Π±-ΡΠ°ΠΉΡΠ° ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ² ΠΈ ΡΠΊΡΠΈΠΏΡΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ»ΡΡΡΠ°ΡΡ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΡΠ°ΡΠ΅Π»ΡΠ½ΠΎ Π°Π΄Π°ΠΏΡΠΈΡΡΡΡ ΠΊ Π΅Π³ΠΎ ΠΎΡΠ½ΠΎΠ²Π½ΡΠΌ ΠΎΡΠ½ΠΎΠ²Π½ΡΠΌ ΡΡΠ΅Π±ΠΎΠ²Π°Π½ΠΈΡΠΌ.ΠΠΎΡ ΠΏΠΎΡΠ΅ΠΌΡ ΠΌΡ ΡΠ΅ΡΠΈΠ»ΠΈ ΡΠΎΠ±ΡΠ°ΡΡΡΡ Π²ΠΎΠΊΡΡΠ³ Π½Π΅ΠΊΠΎΡΠΎΡΡΡ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΊΡΡΡΡΡ ΠΈ, Π±Π΅Π·ΡΡΠ»ΠΎΠ²Π½ΠΎ, ΡΠ°ΠΌΡΡ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² jQuery. ΠΡΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΈ ΡΡΡΠ΅ΠΊΡΡ Π²Π°ΡΡΠΈΡΡΡΡΡΡ ΠΎΡ ΠΎΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΠΈ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΠΈ Π΄ΠΎ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΏΡΡΠ° Π°Π΄Π°ΠΏΡΠ°ΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π²Π°ΡΠΈΠΌ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΠΌ Π»ΡΡΡΠ΅ ΠΏΠΎΠ½ΡΡΡ Π²Π°Ρ ΠΏΡΠΎΠ΄ΡΠΊΡ Ρ ΡΠΎΠ³ΠΎ ΠΌΠΎΠΌΠ΅Π½ΡΠ°, ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ ΡΠ΅ΡΠ°Ρ Π·Π°ΡΠ΅Π³ΠΈΡΡΡΠΈΡΠΎΠ²Π°ΡΡΡΡ. ΠΡΠΎ ΡΡΠ½Π΄Π°ΠΌΠ΅Π½ΡΠ°Π»ΡΠ½ΡΠ΅ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ jQuery, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡ Π² ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΠΈΡΡΠ°ΡΠΈΡΡ , ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π½Π΅ ΠΏΡΠΈΠ»Π°Π³Π°Ρ ΡΡΠΈΠ»ΠΈΠΉ Π΄Π»Ρ ΠΈΡ Π·Π°ΠΏΡΡΠΊΠ° ΠΈ ΡΠ°Π±ΠΎΡΡ.
Cropper
Cropper Π²ΠΏΠΎΠ»Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΡΠ°ΠΌΡΠΌ ΠΎΠ±ΡΠΈΡΠ½ΡΠΌ Π²Π΅Π±-ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠΌ Π΄Π»Ρ ΠΎΠ±ΡΠ΅Π·ΠΊΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΠΊΠΎΡΠΎΡΡΠΉ Π²Ρ ΡΠΎΠ»ΡΠΊΠΎ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΠΉΡΠΈ.ΠΠ½ ΠΈΠΌΠ΅Π΅Ρ Π±ΠΎΠ»Π΅Π΅ 70+ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΠΏΠΎΡΠΎΠ±ΠΎΠ² ΠΎΠ±ΡΠ΅Π·ΠΊΠΈ, ΠΌΠ°Π½ΠΈΠΏΡΠ»ΠΈΡΠΎΠ²Π°Π½ΠΈΡ, ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΡ ΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ Π²Π°ΡΠΈΡ Π΄Π°Π½Π½ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΠ½ ΡΠ΄ΠΎΠ±Π΅Π½ Π΄Π»Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ² Ρ ΡΠ΅Π½ΡΠΎΡΠ½ΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠ΅ΠΉ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ²Π΅Π»ΠΈΡΠΈΠ²Π°ΡΡ / Π²ΡΠ°ΡΠ°ΡΡ / ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°ΡΡ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΈ ΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅ Π²Π΅Π±-Π±ΡΠ°ΡΠ·Π΅ΡΡ. ΠΡΠ΅Π΄ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°ΡΡ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΈ Π΄ΠΎ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΠΎΠΎΡΠ½ΠΎΡΠ΅Π½ΠΈΠΉ ΡΡΠΎΡΠΎΠ½ ΠΎΠ΄Π½ΠΈΠΌ ΡΠ΅Π»ΡΠΊΠΎΠΌ ΠΌΡΡΠΈ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΡΠ΅ΠΆΠΈΠΌΡ ΠΏΡΠΎΡΠΌΠΎΡΡΠ°, ΡΡΠΎΠ±Ρ ΠΏΠΎΠΈΠ³ΡΠ°ΡΡ Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΠΌΠΈ ΠΈ ΠΌΠ°ΡΡΡΠ°Π±ΠΎΠΌ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΈ, ΠΈ Π΅ΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠΏΠΎΡΠΎΠ±ΠΎΠ² ΠΏΠΎΠ»ΡΡΠΈΡΡ ΠΌΠ°ΡΡΠΈΠ² Π΄Π°Π½Π½ΡΡ ΠΎ Π²Π°ΡΠ΅ΠΉ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΈ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ , Π΄Π°Π½Π½ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, Ρ ΠΎΠ»ΡΡΠ° ΠΈ ΡΠ°ΠΌΠΊΠΈ ΠΊΠ°Π΄ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΠΎΠ΄Π½ΠΈΠΌ Π½Π°ΠΆΠ°ΡΠΈΠ΅ΠΌ ΠΊΠ½ΠΎΠΏΠΊΠΈ.
ΠΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ Π½Π°ΡΡΠΎΠ»ΡΠΊΠΎ Π΄ΡΡΠΆΠ΅Π»ΡΠ±Π΅Π½, ΡΡΠΎ Ρ Π²Π°Ρ Π½Π΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ½Π΅Ρ ΡΡΡΠ΄Π½ΠΎΡΡΠ΅ΠΉ ΠΏΡΠΈ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ΅ Π΅Π³ΠΎ Π½Π° ΠΎΠ΄Π½Ρ ΠΈΠ· ΡΠ²ΠΎΠΈΡ ΠΏΠ»Π°ΡΡΠΎΡΠΌ Π΄Π»Ρ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΡΠ΅ΠΊΡΠΈΠ²Π½ΠΎ ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡΠΎΠ²Π°ΡΡ Cropper Ρ Π»ΡΠ±ΡΠΌ ΠΈΠ· ΠΈΠ·Π²Π΅ΡΡΠ½ΡΡ ΡΠΊΡΠΈΠΏΡΠΎΠ² Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΠ°ΠΉΠ»ΠΎΠ² jQuery ΠΈ ΡΠΎΠ·Π΄Π°ΡΡ Π°ΡΡΠ΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ Π΄Π»Ρ Π²Π°ΡΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ° ΠΎΠ±ΠΌΠ΅Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ.
Π‘ΠΊΠ°ΡΠ°ΡΡClusterize.js
ΠΠ΅Π½ΠΈΡ ΠΡΠΊΠΎΠ² Π²Π½Π΅Ρ Π±ΠΎΠ»ΡΡΠΎΠΉ Π²ΠΊΠ»Π°Π΄ Π² ΡΠ°Π·Π²ΠΈΡΠΈΠ΅ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ½ΠΎΠ³ΠΎ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π° (CSS ΠΈ JavaScript), ΠΌΠ½ΠΎΠ³ΠΈΠ΅ Π΅Π³ΠΎ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ Ρ ΠΎΡΠΊΡΡΡΡΠΌ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΌ ΠΊΠΎΠ΄ΠΎΠΌ Π²ΠΎΡΡ ΠΈΡΠ°ΡΡΡΡ Π΄Π΅ΡΡΡΠΊΠ°ΠΌΠΈ ΡΡΡΡΡ Π»ΡΠ΄Π΅ΠΉ ΠΏΠΎ Π²ΡΠ΅ΠΌΡ ΠΌΠΈΡΡ, Π° Clusterize — ΠΎΠ΄Π½Π° ΠΈΠ· Π½ΠΈΡ . Π΅Π³ΠΎ ΡΠ°ΠΌΡΠ΅ ΠΈΠ·Π²Π΅ΡΡΠ½ΡΠ΅ Π·Π°Π΄Π°ΡΠΊΠΈ.Clusterize, ΡΠΎΠ·Π΄Π°Π½Π½ΡΠΉ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π²Π°Π½ΠΈΠ»ΡΠ½ΠΎΠ³ΠΎ JavaScript, ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ Π³ΠΈΠ±ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π±ΠΎΠ»ΡΡΠΎΠ³ΠΎ Π½Π°Π±ΠΎΡΠ° Π΄Π°Π½Π½ΡΡ , ΠΈΠ·Π²Π΅ΡΡΠ½ΠΎΠ³ΠΎ ΠΊΠ°ΠΊ Π±ΠΎΠ»ΡΡΠΈΠ΅ Π΄Π°Π½Π½ΡΠ΅, ΡΠ΅ΡΠ΅Π· ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ Ρ ΠΏΠ»Π°Π²Π½ΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΎΠΉ ΡΠ°Π±Π»ΠΈΡΡ, Π½ΠΎ Clusterize Π²ΡΠ΄Π΅Π»ΡΠ΅ΡΡΡ — ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΎΠ½ ΠΌΠΎΠΆΠ΅Ρ ΠΏΡΠΈΠ½ΠΈΠΌΠ°ΡΡ Π΄Π°Π½Π½ΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠΌ Π΄ΠΎ 500000 ΡΡΡΠΎΠΊ ΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΠΈΡ Π² Π΅Π΄ΠΈΠ½Π°Ρ ΡΠ°Π±Π»ΠΈΡΠ°, Π±Π΅Π· ΠΊΠ°ΠΊΠΈΡ -Π»ΠΈΠ±ΠΎ ΠΏΡΠΎΠ±Π»Π΅ΠΌ Ρ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΡΡ, Π½Π° ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΎΠ½Π½ΡΠΉ Π²Π΅Π±-ΡΠ°ΠΉΡ ΠΏΠΎΡΡΡΠΎΠ΅Π½ Ρ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΠΏΡΠΎΡΠΌΠΎΡΡΠΎΠΌ Π² Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ°Π³ΠΎΠ², ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π·Π°Π³ΡΡΠ·ΠΈΡΡ ΡΡΡΠ΅ΡΡΠ²ΡΡΡΠΈΠ΅ Π΄Π°Π½Π½ΡΠ΅ ΠΈ ΡΠ²ΠΈΠ΄Π΅ΡΡ, ΠΊΠ°ΠΊ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠ΄Π°Π΅ΡΡΡ Π»Π΅Π³ΠΊΠΎ ΠΈΡ ΡΠΎΡΡΠΈΡΠΎΠ²Π°ΡΡ.
Π Π°Π±ΠΎΡΠ°Π΅Ρ ΡΠΎ Π²ΡΠ΅ΠΌΠΈ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌΠΈ Π²Π΅Π±-Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌΠΈ ΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ Π΄Π»Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ².ΠΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ ΠΎΠ±ΡΡΡΠ½ΡΠ΅Ρ ΠΏΡΠΈΠ½ΡΠΈΠΏΡ ΡΠ°Π±ΠΎΡΡ Clusterize, Π° ΡΠ°ΠΊΠΆΠ΅ ΡΠΏΠΎΠΌΠΈΠ½Π°Π΅Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠ΄Π΅ΠΈ ΠΎ ΡΠΎΠΌ, ΠΊΠ°ΠΊ Π½Π΅ ΠΏΠ΅ΡΠ΅ΡΡΠ΅ΡΠ΄ΡΡΠ²ΠΎΠ²Π°ΡΡ Ρ Π²Π°ΡΠΈΠΌΠΈ Π΄Π°Π½Π½ΡΠΌΠΈ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΡ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΡΡ ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½ΠΈΡ Π½Π° ΡΠΎ, ΡΠΊΠΎΠ»ΡΠΊΠΎ Π΄Π°Π½Π½ΡΡ ΠΌΠΎΠΆΠ΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π² ΠΎΠ΄Π½ΠΎΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅.
Π‘ΠΊΠ°ΡΠ°ΡΡTwentyTwenty
Π‘ΡΠ°ΡΡΠ°ΠΏΡ ΠΈ ΠΠ’-ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ Π² Π½Π°ΡΠΈ Π΄Π½ΠΈ Π·Π°ΠΏΡΡΠΊΠ°ΡΡΡΡ Π½Π°ΠΏΡΠ°Π²ΠΎ ΠΈ Π½Π°Π»Π΅Π²ΠΎ, ΠΈ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ ΠΈΠ· Π½ΠΈΡ ΡΠΎΡΡΠ΅Π΄ΠΎΡΠΎΡΠ΅Π½Ρ Π½Π° ΡΠΎΠΉ ΠΈΠ»ΠΈ ΠΈΠ½ΠΎΠΉ ΡΠΎΡΠΌΠ΅ Π²Π΅Π±-ΠΌΠ°Π½ΠΈΠΏΡΠ»ΡΡΠΈΠΉ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ²ΠΎΠ΅Π³ΠΎ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠ½ΠΎΠ³ΠΎ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠ΅Π½ΠΈΡ, Π² Π½Π΅ΠΊΠΎΡΠΎΡΡΡ ΡΠ»ΡΡΠ°ΡΡ ΡΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΠΈ ΡΠ΅Π΄Π°ΠΊΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ Π² ΠΠ½ΡΠ΅ΡΠ½Π΅ΡΠ΅, ΠΈΠ½ΠΎΠ³Π΄Π° ΡΡΠΎ ΠΏΡΠΎΠ΄ΡΠΊΡ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΌΠΎΠΆΠ΅Ρ ΡΠ΄Π΅Π»Π°ΡΡ Π²Π°Ρ Π²Π΅Π±-ΡΠ°ΠΉΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΌ, ΠΈ Π² ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠ΅ 2 Π³ΠΎΠ΄Π° ΠΏΠΎΡΠ²ΠΈΠ»Π°ΡΡ Π½ΠΎΠ²Π°Ρ ΡΠ΅Π½Π΄Π΅Π½ΡΠΈΡ, ΠΊΠΎΠ³Π΄Π° ΡΡΠ°ΡΡΠ°ΠΏΡ Π½Π°ΡΠ°Π»ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠΈΡΠΎΠ²Π°ΡΡ 20/20 ΡΠΎΡΠΎ-ΠΏΡΠ΅Π²ΡΡ ΡΠ²ΠΎΠ΅Π³ΠΎ ΠΏΡΠΎΠ΄ΡΠΊΡΠ°.ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Ρ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΎΠΌ 20/20 — ΠΊΠ»ΠΈΠ΅Π½Ρ ΠΌΠΎΠΆΠ΅Ρ ΠΏΡΠΎΠ΄Π΅ΠΌΠΎΠ½ΡΡΡΠΈΡΠΎΠ²Π°ΡΡ, ΠΊΠ°ΠΊ Π²Π°Ρ ΠΏΡΠΎΠ΄ΡΠΊΡ Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΡΡ ΡΡΠ½ΠΊΡΠΈΡ ΠΈΠ»ΠΈ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡ. ΠΡΠΎ ΠΏΠΎΡ ΠΎΠΆΠ΅ Π½Π° ΡΠΎ, ΡΡΠΎ Π²Ρ Π²ΠΈΠ΄ΠΈΡΠ΅ Π² ΡΠ°ΠΊΠΎΠΌ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠ΅, ΠΊΠ°ΠΊ Affinity Pro ΠΈΠ»ΠΈ Photoshop; Π³Π΄Π΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΏΡΠΎΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π° ΠΏΡΠ΅Π΄ΠΌΠ΅Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΏΡΠΎΡΡΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ Π²ΠΏΠ΅ΡΠ΅Π΄ ΠΈ Π½Π°Π·Π°Π΄.
ΠΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° TwentyTwenty, ΠΈΠ½ΡΠ΅Π³ΡΠΈΡΠΎΠ²Π°Π½Π½Π°Ρ Π² Π²Π°Ρ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΉ ΡΡΠ΅ΠΊ, ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½Π° Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΠ°Π·Π»ΠΈΡΠΈΠΉ ΠΌΠ΅ΠΆΠ΄Ρ Π΄Π²ΡΠΌΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΌΠΈ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡΠΌΠΈ Ρ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΡΠΌ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠΎΠΌ, ΡΡΠΎΠ±Ρ ΡΠ°Π±ΠΎΡΠ° ΠΎΡΡΠ°Π²Π°Π»Π°ΡΡ Π±Π΅Π·ΡΠΏΡΠ΅ΡΠ½ΠΎΠΉ. Π’Π°ΠΊΠΈΠ΅ ΡΠ°ΠΉΡΡ, ΠΊΠ°ΠΊ TinyPNG, ΡΠ²Π»ΡΡΡΡΡ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠΌ, ΠΊΠΎΡΠΎΡΠΎΠΌΡ ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΏΠΎΠ»Π΅Π·Π΅Π½, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΎΠ½ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π΅Π±-ΠΌΠ°ΡΡΠ΅ΡΡ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ, ΠΊΠ°ΠΊ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π²ΡΠ³Π»ΡΠ΄Π΅Π»ΠΎ Π΄ΠΎ ΡΠΆΠ°ΡΠΈΡ ΠΈ ΠΊΠ°ΠΊ ΠΎΠ½ΠΎ Π²ΡΠ³Π»ΡΠ΄Π΅Π»ΠΎ ΠΏΠΎΡΠ»Π΅ ΡΠΆΠ°ΡΠΈΡ, ΠΈ ΡΡΠ° ΠΊΠΎΠ½ΡΠ΅ΠΏΡΠΈΡ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½Π° ΠΊ Π»ΡΠ±ΠΎΠΉ ΡΠΈΡΡΠ°ΡΠΈΠΈ, Π² ΠΊΠΎΡΠΎΡΠΎΠΉ Π²Ρ ΠΌΠ΅Π½ΡΡΡ ΡΡΠΎ-ΡΠΎ Ρ ΠΎΠ΄Π½ΠΎΠ³ΠΎ Π½Π° Π΄ΡΡΠ³ΠΎΠ΅ ΠΈ Ρ ΠΎΡΡΡ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ ΠΊΠ»ΠΈΠ΅Π½ΡΡ, ΠΊΠ°ΠΊΠΈΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ ΠΎΠ½ ΠΌΠΎΠΆΠ΅Ρ ΠΎΠΆΠΈΠ΄Π°ΡΡ.ΠΡΠΎ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠΉ ΠΏΠΎΠ΄Ρ ΠΎΠ΄, ΠΊΠΎΡΠΎΡΡΠΉ Π²ΡΡΠΎΠΊΠΎ ΠΎΡΠ΅Π½ΠΈΠ²Π°ΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΆΠ΅ Π°Π΄Π°ΠΏΡΠΈΡΡΡΡΡΡ ΠΊ ΡΠ°ΠΊΠΈΠΌ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌ ΠΌΠ΅ΡΠΎΠ΄Π°ΠΌ Π²Π΅Π±-ΡΠ΅Ρ Π½ΠΎΠ»ΠΎΠ³ΠΈΠΉ.
ΠΠ°Π³ΡΡΠ·ΠΈΡΠ΅Π‘Π»Π°ΠΉΠ΄-ΠΈ Push-ΠΌΠ΅Π½Ρ
ΠΠ΅Π½Ρ Π½Π΅ΠΈΠ·Π±Π΅ΠΆΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΏΡΠΎΡΠΌΠ°ΡΡΠΈΠ²Π°Π΅ΠΌΡΡ / ΠΏΠΎΡΠ΅ΡΠ°Π΅ΠΌΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² Π²Π°ΡΠ΅Π³ΠΎ Π²Π΅Π±-ΡΠ°ΠΉΡΠ°, ΡΠ΅ΠΌ Π±ΠΎΠ»Π΅Π΅ Π΄Π»Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ², Π³Π΄Π΅ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ ΠΎΠ±ΡΡΠ½ΠΎ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ ΠΌΠ΅Π½Ρ, Π½ΠΎ Π΄Π°ΠΆΠ΅ Π² ΡΠ΅Ρ ΡΠ»ΡΡΠ°ΡΡ , ΠΊΠΎΠ³Π΄Π° ΠΌΡ ΠΆΠΈΠ²Π΅ΠΌ ΡΠ΅ΠΉΡΠ°Ρ, Π² ΠΌΠ΅Π½Ρ ΠΏΠΎ-ΠΏΡΠ΅ΠΆΠ½Π΅ΠΌΡ ΠΎΡΡΡΡΡΡΠ²ΡΡΡ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ, Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΈ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠ΅ ΠΏΠΎΠ΄Ρ ΠΎΠ΄Ρ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°ΡΡ ΠΎΡΠ»ΠΈΡΠ½ΠΎΠ΅ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ. Π‘Π»Π°ΠΉΠ΄-ΠΈ push-ΠΌΠ΅Π½Ρ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡ ΠΏΠΎ-Π½ΠΎΠ²ΠΎΠΌΡ Π²Π·Π³Π»ΡΠ½ΡΡΡ Π½Π° ΡΠΎ, ΠΊΠ°ΠΊ ΠΌΠΎΠ³Π»ΠΎ Π±Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π²Π΅Π±-Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ. Π ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΊ ΡΡΠΎΠΌΡ ΠΌΠ΅Π½Ρ ΠΏΡΠΈΠ»Π°Π³Π°Π΅ΡΡΡ ΡΡΠ΅Π±Π½ΠΎΠ΅ ΠΏΠΎΡΠΎΠ±ΠΈΠ΅, ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ Π΅Π³ΠΎ ΠΊ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎΠΌΡ Π΄ΠΈΠ·Π°ΠΉΠ½Ρ ΡΠΆΠ΅ ΡΠΊΠ°Π·Π°Π½ΠΎ ΠΈ ΡΠ΄Π΅Π»Π°Π½ΠΎ.
ΠΡΠ·ΡΠ²Π°Π΅ΡΡΡ Blueprint, ΡΡΠΎ ΠΌΠ΅Π½Ρ ΠΈΠΌΠ΅Π΅Ρ Π΄Π²Π° ΠΏΠΎΠ΄Ρ ΠΎΠ΄Π°; ΡΠΊΠΎΠ»ΡΠ·ΠΈΡΡ ΠΈ ΡΠΎΠ»ΠΊΠ°ΡΡ. ΠΡΠΈ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠΈ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ (ΠΎΠ±ΡΠ°ΡΠ½ΡΠΉ Π²ΡΠ·ΠΎΠ²) ΠΌΠ΅Π½Ρ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΎ Π²ΡΠ΄Π²ΠΈΠ³Π°Π»ΠΎΡΡ ΠΈΠ· Π»Π΅Π²ΠΎΠΉ, ΠΏΡΠ°Π²ΠΎΠΉ, Π²Π΅ΡΡ Π½Π΅ΠΉ ΠΈΠ»ΠΈ Π½ΠΈΠΆΠ½Π΅ΠΉ ΡΠ°ΡΡΠ΅ΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ, ΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΡ Π² ΡΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π±ΡΠΊΠ²Π°Π»ΡΠ½ΠΎ Π²ΡΠ΅, ΡΡΠΎ ΡΠ³ΠΎΠ΄Π½ΠΎ, Π΅ΡΠ»ΠΈ ΠΎΠ½ΠΎ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ HTML5. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, Π² Π½Π΅ΠΊΠΎΡΠΎΡΠΎΠΌ ΡΠΌΡΡΠ»Π΅ Blueprint Π΄Π°Π΅Ρ Π²Π°ΠΌ ΠΎΡΠ½ΠΎΠ²Ρ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ, Π° ΠΎΡΡΠ°Π»ΡΠ½ΠΎΠ΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΡΡΡΠΎΠΈΡΡ ΠΏΠΎ ΡΠ²ΠΎΠ΅ΠΌΡ ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΡ, Π΄Π°ΠΆΠ΅ Π΅ΡΠ»ΠΈ ΡΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΡ ΡΡΠ½ΠΊΡΠΈΠΉ JavaScript, ΡΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ Π²Π°ΡΠ΅ ΠΌΠ΅Π½Ρ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ½ΡΠΌ, ΡΡΠΎ Π½Π° ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΡΠ΅Π½Ρ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΠΌ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΎΠΌ ΠΏΡΡΠΌΠΎ ΡΠ΅ΠΉΡΠ°Ρ. Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΡ Π½ΠΎΠ²ΠΎΡΡΠ΅ΠΉ ΠΈ Π΄ΡΡΠ³ΠΈΡ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ².
ΠΠ°Π³ΡΡΠ·ΠΈΡΠ΅jQuery Knob
ΠΡΠ»ΠΈ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π² ΡΠ²ΠΎΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΡΠΉ ΡΡΡΠ΅ΠΊΡ ΠΏΠ»Π°Π³ΠΈΠ½Π° jQuery Π² Π²ΠΈΠ΄Π΅ ΡΠΈΡΠ΅ΡΠ±Π»Π°ΡΠ°, ΠΊΠΎΠ»Π΅ΡΠΈΠΊΠ°, ΡΡΡΠΊΠΈ, ΠΊΠ°ΠΊ Π±Ρ Π²Ρ ΡΡΠΎ Π½ΠΈ Π½Π°Π·ΡΠ²Π°Π»ΠΈ, ΠΎΡΡΡΠ΄Π° ΠΈ Π½Π°Π·Π²Π°Π½ΠΈΠ΅, jQuery Knob ΡΠ΄Π΅Π»Π°Π΅Ρ ΡΠ²ΠΎΠ΅ Π΄Π΅Π»ΠΎ . ΠΠ½ ΠΏΠΎΡΡΠ°Π²Π»ΡΠ΅ΡΡΡ Π² Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ
ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ
Π²Π°ΡΠΈΠ°Π½ΡΠ°Ρ
ΠΈ ββΠ²Π°ΡΠΈΠ°ΡΠΈΡΡ
, ΡΡΠΎΠ±Ρ Π²Π°ΠΌ Π±ΡΠ»ΠΎ Π½Π°ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΡΠΎΡΠ΅ Π½Π°ΠΉΡΠΈ Π½ΡΠΆΠ½ΡΠΉ. Π§Π΅ΡΡΡΠ΅ ΡΠΈΡΡΡ, ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅, ΡΠ΅ΠΆΠΈΠΌ ΠΊΡΡΡΠΎΡΠ°, ΡΡΠΈΠ»Ρ ΡΠ°ΡΠΎΠ² ΠΈ Π±Π΅ΡΠΊΠΎΠ½Π΅ΡΠ½ΠΎΠ΅ ΠΊΠΎΠ»Π΅ΡΠΎ — Π²ΠΎΡ Π»ΠΈΡΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠ· ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ², ΠΊΠΎΡΠΎΡΡΠΌΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π² ΠΏΠΎΠ»Π½ΠΎΠΉ ΠΌΠ΅ΡΠ΅. ΠΡΠ΅ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Ρ ΠΈΠΌΠ΅ΡΡ ΡΠ°Π·Π½ΡΠ΅ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠΆΠΈΠ²Π»ΡΡΡ ΡΠΈΡΡΠ°ΡΠΈΡ.ΠΡ Π΄Π°ΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΡΠΎΡΠ΅ΡΡΠΈΡΠΎΠ²Π°ΡΡ Π²Π΅ΡΠΈ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΡΠΎΡΠΌΠΎΡΡΠ°, ΡΡΠΎΠ±Ρ ΡΠ²ΠΈΠ΄Π΅ΡΡ, ΠΊΠ°ΠΊ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ jQuery Knob.
Fancybox
Fancybox — ΡΡΠΎ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π²Π°ΠΌ Π½Π°ΠΈΠ»ΡΡΡΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΠΏΡΠ΅Π΄ΡΡΠ°Π²ΠΈΡΡ Π²ΡΠ΅Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΡΠ΅ ΠΌΠ΅Π΄ΠΈΠ°. ΠΠΈΠ΄Π΅ΠΎ ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΡΠ΅ΠΊΡΠ°ΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ Fancybox, ΠΏΡΠ΅Π΄Π»Π°Π³Π°Ρ Π²Π°ΠΌ ΠΊΡΠ°ΡΠΈΠ²ΠΎ ΠΈΡ
ΠΏΡΠΎΠ΄Π΅ΠΌΠΎΠ½ΡΡΡΠΈΡΠΎΠ²Π°ΡΡ. Π₯ΠΎΡΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΎΡΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, Π²Ρ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΠΈ Π½Π°ΡΡΡΠΎΠΈΡΡ Fancybox Π² ΡΠΎΡΠ½ΠΎΠΌ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ ΡΠΎ ΡΠ²ΠΎΠΈΠΌΠΈ ΠΏΠΎΡΡΠ΅Π±Π½ΠΎΡΡΡΠΌΠΈ. ΠΠ·Π»ΠΈΡΠ½Π΅ Π³ΠΎΠ²ΠΎΡΠΈΡΡ, ΡΡΠΎ ΠΌΠ°ΠΊΠ΅Ρ Π½Π° 100% ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠΉ, Π±Π΅Π·ΡΠΏΡΠ΅ΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π½Π° ΡΠΌΠ°ΡΡΡΠΎΠ½Π°Ρ
, ΠΏΠ»Π°Π½ΡΠ΅ΡΠ°Ρ
ΠΈ ββΠ½Π°ΡΡΠΎΠ»ΡΠ½ΡΡ
ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ°Ρ
.ΠΡΡΠ³ΠΈΠΌΠΈ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ, ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΡ Π±ΡΠ΄Π΅Ρ ΠΏΠ΅ΡΠ²ΠΎΠΊΠ»Π°ΡΡΠ½ΠΎΠΉ Π½Π° Π²ΡΠ΅Ρ
ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ
ΠΈ ΠΏΠ»Π°ΡΡΠΎΡΠΌΠ°Ρ
. Fancybox ΡΠ°ΠΊΠΆΠ΅ ΠΈΠΌΠ΅Π΅Ρ ΡΡΠΊΠΎΡΠ΅Π½ΠΈΠ΅ Π½Π° GPU, ΡΠ°ΡΠΏΠΎΠ·Π½Π°Π΅Ρ ΠΊΠΎΠ½ΡΠ΅Π½Ρ Ρ ΠΈΠ·Π²Π΅ΡΡΠ½ΡΡ
ΡΠ°ΠΉΡΠΎΠ² ΠΈ Π³Π°ΡΠ°Π½ΡΠΈΡΡΠ΅Ρ Π±ΡΡΡΡΡΡ ΠΈ Π»Π΅Π³ΠΊΡΡ Π½Π°ΡΡΡΠΎΠΉΠΊΡ. Π‘ΠΎΠ·Π΄Π°ΠΉΡΠ΅ ΠΏΡΠΈΡΡΠ½ΠΎΠ΅ Π²ΠΏΠ΅ΡΠ°ΡΠ»Π΅Π½ΠΈΠ΅ ΠΎΡ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° Π²Π°ΡΠ΅Π³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° Π΄Π»Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ.
FullPage
ΠΠ°ΠΊ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΈΠ· Π½Π°Π·Π²Π°Π½ΠΈΡ, FullPage — ΡΡΠΎ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π²ΠΏΠ΅ΡΠ°ΡΠ»ΡΡΡΠΈΠ΅ ΠΏΠΎΠ»Π½ΠΎΡΠΊΡΠ°Π½Π½ΡΠ΅ Π²Π΅Π±-ΡΠ°ΠΉΡΡ Ρ ΠΏΡΠΎΠΊΡΡΡΠΊΠΎΠΉ. ΠΡΡΠ³ΠΈΠΌΠΈ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ, ΡΡΠΎ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ ΡΠ΅Π»Π΅Π²ΡΡ
ΡΡΡΠ°Π½ΠΈΡ ΠΈΠ»ΠΈ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΡΡ
ΡΠ°ΠΉΡΠΎΠ². ΠΡΠ»ΠΈ ΡΡΠΎ Π²ΡΠ·ΡΠ²Π°Π΅Ρ Ρ Π²Π°Ρ ΠΈΠ½ΡΠ΅ΡΠ΅Ρ, ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery — ΠΎΡΠ»ΠΈΡΠ½ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΡΡ Π½Π° ΠΏΡΠ°ΠΊΡΠΈΠΊΠ΅.ΠΠΎΠ½Π΅ΡΠ½ΠΎ, FullPage ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΡΠΎΠ²ΠΌΠ΅ΡΡΠΈΠΌ ΡΠΎ Π²ΡΠ΅ΠΌΠΈ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΠΌΠΈ ΡΡΡΡΠΎΠΉΡΡΠ²Π°ΠΌΠΈ, ΠΏΠΎΡΡΠΎΠΌΡ Π²Π°Ρ Π²Π΅Π±-ΡΠ°ΠΉΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π½Π° Π²ΡΠ΅Ρ
ΡΠΊΡΠ°Π½Π°Ρ
Ρ ΠΊΡΠΈΡΡΠ°Π»ΡΠ½ΠΎΠΉ ΡΠ΅ΡΠΊΠΎΡΡΡΡ. ΠΠΎΠ»Π·ΡΠ½ΠΊΠΈ Ρ Π°Π»ΡΠ±ΠΎΠΌΠ½ΠΎΠΉ ΠΎΡΠΈΠ΅Π½ΡΠ°ΡΠΈΠ΅ΠΉ, ΠΏΠ»Π°Π²Π½ΡΠ΅ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Ρ, ΠΎΡΠ»ΠΈΡΠ½Π°Ρ Π³ΠΈΠ±ΠΊΠΎΡΡΡ, ΡΡΠΎ ΡΠ³ΠΎΠ΄Π½ΠΎ, ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΏΠΎΠ»Π½ΠΎΡΠΊΡΠ°Π½Π½ΠΎΠ³ΠΎ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΠΎΠ³ΠΎ Π²Π΅Π±-ΡΠ°ΠΉΡΠ° ΠΏΡΠΎΠΈΡΡ
ΠΎΠ΄ΠΈΡ Π½Π°ΠΌΠ½ΠΎΠ³ΠΎ Π±ΡΡΡΡΠ΅Π΅ Ρ FullPage. Π Π½Π°ΡΠΈ Π΄Π½ΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΏΡΠΎΠ΅ΠΊΡΠ° Ρ Π½ΡΠ»Ρ ΠΊΠ°ΠΆΠ΅ΡΡΡ ΡΡΠ°ΡΠΎΠΌΠΎΠ΄Π½ΡΠΌ.
Tiny Slider
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠ° Π΄Π»Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π΄Π»Ρ Π»ΡΠ±ΠΎΠ³ΠΎ Π²Π΅Π±-ΡΠ°ΠΉΡΠ° ΠΈΠ»ΠΈ Π±Π»ΠΎΠ³Π°. Tiny Slider — ΡΡΠΎ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π° Owl Carousel, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΡΠ°Π·Ρ ΠΆΠ΅ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π²Π°ΠΌ Π΄Π²ΠΈΠ³Π°ΡΡΡΡ Π² ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠΌ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠΈ.ΠΠ΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠ· ΡΡΠ½ΠΊΡΠΈΠΉ Π²ΠΊΠ»ΡΡΠ°ΡΡ Π»Π΅Π½ΠΈΠ²ΡΡ Π·Π°Π³ΡΡΠ·ΠΊΡ, Π°Π²ΡΠΎΠ²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΠ΅, ΡΡΠ²ΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΡ ΠΊ ΠΊΠ°ΡΠ°Π½ΠΈΡ / ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π½ΠΈΡ, Π·Π°ΡΠΈΠΊΠ»ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΈ ΠΎΡΡΡΡΠΏΡ ΠΏΠΎ ΠΊΡΠ°ΡΠΌ, ΠΈ ΡΡΠΎ Π»ΠΈΡΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠ· Π½ΠΈΡ
. ΠΠΌΠ΅ΠΉΡΠ΅ Π² Π²ΠΈΠ΄Ρ, ΡΡΠΎ Π΅ΡΠ»ΠΈ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ Π½Π°ΡΡΡΠΎΠΈΡΡ ΠΈ ΡΠ»ΡΡΡΠΈΡΡ Π΅Π³ΠΎ, ΡΡΠΎΠ±Ρ ΠΎΠ½ ΡΠΎΡΠ½ΠΎ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°Π» Π²Π°ΡΠ΅ΠΌΡ ΠΏΡΠΎΠ΅ΠΊΡΡ, Π²Ρ ΡΠΎΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΠΎ ΡΠ΄Π΅Π»Π°ΡΡ. ΠΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ, ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ° ΠΈ Π΄ΡΡΠ³Π°Ρ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ Π΄ΠΎΡΡΡΠΏΠ½Ρ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ, ΡΡΠΎΠ±Ρ Π²Ρ ΠΌΠΎΠ³Π»ΠΈ ΠΏΠΎΠ½ΡΡΡ ΡΡΡΡ ΠΈ Π½Π°ΡΠ°ΡΡ Ρ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠ³ΠΎ ΠΏΡΡΠΈ.
Bootstrap ΠΠ²Π΅Π·Π΄Π½ΡΠΉ ΡΠ΅ΠΉΡΠΈΠ½Π³
Bootstrap ΠΈΠΌΠ΅Π΅Ρ ΡΠ°ΠΊ ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ Π² Π²Π΅Π±-ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠ΅; Π½Π΅ΡΠ΄ΠΈΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ, ΡΡΠΎ ΡΡΠΎ Π²Π΅Π΄ΡΡΠ°Ρ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ½Π°Ρ ΡΡΠ΅Π΄Π°.Π£ Π²Π°Ρ Π΅ΡΡΡ ΡΠ°Π±Π»ΠΎΠ½Ρ ΠΏΠ°Π½Π΅Π»ΠΈ Π°Π΄ΠΌΠΈΠ½ΠΈΡΡΡΠ°ΡΠΎΡΠ° ΠΈ Π²ΠΏΠ΅ΡΠ°ΡΠ»ΡΡΡΠΈΠ΅ ΡΠ΅ΠΌΡ WordPress, ΡΠΎΠ·Π΄Π°Π½Π½ΡΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Bootstrap, ΠΈ Π² ΡΡΠΎΠΌ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²Π΅ ΡΠ°ΠΊΠΆΠ΅ ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² jQuery, ΠΈ ΠΊΠ°ΠΊ Π±Ρ ΠΌΡ Π½ΠΈ Ρ ΠΎΡΠ΅Π»ΠΈ ΠΎΡ Π²Π°ΡΠΈΡΡ ΠΈΡ Π²ΡΠ΅ Π·Π΄Π΅ΡΡ (ΠΌΡ Π±ΡΠ΄Π΅ΠΌ Π² Π±ΡΠ΄ΡΡΠ΅ΠΌ), ΠΌΡ Π ΡΡΠΎΠΌ ΠΏΠΎΡΡΠ΅ ΠΎΡΠΎΠ±ΠΎΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΡΠ΄Π΅Π»ΡΠ΅ΡΡΡ ΠΊΠ»Π°ΡΡΠ½ΡΠΌ ΡΡΡΠ΅ΠΊΡΠ°ΠΌ jQuery ΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Π°ΠΌ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΡΠ°Π·Π½ΠΎΠΎΠ±ΡΠ°Π·ΡΡ Π²Π°Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΎΠΏΡΡ. ΠΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ Π·Π²Π΅Π·Π΄Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΉΡΠΈΠ½Π³Π° ΠΎΠ±ΡΡΠ½ΠΎ ΠΏΡΠΎΡΡΡ, Ρ ΠΎΡΡ Bootstrap Star Ratings ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΡΠ°ΠΊΠΎΠΉ Π±ΠΎΠ»ΡΡΠΎΠΉ Π½Π°Π±ΠΎΡ ΡΡΠ½ΠΊΡΠΈΠΉ, ΡΡΠΎ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΏΡΡΠ°ΡΡ Π΅Π³ΠΎ Ρ ΠΎΡΠ΄Π΅Π»ΡΠ½ΠΎΠΉ ΠΏΠ»Π°ΡΡΠΎΡΠΌΠΎΠΉ! ΠΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π΄ΡΠΎΠ±Π½ΡΠ΅ ΡΠ΅ΠΉΡΠΈΠ½Π³ΠΈ.Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΌΠΎΠΆΠ½ΠΎ Π²ΡΠ΄Π΅Π»ΠΈΡΡ Π»ΡΠ±ΡΠ΅ Π΄ΡΠΎΠ±Π½ΡΠ΅ Π·Π²Π΅Π·Π΄Ρ ΠΈ ΡΠΏΡΠ°Π²Π»ΡΡΡ ΠΈΠΌΠΈ.
ΠΡΠΎ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΡΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ ΠΎΡΠ»ΠΈΡΠ°Π΅ΡΡΡ ΠΎΡ Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²Π° Π΄ΡΡΠ³ΠΈΡ ΡΠ΅ΠΉΡΠΈΠ½Π³ΠΎΠ²ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ². ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π»ΡΠ±ΠΎΠΉ ΠΈΠ· Π²Π°ΡΠΈΡ Π»ΡΠ±ΠΈΠΌΡΡ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠΎΠ² Π΄Π»Ρ Π·Π½Π°ΡΠΊΠΎΠ² ΡΡΠΈΡΡΠΎΠ², ΡΡΠΎΠ±Ρ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΡΡ ΡΠΈΠΌΠ²ΠΎΠ»Ρ Π·Π²Π΅Π·Π΄ΠΎΡΠΊΠΈ (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π»Π΅Π³ΠΊΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π·Π½Π°ΡΠΊΠΈ ΠΈΠ· Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ FontAwesome). ΠΠ½ Π΄Π°ΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ Π²Π°ΡΠΈΠΌΠΈ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΌΠΈ ΡΡΠΈΠ»ΡΠΌΠΈ (ΡΠ΅ΠΌΠ°ΠΌΠΈ), ΡΡΠΎΠ±Ρ Π»ΡΡΡΠ΅ ΠΈΠ½ΡΠ΅Π³ΡΠΈΡΠΎΠ²Π°ΡΡΡΡ Π² Π΄ΠΈΠ·Π°ΠΉΠ½, ΠΊΠΎΡΠΎΡΡΠΉ Π²Ρ ΡΠΆΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅. Π Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ Π²Ρ Π½Π°ΠΉΠ΄Π΅ΡΠ΅ Π±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΡΠ΅ ΠΎΠ±ΡΡΡΠ½Π΅Π½ΠΈΡ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΡΡΠΈ ΡΡΠ½ΠΊΡΠΈΠΈ, ΠΈ ΠΊΠ°ΠΊ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΠΊΠ»ΡΡΠΈΡΡ Bootstrap Star Rating Π² ΡΠ²ΠΎΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ.
Π‘ΠΊΠ°ΡΠ°ΡΡShepherd
Π ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΌ ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠΈ ΠΏΠ»Π°Π²Π½ΠΎΠ³ΠΎ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ ΠΎΠ½Π±ΠΎΡΠ΄ΠΈΠ½Π³ ΡΡΠ°Π» Π² Π½Π΅ΠΊΠΎΡΠΎΡΠΎΠΉ ΡΡΠ΅ΠΏΠ΅Π½ΠΈ Π³ΠΎΡΡΡΠ΅ΠΉ ΡΠ΅Π½Π΄Π΅Π½ΡΠΈΠ΅ΠΉ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡΠ΅ΠΉ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ Π²Π°ΡΠΈ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ Π·Π½Π°ΠΊΠΎΠΌΡΡΡΡ Ρ Π²Π°ΡΠΈΠΌ ΠΏΡΠΎΠ΄ΡΠΊΡΠΎΠΌ Π² ΠΏΡΠΎΡΠ΅ΡΡΠ΅ ΡΠ΅Π³ΠΈΡΡΡΠ°ΡΠΈΠΈ. ΠΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π»Π΅Π³ΡΠ΅ ΠΎΠ±ΡΡΡΠ½ΠΈΡΡ, ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ Π²Π°ΡΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΏΡΠΈ ΡΠ΅Π³ΠΈΡΡΡΠ°ΡΠΈΠΈ, Π°Π΄Π°ΠΏΡΠ°ΡΠΈΡ ΠΊ ΡΠ°Π±ΠΎΡΠ΅ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ ΠΆΠΈΠ·Π½Π΅Π½Π½ΠΎ Π²Π°ΠΆΠ½ΠΎΠΉ ΡΠ°ΡΡΡΡ ΡΡΠΏΠ΅Ρ Π° Π²Π°ΡΠ΅Π³ΠΎ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΈ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠ½ΠΎΠ³ΠΎ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠ΅Π½ΠΈΡ. Π ΡΠΎ Π²ΡΠ΅ΠΌΡ ΠΊΠ°ΠΊ Π½Π΅ΠΊΠΎΡΠΎΡΡΠΌ Π²ΡΠ΅ Π΅ΡΠ΅ ΡΠ΄Π°Π΅ΡΡΡ ΡΠΏΠΎΡΠΈΡΡ ΠΎ ΠΏΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ²Π°Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΎΠΏΡΡΠ° Π°Π΄Π°ΠΏΡΠ°ΡΠΈΠΈ, Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΆΠ΅ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ»ΠΈ ΡΠ΅Π±Π΅ Π±ΠΎΠ»ΡΡΠΎΠΉ ΡΡΠΏΠ΅Ρ Π²ΠΏΠ΅ΡΠ΅Π΄ΠΈ, ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· ΡΠ°ΠΊΠΈΡ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ² ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΠ»Π°ΡΡΠΎΡΠΌΠ° ΡΠ»Π΅ΠΊΡΡΠΎΠ½Π½ΠΎΠΉ ΠΊΠΎΠΌΠΌΠ΅ΡΡΠΈΠΈ Shopify, ΠΊΠΎΡΠΎΡΠ°Ρ Π²ΡΡ ΠΎΠ΄ΠΈΡ Π·Π° ΡΠ°ΠΌΠΊΠΈ ΡΡΠ°Π΄ΠΈΡΠΈΠΎΠ½Π½ΠΎΠ³ΠΎ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΈ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°Π΅Ρ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΎΠ²Π°ΡΡ ΠΈ ΠΎΠ±ΡΡΠ°ΡΡ ΡΠ²ΠΎΠΈΡ ΠΊΠ»ΠΈΠ΅Π½ΡΠΎΠ² Π΅ΡΠ΅ Π΄ΠΎΠ»Π³ΠΎ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ » ΠΏΠΎΠ΄ΠΏΠΈΡΠ°Π»ΠΈΡΡ, ΡΠ°ΡΠ΅ Π²ΡΠ΅Π³ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ»Π΅ΠΊΡΡΠΎΠ½Π½ΠΎΠ³ΠΎ ΠΌΠ°ΡΠΊΠ΅ΡΠΈΠ½Π³Π°.
ΠΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ Inbox ΠΈ Peach, ΡΡΠΎΠ²Π΅ΡΡΠ΅Π½ΡΡΠ²ΠΎΠ²Π°Π»ΠΈ ΡΠ²ΠΎΠΈ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠ΅ ΡΠΊΡΠ°Π½Ρ Π²Ρ ΠΎΠ΄Π° Π² ΡΠΈΡΡΠ΅ΠΌΡ ΠΈ Π΄ΠΎΠ±ΠΈΠ»ΠΈΡΡ Π±ΠΎΠ»ΡΡΠΎΠ³ΠΎ ΡΡΠΏΠ΅Ρ Π° Π² ΠΎΠ±ΡΡΡΠ½Π΅Π½ΠΈΠΈ ΡΠ²ΠΎΠΈΡ ΠΏΡΠΎΠ΄ΡΠΊΡΠΎΠ² ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π΅ΡΠ΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ Π·Π°Π²Π΅ΡΡΠ°Ρ Π½Π°ΡΡΡΠΎΠΉΠΊΡ ΠΏΠ°ΡΠΎΠ»Ρ ΡΠ²ΠΎΠ΅ΠΉ ΡΡΠ΅ΡΠ½ΠΎΠΉ Π·Π°ΠΏΠΈΡΠΈ. Π’Π΅ΠΏΠ΅ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Shepherd (ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π½Π½ΠΎΠΉ HubSpot, ΠΎΠ΄Π½ΠΎΠΉ ΠΈΠ· Π²Π΅Π΄ΡΡΠΈΡ ΠΌΠΈΡΠΎΠ²ΡΡ ΠΌΠ°ΡΠΊΠ΅ΡΠΈΠ½Π³ΠΎΠ²ΡΡ ΠΏΠ»Π°ΡΡΠΎΡΠΌ) ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΌΠΎΠΆΠ΅Ρ Π½Π°ΡΡΡΠΎΠΈΡΡ ΠΏΠΎΡΠ°Π³ΠΎΠ²ΡΠΉ ΠΏΡΠΎΡΠ΅ΡΡ ΡΠ΅Π³ΠΈΡΡΡΠ°ΡΠΈΠΈ Π΄Π»Ρ ΡΠ²ΠΎΠ΅Π³ΠΎ Π²Π΅Π±-ΡΠ°ΠΉΡΠ° ΠΈΠ»ΠΈ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΡ, ΡΠΊΠ°ΠΆΠΈΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ ΠΎΠ±ΡΡΡΠ½ΠΈΡΡ, ΠΈ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎ ΠΎΠ±ΡΡΡΠ½ΠΈΡΠ΅, ΡΡΠΎ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΈΠ· Π½ΠΈΡ Π΄Π΅Π»Π°Π΅Ρ ΠΈ ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠΎΠΎΡΠ½ΠΎΡΠΈΡΡΡ Ρ Π²Π°ΡΠΈΠΌ Π²ΠΈΠ΄Π΅Π½ΠΈΠ΅ΠΌ.ΠΡΠΎΡΡΡΠ΅ ΠΈΠ½ΡΡΡΡΠΊΡΠΈΠΈ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡΠΈ Π² Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ, ΠΆΠ΅Π»Π°Ρ Π²Π°ΠΌ ΡΡΠ°ΡΡΡΡ!
Π‘ΠΊΠ°ΡΠ°ΡΡTingle.js
ΠΠΎΠ΄Π°Π»ΡΠ½ΡΠ΅ ΠΎΠΊΠ½Π° (Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π°, ΡΠΊΡΠ°Π½Π½ΡΠ΅ ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΡ) ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°ΡΡ ΠΏΡΠΎΡΠ²Π΅ΡΠ°ΡΡ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ ΠΠ½ΡΠ΅ΡΠ½Π΅ΡΠ° ΠΈΡΡΡ Π½ΠΎΠ²ΡΠ΅ ΠΈ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠ΅ ΡΠΏΠΎΡΠΎΠ±Ρ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ Ρ Π²Π΅Π±-ΡΠ°ΠΉΡΠ°ΠΌΠΈ, Π½ΠΎ ΡΡΠΎ Π½Π΅ Π΅Π΄ΠΈΠ½ΡΡΠ²Π΅Π½Π½ΡΠ΅ ΡΡΠ½ΠΎΡΠ½ΡΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠ΅ ΠΎΠΊΠ½Π°, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ ΠΎΡΠΎΡΠΎ. Π’Π΅Ρ Π½ΠΈΡΠ΅ΡΠΊΠΈ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠ΅ ΠΎΠΊΠ½Π° ΡΡΡΠ΅ΡΡΠ²ΡΡΡ ΡΠΆΠ΅ Π΄Π°Π²Π½ΠΎ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΊΠΎΠ³Π΄Π° Π²Ρ Π½Π°ΠΆΠΈΠΌΠ°Π΅ΡΠ΅ Π½Π° Facebook, ΡΡΠΎΠ±Ρ ΡΠ΄Π°Π»ΠΈΡΡ ΡΡΠΎ-ΡΠΎ, ΠΏΠΎΡΠ²Π»ΡΠ΅ΡΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ (ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅) Ρ ΠΏΡΠΎΡΡΠ±ΠΎΠΉ ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠ΄ΠΈΡΡ Π²Π°ΡΠ΅ Π΄Π΅ΠΉΡΡΠ²ΠΈΠ΅.
ΠΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² ΠΈΠ·Π±Π΅Π³Π°Π»ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ ΠΎΠΊΠΎΠ½ ΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ ΠΎΠΊΠΎΠ½ Π² ΡΠ²ΠΎΠΈΡ ΠΏΡΠΎΠ΅ΠΊΡΠ°Ρ , ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΡΡΠΈΡΠ°Π»ΠΈ, ΡΡΠΎ ΡΡΠΎ ΠΌΠ΅ΡΠ°Π΅Ρ ΡΠ°Π±ΠΎΡΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ. ΠΠΎ ΡΡΠ°ΡΠ΅Π»ΡΠ½ΠΎ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π½Π½Π°Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½Π°Ρ ΡΡΠ½ΠΊΡΠΈΡ ΠΌΠΎΠΆΠ΅Ρ ΡΠ»ΡΡΡΠΈΡΡ Π²Π°Ρ UX! Tingle.js ΠΏΠΎΡΠ΅Π½ΡΠΈΠ°Π»ΡΠ½ΠΎ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· ΡΠ°ΠΌΡΡ Ρ ΠΎΡΠΎΡΠΈΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² jQuery Π½Π° ΡΡΠ½ΠΊΠ΅. ΠΠ½ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΠ΅Ρ ΠΏΡΠΎΡΠ΅ΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΌ ΡΡΠ°Π½Π΄Π°ΡΡΠ°ΠΌ Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΈ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°Π΅Ρ Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ ΠΎΡ Π°ΠΊΡΠΈΠ²Π°ΡΠΈΠΈ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° ΠΊ Π΅Π³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ. Π§ΡΠΎ Π΅ΡΠ΅ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ½ΡΡΠΈΠ³ΡΠ΅Ρ, ΡΠ°ΠΊ ΡΡΠΎ ΡΠΎ, ΡΡΠΎ Tingle.js ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ Π²Ρ ΠΌΠΎΠ³Π»ΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π²Π½ΡΡΡΠΈ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° ΠΈΠ»ΠΈ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°ΡΡ ΠΎΡΠΏΡΠ°Π²ΠΊΡ ΡΠΎΡΠΌ, Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ Ρ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ, Π΄Π°ΠΆΠ΅ Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π³Π°Π»Π΅ΡΠ΅ΠΉ Π²ΠΎ Π²Π½Π΅ΡΠ½Π΅ΠΌ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΌ ΠΎΠΊΠ½Π΅.ΠΡΠ±ΠΎΠΉ, Ρ ΠΊΠΎΠ³ΠΎ Π΅ΡΡΡ ΠΎΠΏΡΡ ΡΠ°Π±ΠΎΡΡ Ρ JavaScript, ΠΌΠΎΠΆΠ΅Ρ Π»Π΅Π³ΠΊΠΎ ΠΏΡΠ΅Π²ΡΠ°ΡΠΈΡΡ ΡΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π²ΠΎ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ Π±Π»ΠΎΠ³Π³Π΅ΡΠΎΠ² WordPress.
Π‘ΠΊΠ°ΡΠ°ΡΡBarba.js
ΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ ΡΠΆΠ΅ Π΄Π΅ΡΡΡΡ Π»Π΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ AJAX Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠΏΠΎΠΊΠΎΠΉΠ½ΠΎΠ³ΠΎ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ, ΠΈ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°ΡΡ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡ Π½ΠΎΠ²ΡΠ΅ ΡΠΏΠΎΡΠΎΠ±Ρ ΡΠΎΠ²ΠΌΠ΅ΡΡΠΈΡΡ ΡΡΡ ΡΠ΅Ρ Π½ΠΎΠ»ΠΎΠ³ΠΈΡ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΌ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠΎΠΌ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΌΡ ΠΏΠΎΠ»ΡΡΠ°Π΅ΠΌ ΠΏΡΠΈ ΠΏΠΎΡΡΠ΅Π±Π»Π΅Π½ΠΈΠΈ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°. Barba.js — ΡΡΠΎ ΡΡΡΠ΅ΠΊΡ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ Π΄Π°Π΅Ρ Π²Π°ΡΠ΅ΠΌΡ ΡΠ°ΠΉΡΡ ΡΡΡΠ΅ΠΊΡ ΠΏΠ»Π°Π²Π½ΠΎΠ³ΠΎ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π° ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΡΠ°Π½ΠΈΡΠ°ΠΌΠΈ. ΠΠ΅ΡΠΎΡΡΠ½ΠΎ, Π²Ρ ΡΠΆΠ΅ ΠΏΡΠΎΡΠΌΠ°ΡΡΠΈΠ²Π°Π»ΠΈ Π²Π΅Π±-ΡΠ°ΠΉΡ, Π½Π° ΠΊΠΎΡΠΎΡΠΎΠΌ Ρ ΠΎΠ±Π΅ΠΈΡ ΡΡΠΎΡΠΎΠ½ ΡΡΡΠ°Π½ΠΈΡΡ Π±ΡΠ»ΠΈ ΡΡΡΠ΅Π»ΠΊΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ Β«ΠΡΠ΅Π΄ΡΠ΄ΡΡΠ°Ρ ΠΈ Π‘Π»Π΅Π΄ΡΡΡΠ°ΡΒ».
ΠΠ±ΡΡΠ½ΠΎ ΡΡΠΈ ΡΡΡΠ΅Π»ΠΊΠΈ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΡΡ ΡΠΎΠ±ΠΎΠΉ ΠΆΠ΅ΡΡΠΊΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡΡ ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ Π·Π°Π³ΡΡΠΆΠ°ΡΡ Π½ΠΎΠ²ΡΡ, ΠΊΠ°ΠΊ ΡΠΎΠ»ΡΠΊΠΎ Π²Ρ ΡΠ΅Π»ΠΊΠ°Π΅ΡΠ΅ ΠΏΠΎ Π½ΠΈΠΌ, ΠΏΠΎΡΡΠΎΠΌΡ Barba.js Π΄Π΅Π»Π°Π΅Ρ ΡΠΎ ΠΆΠ΅ ΡΠ°ΠΌΠΎΠ΅, Π½ΠΎ ΡΠ΄Π°Π»ΡΠ΅Ρ ΡΡ ΡΠ°ΡΡΡ, Π³Π΄Π΅ Π±ΡΠ°ΡΠ·Π΅ΡΡ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΠΏΠ΅ΡΠ΅Π·Π°Π³ΡΡΠ·ΠΈΡΡ ΡΡΡΠ°Π½ΠΈΡΡ ΡΠ½ΠΎΠ²Π°, ΠΈ Π²ΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ PJAX, ΠΎΠ½ ΠΏΠ»Π°Π²Π½ΠΎ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΈΡ Π½Π° ΡΠ»Π΅Π΄ΡΡΡΡΡ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΊΠΎΡΠΎΡΡΡ Ρ ΠΎΡΠ΅Ρ ΠΏΡΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ. ΠΡΠΎΡ Π²ΠΈΠ΄ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ° Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π½ΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠΌΡ ΠΎΠΏΡΡΡ ΠΈ ΠΏΠΎΡΠ΅Π½ΡΠΈΠ°Π»ΡΠ½ΠΎ Π½Π°ΠΉΠ΄Π΅Ρ Π³ΠΎΡΠ°Π·Π΄ΠΎ Π±ΠΎΠ»ΡΡΠ΅Π΅ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ Π² Π±Π»ΠΈΠΆΠ°ΠΉΡΠΈΠ΅ Π³ΠΎΠ΄Ρ. Barba Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ ΡΠΈΡΡΠ΅ΠΌΡ ΠΊΠ΅ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ Π΄Π»Ρ ΠΊΡΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΡΡΠ°Π½ΠΈΡ, ΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΡΡΡΠΎΠΈΡΡ Π΅Π΅ ΡΠ°ΠΊ, ΠΊΠ°ΠΊ Π²Π°ΠΌ ΡΠ΄ΠΎΠ±Π½Π΅Π΅.
Π‘ΠΊΠ°ΡΠ°ΡΡRadial SVG Slider
Π‘Π»Π°ΠΉΠ΄Π΅ΡΡ — Π² ΡΠ°ΡΡΠ½ΠΎΡΡΠΈ, jQuery — Π±ΡΠ΄ΡΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°ΡΡ ΡΠΌΠ΅Π½ΡΡΠ°ΡΡΡΡ, ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈ ΡΠ½ΠΎΠ²Π° ΡΠΌΠ΅Π½ΡΡΠ°ΡΡΡΡ, ΠΏΠΎΠΊΠ° Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²ΠΎ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠΎΠ² jQuery Π½Π΅ Π±ΡΠ΄ΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅ ΡΠ΅Ρ Π½ΠΎΠ»ΠΎΠ³ΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π±Π»Π°Π³ΠΎΠΏΡΠΈΡΡΡΡΠ²ΡΡΡ ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΠΈ, ΡΠ°ΠΊ ΠΈ ΡΠ΄ΠΎΠ±ΡΡΠ²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π² ΡΠ° ΠΆΠ΅ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ°. Radial SVG Slider ΠΊΠ°ΠΊ Π±Ρ Π΄Π΅Π»Π°Π΅Ρ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΠ΅ ΡΠ°Π³ΠΈ Π² ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠΌ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠΈ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ SVG clipPath ΠΈ ΡΡΡΠ΅ΠΊΡΡ ΠΌΠ°ΡΠΊΠΈΡΠΎΠ²ΠΊΠΈ, ΡΡΡΠ΅ΠΊΡ ΡΠ°Π΄ΠΈΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΠΊΠΎΠ»ΡΠΆΠ΅Π½ΠΈΡ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ ΡΠ»Π°ΠΉΠ΄Π΅Ρ, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ΄ΠΎΠ±Π΅Π½ Π΄Π»Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ° ΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ², Π½ΠΎ ΠΈ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π±ΡΡΡΡΠ΅Π΅, ΡΠ΅ΠΌ ΠΊΡΠΎ-Π»ΠΈΠ±ΠΎ ΠΊΠΎΠ³Π΄Π°-Π»ΠΈΠ±ΠΎ ΠΌΠΎΠ³ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΡΡ ΡΠ΅Π±Π΅. ΠΠ·Π»ΠΈΡΠ½Π΅ Π³ΠΎΠ²ΠΎΡΠΈΡΡ, ΡΡΠΎ ΡΠΎΡΠΌΠ°Ρ SVG ΠΈΠ³ΡΠ°Π΅Ρ Π±ΠΎΠ»ΡΡΡΡ ΡΠΎΠ»Ρ Π²ΠΎ Π²ΡΠ΅ΠΌ ΡΡΠΎΠΌ ΡΡΠ΅Π½Π°ΡΠΈΠΈ. ΠΠ±Π»Π°Π΄Π°Ρ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠΌΠΈ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΎΠ½Π½ΡΠΌΠΈ ΡΡΡΠ΅ΠΊΡΠ°ΠΌΠΈ, Radial Ρ ΡΠ°Π΄ΠΎΡΡΡΡ ΡΡΠ°Π½Π΅Ρ ΡΠ°ΡΡΡΡ Π²Π°ΡΠ΅Π³ΠΎ ΡΠ°Π±ΠΎΡΠ΅Π³ΠΎ ΠΏΡΠΎΡΠ΅ΡΡΠ° ΠΏΡΠΎΠ΅ΠΊΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ, ΠΊΠΎΠ³Π΄Π° Π²Ρ ΡΠΎΠ·Π΄Π°Π΄ΠΈΡΠ΅ Π½ΠΎΠ²ΡΠ΅ ΠΏΡΠΎΠ΅ΠΊΡΡ Π΄Π»Ρ ΡΠ²ΠΎΠΈΡ ΠΊΠ»ΠΈΠ΅Π½ΡΠΎΠ² Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠ².
Π‘ΠΊΠ°ΡΠ°ΡΡTurntable.js
ΠΠΎΠ²ΠΎΡΠΎΡΠ½ΡΠΉ ΡΡΠΎΠ» — Π½Π΅ ΠΎΠ±ΡΡΠ½ΡΠΉ ΡΠ»Π°ΠΉΠ΄Π΅Ρ jQuery, ΠΈΠ½Π°ΡΠ΅ ΠΌΡ Π±Ρ Π½Π΅ Π²ΠΊΠ»ΡΡΠΈΠ»ΠΈ Π΅Π³ΠΎ! Turntable — ΡΡΠΎ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΡΡΠ΅ΠΊΡΠΎΠ² Π²ΡΠ°ΡΠ°ΡΡΠ΅Π³ΠΎΡΡ ΡΠ»Π°ΠΉΠ΄Π΅ΡΠ° Π΄Π»Ρ Π²Π°ΡΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΠΊΠΎΠ³Π΄Π° Π²Π°ΡΠΈ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ ΠΏΡΠΎΡΠΌΠ°ΡΡΠΈΠ²Π°ΡΡ Π²Π΅Π±-ΡΠ°ΠΉΡ Π²Π²Π΅ΡΡ ΠΈ Π²Π½ΠΈΠ·, ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊ Turntable Π½Π°Π·ΡΠ²Π°Π΅Ρ ΡΡΠΎ Β«ΡΡΡΠ΅ΠΊΡΠΎΠΌ ΡΠ»ΠΈΠΏΠ±ΡΠΊΠ°Β» ΠΈ, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π΅Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΡΡ ΠΊ ΡΡΠ΄Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠ΄ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΡΡ ΠΎΠ΄ΡΡΠ²ΠΎ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»ΠΈΠΏΠ±ΡΠΊΠ°ΠΌΠΈ. Π΄ΠΈΠ·Π°ΠΉΠ½.ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π΄ΠΎΠ»ΠΆΠ½Ρ Π±ΡΡΡ ΡΠΊΠ°Π·Π°Π½Ρ Π² ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡΠ΅ myTurntable ΠΈ ΠΊΠ»Π°ΡΡΠ΅ turntable ΠΊΠ°ΠΊ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ HTML li. ΠΠ± ΠΎΡΡΠ°Π»ΡΠ½ΠΎΠΌ ΠΏΠΎΠ·Π°Π±ΠΎΡΠΈΡΡΡ Turntable.js. Π’Π°ΠΊΠΆΠ΅ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ CSS, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ Π±ΡΠ» Π³Π»Π°Π΄ΠΊΠΈΠΌ ΠΈ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΠ΅Π»ΡΠ½ΡΠΌ.
Π‘ΠΊΠ°ΡΠ°ΡΡTrix
WYSIWYG ΠΎΠ±ΡΡΠ½ΠΎ Π½Π΅Π½Π°Π΄Π΅ΠΆΠ½Ρ ΠΈ ΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ Π½Π° ΠΎΠ±ΠΎΠ»ΠΎΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π΅ Π±ΡΠ»ΠΈ Π΄ΠΎΠ»ΠΆΠ½ΡΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Π½Ρ Π²ΠΎ Π²ΡΠ΅Ρ Π²Π΅ΡΡΠΈΡΡ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ², ΡΡΠΎ ΡΠΎΠ·Π΄Π°Π΅Ρ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ Ρ ΠΎΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ΅Π΄Π°ΠΊΡΠΎΡ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ° Π² ΡΠ²ΠΎΠΈΡ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡΡ . Trix Π²ΡΠΏΠΎΠ»Π½ΡΠ΅Ρ ΡΡΡ ΡΠ°Π±ΠΎΡΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ WYSIWYG ΠΈ ΡΠ΄Π΅Π»ΡΡ ΠΎΡΠΎΠ±ΠΎΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΡΠ°ΠΊΠΈΠΌ ΡΡΠ½ΠΊΡΠΈΡΠΌ, ΠΊΠ°ΠΊ Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° (Π±Π»ΠΎΠ³ΠΈ, ΡΡΠ°ΡΡΠΈ, ΠΈΡΡΠ»Π΅Π΄ΠΎΠ²Π°Π½ΠΈΡ, ΡΡΠΎ ΡΠ³ΠΎΠ΄Π½ΠΎ!), Π‘ΠΎΡΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΏΠΈΡΠΊΠΎΠ², Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΊΠΎΡΠΎΡΠΊΠΈΡ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠΉ ΠΈ ΠΎΠ±ΡΠΈΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΎΠ².ΠΡ ΠΏΠΎΠ»ΡΡΠ°Π΅ΡΠ΅ ΠΎΠ±ΡΡΠ½ΡΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ ΠΆΠΈΡΠ½ΠΎΠ³ΠΎ ΡΡΠΈΡΡΠ°, ΠΊΡΡΡΠΈΠ²Π°, Π·Π°ΡΠ΅ΡΠΊΠΈΠ²Π°Π½ΠΈΡ, ΡΡΡΠ»ΠΊΠΈ, ΡΠΈΡΠ°ΡΡ, ΡΠΏΠΈΡΠΊΠΎΠ² ΠΈ ΠΎΡΠΌΠ΅Π½Ρ, Π½ΠΎ ΡΠΎΡΡΠ°Π²Π»Π΅Π½Π½ΡΠ΅ ΡΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΡΡΠΎ Π±ΠΎΠ»ΡΡΡΡ ΡΠ°ΡΡΡ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ Π²Ρ ΡΠΎΡΡΠ΅Π΄ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΡΠ΅ΡΡ Π½Π° ΠΏΠΈΡΡΠΌΠ΅, Π° Π½Π΅ Π½Π°ΠΆΠΈΠΌΠ°Π΅ΡΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ Π²Π»Π΅Π²ΠΎ ΠΈ Π²ΠΏΡΠ°Π²ΠΎ.
Trix Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΡΠΈΠ½ΠΈΠΌΠ°Π΅Ρ ΡΠ°ΠΉΠ»Ρ, ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π΅ΠΌΡΠ΅ ΠΈΠ»ΠΈ Π²ΡΡΠ°Π²Π»Π΅Π½Π½ΡΠ΅ Π² ΡΠ΅Π΄Π°ΠΊΡΠΎΡ, ΠΈ Π²ΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΈΡ ΠΊΠ°ΠΊ Π²Π»ΠΎΠΆΠ΅Π½ΠΈΡ Π² Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ. ΠΠ°ΠΆΠ΄ΠΎΠ΅ Π²Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡΡΠΈΡΠ°Π΅ΡΡΡ ΠΎΠΆΠΈΠ΄Π°ΡΡΠΈΠΌ, ΠΏΠΎΠΊΠ° Π²Ρ Π½Π΅ ΡΠΎΡ ΡΠ°Π½ΠΈΡΠ΅ Π΅Π³ΠΎ ΡΠ΄Π°Π»Π΅Π½Π½ΠΎ ΠΈ Π½Π΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²ΠΈΡΠ΅ Trix ΠΏΠΎΡΡΠΎΡΠ½Π½ΡΠΉ URL-Π°Π΄ΡΠ΅Ρ. ΠΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΎΠ½ ΠΎΡΠΈΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½ Π½Π° ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ², Π»ΡΡΡΠ΅ Π²ΡΠ΅Π³ΠΎ Π½Π°ΡΠ°ΡΡ Ρ Trix Ρ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ, Π² ΠΊΠΎΡΠΎΡΠΎΠΉ ΠΎΠ±ΡΡΡΠ½ΡΡΡΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠΏΠΎΡΠΎΠ±Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ ΡΡΠ½ΠΊΡΠΈΠΉ Π΄Π»Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΈ Π²Π°ΡΠΈΠΌ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΌ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ΠΌ.ΠΡΠ΄ΡΡΠ΅Π΅ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠΎΠ² ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ° Π²ΡΠ³Π»ΡΠ΄ΠΈΡ Π½Π΅ΠΏΠ»ΠΎΡ ΠΎ Π±Π»Π°Π³ΠΎΠ΄Π°ΡΡ Π»ΡΠ΄ΡΠΌ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π½Π°Π΄ ΡΠ°ΠΊΠΈΠΌΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°ΠΌΠΈ, ΠΊΠ°ΠΊ Trix!
Π‘ΠΊΠ°ΡΠ°ΡΡPush.
jsΠΠΎΠΌΡ Π½ΡΠΆΠ΅Π½ ΡΠ»Π΅ΠΊΡΡΠΎΠ½Π½ΡΠΉ ΠΌΠ°ΡΠΊΠ΅ΡΠΈΠ½Π³, ΠΊΠΎΠ³Π΄Π° Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ push-ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΡΠΌΠΈ ΠΈ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π°ΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ ΠΎ Π½ΠΎΠ²ΠΎΠΌ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ΅ ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡΡ ΠΏΡΡΠΌΠΎ Π½Π° ΠΈΡ ΡΠ°Π±ΠΎΡΠΈΠΉ ΡΡΠΎΠ» ΡΠ²ΠΎΠΈΡ ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠΎΠ²! ΠΡΠΎ Π±ΡΠ΄ΡΡΠ΅Π΅, Π½Π° ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΌΡ ΡΠΌΠΎΡΡΠΈΠΌ, ΠΈ, Π½Π΅ΡΠΎΠΌΠ½Π΅Π½Π½ΠΎ, push-ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΡ ΡΡΠ°Π½ΡΡ Π±ΠΎΠ»Π΅Π΅ ΡΡΠΎΠ²Π΅ΡΡΠ΅Π½ΡΡΠ²ΠΎΠ²Π°Π½Π½ΡΠΌΠΈ, ΡΡΠΎΠ±Ρ Π² Π½ΠΈΡ ΠΌΠΎΠΆΠ½ΠΎ Π±ΡΠ»ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π°Π²Π΅ΡΠ½ΡΠΊΠ° Π·Π°Ρ Π²Π°ΡΠΈΡ ΡΡΠ΅ΡΡ ΡΠ»Π΅ΠΊΡΡΠΎΠ½Π½ΠΎΠ³ΠΎ ΠΌΠ°ΡΠΊΠ΅ΡΠΈΠ½Π³Π° ΠΈ Π²ΡΠ·ΠΎΠ²Π΅Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ Π½ΠΎΠ²ΡΠ΅ ΠΈΠ΄Π΅ΠΈ.ΠΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ ΠΌΠ½ΠΎΠ³ΠΎ Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ² ΡΠΆΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ push-ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΡ, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ±ΡΠ΄ΠΈΡΡ ΡΠ²ΠΎΠΈΡ ΠΏΠΎΡΠ΅ΡΠΈΡΠ΅Π»Π΅ΠΉ ΠΏΠΎΠ΄ΠΏΠΈΡΠ°ΡΡΡΡ Π½Π° ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡΠΎ ΠΏΡΠΎΡΡΠΎΠ΅ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΡΠΏΡΠ°ΡΠΈΠ²Π°Π΅Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ, Ρ ΠΎΡΡΡ Π»ΠΈ ΠΎΠ½ΠΈ ΠΏΠΎΠ΄ΠΏΠΈΡΠ°ΡΡΡΡ Π½Π° ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΡ ΡΠ°Π±ΠΎΡΠ΅Π³ΠΎ ΡΡΠΎΠ»Π°, ΠΈ Π΄Π°Π΅Ρ ΠΈΠΌ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΏΡΠΈΠ½ΡΡΡ ΠΈΠ»ΠΈ ΠΎΡΠΊΠ»ΠΎΠ½ΠΈΡΡ. Π‘ΠΊΠΎΡΠ΅Π΅ Π²ΡΠ΅Π³ΠΎ, ΡΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ Π²Ρ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΎΠ±ΡΠ°ΡΡ Π³ΠΎΡΠ°Π·Π΄ΠΎ Π±ΠΎΠ»ΡΡΠ΅ ΡΠΈΡΠ°ΡΠ΅Π»Π΅ΠΉ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ Π»ΡΠ΄ΡΠΌ Π±ΡΠ΄Π΅Ρ Π»Π΅Π³ΡΠ΅ ΠΏΠΎΠ΄ΠΏΠΈΡΠ°ΡΡΡΡ Π½Π° Π²Π°Ρ ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ.
Push.js Π²Π½Π΅Π΄ΡΡΠ΅Ρ ΡΡΠΈ ΡΡΠ½ΠΊΡΠΈΠΈ ΠΏΡΡΠΌΠΎ Π½Π° Π²Π°ΡΠΈ Π²Π΅Π±-ΡΠ°ΠΉΡΡ ΠΈ Π² ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΏΡΠΎΡΡΠΎΠ³ΠΎ ΠΊΡΠΎΡΡΠ±ΡΠ°ΡΠ·Π΅ΡΠ½ΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π° jQuery. ΠΠ°ΠΌ ΠΏΠΎ-ΠΏΡΠ΅ΠΆΠ½Π΅ΠΌΡ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ Π²ΡΠΏΠΎΠ»Π½ΠΈΡΡ Π²ΡΠ΅ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² Π΄Π»Ρ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠΉ, Π½ΠΎ ΡΡΠΎ ΠΏΠΎΠ»ΠΎΠ²ΠΈΠ½Π° Π΄Π΅Π»Π° ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ ΡΠ΅ΡΠΈΠ»ΠΈ ΠΏΠΎΡΠΊΡΠΏΠ΅ΡΠΈΠΌΠ΅Π½ΡΠΈΡΠΎΠ²Π°ΡΡ Ρ push-ΡΠ²Π΅Π΄ΠΎΠΌΠ»Π΅Π½ΠΈΡΠΌΠΈ. ΠΠ΅ΠΈΠ·Π±Π΅ΠΆΠ½ΠΎ ΠΌΡ ΡΠ²ΠΈΠ΄ΠΈΠΌ, ΡΡΠΎ ΠΌΠ΅Π΄ΠΈΠ°-ΡΠ°ΠΉΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΡΡ Π½Π° ΡΠ°ΠΊΠΎΠΉ ΡΠΎΡΠΌΠ°Ρ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ.
Π‘ΠΊΠ°ΡΠ°ΡΡPlyr
ΠΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΌΡ Π·Π°Π½ΠΈΠΌΠ°Π΅ΠΌΡΡ ΡΠ΅ΠΌΠΎΠΉ Π²ΠΈΠ΄Π΅ΠΎΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, Plyr — ΡΡΠΎ Π»Π΅Π³ΠΊΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ Π²ΡΡΡΠ°ΠΈΠ²Π°Π½ΠΈΡ Π²ΠΈΠ΄Π΅ΠΎ Π΄Π»Ρ Π²ΠΈΠ΄Π΅ΠΎΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° YouTube ΠΈ Vimeo. ΠΠΌΠ΅Ρ ΡΠ°Π·ΠΌΠ΅Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ Π²ΡΠ΅Π³ΠΎ 10 ΠΠ, Plyr Π½Π΅ Π±ΡΠ΄Π΅Ρ ΡΠΈΠ»ΡΠ½ΠΎ ΠΌΠ΅ΡΠ°ΡΡ Π²Π°ΡΠ΅ΠΉ ΡΠ°Π±ΠΎΡΠ΅ Π² ΠΠ½ΡΠ΅ΡΠ½Π΅ΡΠ΅ ΠΈ, Ρ Π΄ΡΡΠ³ΠΎΠΉ ΡΡΠΎΡΠΎΠ½Ρ, ΡΠ²Π΅Π»ΠΈΡΠΈΡ ΡΠ΄ΠΎΠ²ΠΎΠ»ΡΡΡΠ²ΠΈΠ΅ ΠΎΡ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° Π²Π°ΡΠΈΡ ΡΡΡΠ°Π½ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠ°Ρ ΠΌΠ½ΠΎΠ³ΠΎ Π²ΠΈΠ΄Π΅ΠΎΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°.ΠΠ»Π°Π³ΠΎΠ΄Π°ΡΡ Π³ΠΈΠ±ΠΊΠΎΠΉ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π°, Plyr ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅ Π²Π΅Π±-Π±ΡΠ°ΡΠ·Π΅ΡΡ, Π½ΠΎ ΠΈ Π»ΡΠ±ΡΠ΅ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅ ΡΡΡΡΠΎΠΉΡΡΠ²Π°. ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ Π²Π°ΡΡΠΈΡΡΡΡΡΡ ΠΎΡ Π²ΡΠ΅Π³ΠΎ, ΡΡΠΎ Π²Ρ ΠΎΠΆΠΈΠ΄Π°Π΅ΡΠ΅ ΠΎΡ Π½Π°Π΄Π΅ΠΆΠ½ΠΎΠ³ΠΎ Π²ΠΈΠ΄Π΅ΠΎΠΏΠ»Π΅Π΅ΡΠ°, Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ ΡΠ΄ΠΎΠ±Π½ΠΎΠ³ΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°.
ΠΠ°Π³ΡΡΠ·ΠΈΡΡΠΠ½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π°
ΠΡΡΠ΅ΠΊΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π° ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΡΠ°Π½ΠΈΡΠ°ΠΌΠΈ ΡΠ°Π·Π²ΠΈΠ²Π°ΡΡΡΡ ΠΏΠΎ ΠΌΠ΅ΡΠ΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ΡΡ ΠΈΠ·ΡΡΠ°ΡΡ Π½ΠΎΠ²ΡΠ΅ ΡΠΏΠΎΡΠΎΠ±Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ CSS ΠΈ JavaScript Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ°. ΠΠ½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π° — ΡΡΠΎ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· ΡΠ΅Ρ ΠΏΡΠΈΠ΅ΠΌΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠΎΡΠ°ΡΡ Π²ΡΠ·ΠΎΠ² Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ΡΠ°ΠΌ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΠΈ Π²Π΅Π±-ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ.ΠΠ»ΠΈΠ΅Π½ΡΡ ΡΡΠ΅Π±ΡΡΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΡ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ΡΡΠΊΠΈΡ ΡΠ΅ΡΠ΅Π½ΠΈΠΉ Π΄Π»Ρ ΡΠ²ΠΎΠΈΡ ΠΏΡΠΎΠ΅ΠΊΡΠΎΠ², ΠΈ ΡΡΠΎ ΠΈΠΌΠ΅Π΅Ρ ΡΠΌΡΡΠ». Π ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΌ ΠΌΠΈΡΠ΅ Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΠΈΠΌΠ΅ΡΡ ΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΠΎ ΡΠΎΠΌ, ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ Π²Π°Ρ Π΄ΠΈΠ·Π°ΠΉΠ½ Π±ΠΎΠ»Π΅Π΅ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΌ, ΡΠ΅ΠΌ Π΄ΡΡΠ³ΠΈΠ΅. Π’Π°ΠΊΠΆΠ΅ Π²Π°ΠΆΠ½ΠΎ ΠΏΠΎΠ½ΠΈΠΌΠ°ΡΡ, ΡΡΠΎ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΎΠ½Π½ΡΠ΅ ΡΡΡΠ΅ΠΊΡΡ, ΠΊΠ°ΠΊ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ, Π·Π°Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ Π² ΠΌΠΎΠ·Π³Π°Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ Π³ΠΎΡΠ°Π·Π΄ΠΎ Π΄ΠΎΠ»ΡΡΠ΅. Π£Π½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ ΠΎΠΏΡΡ Π»Π΅Π³ΡΠ΅ Π·Π°ΠΏΠΎΠΌΠ½ΠΈΡΡ, ΡΠ΅ΠΌ ΡΠΎ, ΡΡΠΎ Π²Ρ ΡΠΆΠ΅ Π²ΠΈΠ΄Π΅Π»ΠΈ ΡΡΡΡΡΡ ΡΠ°Π·.
ΠΡΠΈ ΡΡΡΠ΅ΠΊΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π° ΡΠ°Π±ΠΎΡΠ°ΡΡ ΠΏΡΠΈ ΠΎΡΠΏΡΠ°Π²ΠΊΠ΅ ΡΠΎΡΠΌΡ, ΠΊΠΎΡΠΎΡΠ°Ρ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΠΈ Π²ΡΠ³ΡΡΠΆΠ°Π΅Ρ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ.ΠΠΎ Ρ Π½Π΅Π±ΠΎΠ»ΡΡΠΈΠΌΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡΠΌΠΈ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΌΠΎΠΆΠ΅Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΠΈ ΡΡΡΠ΅ΠΊΡΡ Π±Π΅ΡΡΠΎΠ²Π½ΠΎΠΉ. ΠΡΠΎ ΡΡΠ°Π±Π°ΡΡΠ²Π°Π΅Ρ Π²ΡΡΠΊΠΈΠΉ ΡΠ°Π·, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΡΡΡΠ°Π½ΠΈΡΡ ΠΈΠ»ΠΈ Π½Π°ΡΠΈΠ½Π°Π΅Ρ Π½ΠΎΠ²ΡΠΉ ΠΎΠ±ΡΠ°ΡΠ½ΡΠΉ Π²ΡΠ·ΠΎΠ². Π§ΡΠΎ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎ, Π΄Π»Ρ Π΄ΠΎΡΡΠΈΠΆΠ΅Π½ΠΈΡ ΡΡΠΎΠ³ΠΎ Π·Π°Π±Π°Π²Π½ΠΎΠ³ΠΎ ΡΡΡΠ΅ΠΊΡΠ° ΠΏΠΎΡΡΠ΅Π±ΠΎΠ²Π°Π»ΠΎΡΡ Π²ΡΠ΅Π³ΠΎ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΡΠΎΠΊ ΠΊΠΎΠ΄Π° ΠΏΠΎ ΡΡΠ°Π²Π½Π΅Π½ΠΈΡ Ρ ΠΎΠ±ΡΠΈΡΠ½ΡΠΌΠΈ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ°ΠΌΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Π°ΠΌ ΠΏΠΎΠ½Π°Π΄ΠΎΠ±ΠΈΠ»ΠΈΡΡ ΡΠ°Π½ΡΡΠ΅.
Π‘ΠΊΠ°ΡΠ°ΡΡMark.
jsΠΠ°Π»ΠΎΠ²Π΅ΡΠΎΡΡΠ½ΠΎ, ΡΡΠΎ Google Π½Π°ΡΠ½Π΅Ρ Π²ΡΠ΄Π΅Π»ΡΡΡ ΠΊΠ»ΡΡΠ΅Π²ΡΠ΅ ΡΠ»ΠΎΠ²Π° Π½Π° ΡΠ²ΠΎΠΈΡ ΡΡΡΠ°Π½ΠΈΡΠ°Ρ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠΎΠ² ΠΏΠΎΠΈΡΠΊΠ°. ΠΠΎ Π² ΠΏΡΠΎΡΠ»ΠΎΠΌ Π³ΠΎΠ΄Ρ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ ΠΏΠ»Π°ΡΡΠΎΡΠΌΡ Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ΄Π΅Π»Π°Π»ΠΈ ΡΡΠΎ.ΠΡΠΎ Π²ΠΊΠ»ΡΡΠ°Π΅Ρ Π² ΡΠ΅Π±Ρ ΠΌΠ΅Π΄ΠΈΠ° ΠΈ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΎΠ½Π½ΡΠ΅ Π²Π΅Π±-ΡΠ°ΠΉΡΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΡΡ ΠΎΠ±ΡΠΈΡΠ½ΡΠ΅ ΡΠΏΠΈΡΠΊΠΈ Π΄Π°Π½Π½ΡΡ , ΠΏΠΎ ΠΊΠΎΡΠΎΡΡΠΌ ΠΌΠΎΠΆΠ½ΠΎ Π²ΡΠΏΠΎΠ»Π½ΡΡΡ ΠΏΠΎΠΈΡΠΊ. ΠΡΠΎΠ±Π»Π΅ΠΌΠ° ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΡΡ ΡΡΠ½ΠΊΡΠΈΠΉ ΠΏΠΎΠΈΡΠΊΠ° Π² ΡΠΎΠΌ, ΡΡΠΎ ΠΎΠ½ΠΈ Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ Π²ΠΎΠ·Π²ΡΠ°ΡΠ°ΡΡ Ρ ΠΎΡΠΎΡΠΈΠ΅ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΡ. ΠΠ°ΠΏΡΠΎΡΠΈΠ², ΠΎΠ½ΠΈ Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ Π²ΡΠ΄Π΅Π»ΡΡΡ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΡΠ»ΠΎΠ²Π°, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ ΠΈΡΠ΅ΡΠ΅. ΠΡ ΠΏΠΎΠΏΠ°Π΄Π°Π΅ΡΠ΅ Π² ΡΠΈΡΡΠ°ΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Π°ΠΌ Π½Π΅ Π½ΡΠΆΠ½Ρ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Ρ Π²Π°Ρ 5 ΡΡΡΠ°Π½ΠΈΡ, Π½ΠΎ Π²Ρ Π½Π΅ Π·Π½Π°Π΅ΡΠ΅, ΠΊΠ°ΠΊ ΠΏΠ΅ΡΠ΅ΠΉΡΠΈ ΠΊ ΠΊΠ»ΡΡΠ΅Π²ΠΎΠΌΡ ΡΠ»ΠΎΠ²Ρ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²Ρ ΠΈΡΠΊΠ°Π»ΠΈ.
ΠΠΎΡ Π³Π΄Π΅ Mark.js ΡΡΠ΅Π·Π²ΡΡΠ°ΠΉΠ½ΠΎ ΠΏΠΎΠ»Π΅Π·Π΅Π½. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΡΡ Π΅Π³ΠΎ ΠΊ Π»ΡΠ±ΠΎΠΉ ΡΡΡΠ°Π½ΠΈΡΠ΅ Ρ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ, Π³Π΄Π΅ ΡΡΠ½ΠΊΡΠΈΡ ΠΏΠΎΠΈΡΠΊΠ° Π±ΡΠ΄Π΅Ρ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠ°.ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, ΠΎΠ½ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π²ΡΠ΄Π΅Π»ΡΠ΅Ρ ΠΈΡΠΊΠΎΠΌΡΠ΅ ΠΊΠ»ΡΡΠ΅Π²ΡΠ΅ ΡΠ»ΠΎΠ²Π° Π² ΡΠ΅ΠΆΠΈΠΌΠ΅ ΡΠ΅Π°Π»ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ ΠΈΠ»ΠΈ ΠΏΠΎΡΠ»Π΅ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠΎΠΈΡΠΊΠ°. ΠΠ½ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Ρ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠΉ Π² Π±Π»ΠΎΠ³Π΅, Π° ΡΠ°ΠΊΠΆΠ΅ Ρ ΡΠ°Π±Π»ΠΈΡΠ°ΠΌΠΈ Π΄Π°Π½Π½ΡΡ ΠΈ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠΌΠΈ Π½Π°Π±ΠΎΡΠ°ΠΌΠΈ Π΄Π°Π½Π½ΡΡ .
Π‘ΠΊΠ°ΡΠ°ΡΡBalance Text
ΠΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° Π±Π΅Π· ΠΎΠ±ΠΎΡΠ½ΠΎΠ²Π°Π½ΠΈΡ ΠΌΠΎΠΆΠ΅Ρ ΡΠ°Π·Π΄ΡΠ°ΠΆΠ°ΡΡ Π³Π»Π°Π·Π°. ΠΡ Π΄ΠΎΠ»ΠΆΠ½Ρ ΠΏΠΎΠΌΠ½ΠΈΡΡ, ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ Β«ΠΎΠ±ΠΎΡΠ½ΠΎΠ²Π°Π½ΠΈΡΒ» Π΄Π»Ρ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° Π½Π΅ Π²ΡΠ΅Π³Π΄Π° ΡΠ²Π»ΡΠ΅ΡΡΡ Π»ΡΡΡΠΈΠΌ Π²ΡΠ±ΠΎΡΠΎΠΌ. ΠΡΠΎ ΠΌΠΎΠΆΠ΅Ρ Π·Π°ΡΡΡΠ΄Π½ΠΈΡΡ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ, ΡΠΎΠ·Π΄Π°Π²Π°Ρ ΡΠ»ΠΈΡΠΊΠΎΠΌ ΡΡΡΠ΄Π½ΡΠ΅ Π΄Π»Ρ ΡΡΠ΅Π½ΠΈΡ ΠΏΡΠΎΠ±Π΅Π»Ρ, ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ .Π₯ΠΎΡΡ Balance Text ΠΏΡΡΠ°Π΅ΡΡΡ ΡΠ΅ΡΠΈΡΡ ΡΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΈΠ½ΡΠ΅Π»Π»Π΅ΠΊΡΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ Π°Π»Π³ΠΎΡΠΈΡΠΌΠ°. ΠΡΠΎ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΡ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΡΡ ΡΠ±Π°Π»Π°Π½ΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΡΡΡ Π²ΡΠ΅Π³ΠΎ ΡΠ΅ΠΊΡΡΠ° Π² ΠΊΠ°ΠΆΠ΄ΠΎΠΌ Π°Π±Π·Π°ΡΠ΅. ΠΠΎΠΈΠ³ΡΠ°ΠΉΡΠ΅ Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠ΅ΠΉ, ΠΊΠΎΡΠΎΡΡΡ Π²Ρ Π²ΠΈΠ΄ΠΈΡΠ΅ Π²ΡΡΠ΅, ΠΈ Π΄Π²Π°ΠΆΠ΄Ρ ΠΏΡΠΎΠ²Π΅ΡΡΡΠ΅ ΡΠΈΠΏ ΡΡΡΠ΅ΠΊΡΠ° jQuery. ΠΡΠΎ Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΡΠ»ΡΡΡΠΈΡΡ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ Π΄Π»Ρ Π²ΡΠ΅Ρ , Π° Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ Π΄Π»Ρ Π²Π°Ρ. (Π§ΡΠΎ ΠΈΠ½ΠΎΠ³Π΄Π° Π±ΡΠ²Π°Π΅Ρ!)
Π‘ΠΊΠ°ΡΠ°ΡΡFilterizr
Π₯ΠΎΡΠΈΡΠ΅ ΡΠΎΠ·Π΄Π°ΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ ΠΌΠ°Π»Π΅Π½ΡΠΊΡΡ ΠΈΠΌΠΏΠ΅ΡΠΈΡ Instagram? Filterizr ΠΌΠΎΠΆΠ΅Ρ Π²ΠΎΠΏΠ»ΠΎΡΠΈΡΡ ΡΡΡ ΠΌΠ΅ΡΡΡ Π² ΡΠ΅Π°Π»ΡΠ½ΠΎΡΡΡ! ΠΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ jQuery, ΠΊΠΎΡΠΎΡΡΠΉ ΠΌΠΎΠΆΠ΅Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ ΠΏΠΎ ΠΏΠ°ΠΏΠΊΠ°ΠΌ Π²Π°ΡΠ΅ΠΉ Π³Π°Π»Π΅ΡΠ΅ΠΈ ΠΈ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡ ΠΊ Π½ΠΈΠΌ ΠΊΡΠ°ΡΠΈΠ²ΡΠ΅ ΡΠΈΠ»ΡΡΡΡ.ΠΠ±ΡΡΠ½ΠΎ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ΡΡ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡ ΡΡΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Photoshop ΠΈ Illustrator. ΠΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°Π½ Π΄Π»Ρ ΡΠ΄ΠΎΠ±ΡΡΠ²Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ ΠΈ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΠΈ.
Π‘ΠΊΠ°ΡΠ°ΡΡBricks.
jsΠ‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΌΠ°ΠΊΠ΅ΡΠΎΠ² ΠΊΠ»Π°Π΄ΠΊΠΈ (ΡΠ΅ΡΠΊΠΈ) Π½Π΅ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±ΡΡΡ ΡΠ»ΠΎΠΆΠ½ΠΎΠΉ Π·Π°Π΄Π°ΡΠ΅ΠΉ! ΠΡ ΠΆΠΈΠ²Π΅ΠΌ Π² ΡΠΏΠΎΡ Ρ Π²Π΅Π±-ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ ΠΈ JavaScript, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠΏΡΠΎΡΠ°Π΅Ρ ΠΆΠΈΠ·Π½Ρ. ΠΠΎΠ½Π΅ΡΠ½ΠΎ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Bootstrap Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΌΠ°ΠΊΠ΅ΡΠ° ΡΠ΅ΡΠΊΠΈ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΠΎ. ΠΠΎ ΠΊΠ°ΠΊ ΡΠ°ΡΡΠΎ Π²Π°ΡΠΈ ΠΊΠ»ΠΈΠ΅Π½ΡΡ Π²ΡΠ΅ ΡΠ°Π²Π½ΠΎ Ρ ΠΎΡΡΡ, ΡΡΠΎΠ±Ρ Π²Ρ ΡΠ°Π±ΠΎΡΠ°Π»ΠΈ Ρ Bootstrap? Bricks.js — ΡΡΠΎ ΠΌΠ³Π½ΠΎΠ²Π΅Π½Π½ΡΠΉ Π³Π΅Π½Π΅ΡΠ°ΡΠΎΡ ΠΌΠ°ΠΊΠ΅ΡΠΎΠ² Π΄Π»Ρ ΠΏΡΠΎΠ΅ΠΊΡΠΎΠ² ΡΠΈΠΏΠ° ΠΊΠΈΡΠΏΠΈΡΠ½ΠΎΠΉ ΠΊΠ»Π°Π΄ΠΊΠΈ.Π‘ΡΠ΄Π° Π²Ρ ΠΎΠ΄ΡΡ Π³Π°Π»Π΅ΡΠ΅ΠΈ, ΠΏΠΎΡΡΡΠΎΠ»ΠΈΠΎ ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Ρ Π² Π²ΠΈΠ΄Π΅ ΠΊΠ°ΡΡΠΎΡΠ΅ΠΊ, Π³Π΄Π΅ ΠΊΠΎΠ½ΡΠ΅Π½Ρ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π² ΠΌΠ½ΠΎΠ³ΠΎΠΊΠΎΠ»ΠΎΠ½ΠΎΡΠ½ΠΎΠΉ ΡΠ΅ΡΠΊΠ΅ Ρ ΠΊΠ°ΡΡΠΎΡΠΊΠ°ΠΌΠΈ Π½Π° Π½ΠΈΡ . ΠΠ²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΉ Π³Π΅Π½Π΅ΡΠ°ΡΠΎΡ ΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΊΠ°Π·Π°ΡΡ ΡΠΎΡΠ½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ Π±Π»ΠΎΠΊΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Π²Π°ΠΌ Π½ΡΠΆΠ½Ρ. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π²Ρ ΠΏΠΎΠ»ΡΡΠΈΡΠ΅ Π³ΠΎΡΠΎΠ²ΡΠΉ ΠΌΠ°ΠΊΠ΅Ρ ΠΌΠ΅Π½Π΅Π΅ ΡΠ΅ΠΌ Π·Π° ΡΠ΅ΠΊΡΠ½Π΄Ρ.
Π‘ΠΊΠ°ΡΠ°ΡΡΠΠ»Π°ΡΡΠ½ΡΠ΅ ΠΏΡΠ΅ΠΌΠΈΡΠΌ-ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΈ ΡΡΡΠ΅ΠΊΡΡ jQuery
Wow! ΠΠ°ΠΊΠΎΠΉ ΡΠ°Π·Π½ΠΎΡΡΠΎΡΠΎΠ½Π½ΠΈΠΉ ΠΎΠ±Π·ΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² jQuery ΠΈ ΡΡΡΠ΅ΠΊΡΠΎΠ² jQuery, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π°Π²Π΅ΡΠ½ΡΠΊΠ° Π·Π°ΡΡΠ°Π²ΠΈΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ ΠΎΡΠ΅Π½ΠΈΡΡ Π²Π°Ρ ΠΏΡΠΎΠ΄ΡΠΌΠ°Π½Π½ΡΠΉ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ ΠΊ Π΄ΠΈΠ·Π°ΠΉΠ½Ρ.ΠΠ°ΠΆΠ΅ ΠΏΠΎΡΠΊΡΠΏΠ΅ΡΠΈΠΌΠ΅Π½ΡΠΈΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ Ρ Π½ΠΈΠΌΠΈ, Π²Ρ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ Π»ΡΡΡΠ΅ ΠΏΠΎΠ½ΡΡΡ, ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π΄Π»Ρ Π²Π°ΡΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ°. Π ΠΊΠΎΠ½Π΅ΡΠ½ΠΎΠΌ ΠΈΡΠΎΠ³Π΅ ΡΡΠΎ ΠΌΠΎΠΆΠ΅Ρ ΡΡΠ°ΡΡ Π²Π°ΡΠΈΠΌ ΡΡΠ°Π»ΠΎΠ½ΠΎΠΌ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅ΡΠ΅ ΡΠ΅Π±Π΅ ΠΏΡΠΎΡΠ΅ΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΉ ΠΈ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½. ΠΡ ΠΏΡΡΠ°Π»ΠΈΡΡ ΡΠΎΡΡΠ΅Π΄ΠΎΡΠΎΡΠΈΡΡΡΡ Π½Π° ΠΊΡΡΡΡΡ Π²Π΅ΡΠ°Ρ , Π½ΠΎ ΠΈΠ½ΠΎΠ³Π΄Π° ΠΊΡΡΡΠΎ ΡΠ°ΠΊΠΆΠ΅ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ ΠΎΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΠΈ. ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ»ΡΡΡΠΈΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΎΠΏΡΡ, ΠΊΠΎΡΠΎΡΡΠΉ Π²Ρ ΡΠΆΠ΅ Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅ΡΠ΅. Π§ΡΠΎΠ±Ρ Π±ΡΠ»ΠΎ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎ, ΠΌΡ Ρ ΠΎΡΠΈΠΌ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ Π²Π°ΠΌ Π½Π°Π±ΠΎΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ jQuery. ΠΡΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π»Π° ΠΊΠΎΠΌΠ°Π½Π΄Π° ΠΏΡΠΎΡΠ΅ΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΡ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠΈΡΡΠΎΠ², ΠΈ ΠΎΠ½ΠΈ ΠΏΡΠ±Π»ΠΈΠΊΡΡΡ ΡΠ²ΠΎΠΈ ΡΠ°Π±ΠΎΡΡ Π½Π° ΠΏΡΠ΅ΠΌΠΈΠ°Π»ΡΠ½ΡΡ ΡΠΎΡΠ³ΠΎΠ²ΡΡ ΠΏΠ»ΠΎΡΠ°Π΄ΠΊΠ°Ρ .ΠΡΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΈΠΌΠ΅ΡΡ ΡΡ ΠΎΠ΄ΡΡΠ²ΠΎ Ρ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΠΌΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°ΠΌΠΈ ΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°ΠΌΠΈ Ρ ΠΎΡΠΊΡΡΡΡΠΌ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΌ ΠΊΠΎΠ΄ΠΎΠΌ. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ ΠΈΠΌΠ΅Π΅Ρ ΡΠ΅Π½Π΄Π΅Π½ΡΠΈΡ Π±ΡΡΡ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ·ΡΡΠΊΠ°Π½Π½ΡΠΌ Π² ΡΠ²ΠΎΠ΅ΠΌ ΠΏΠΎΠ΄Ρ ΠΎΠ΄Π΅ ΠΊ ΡΡΠ½ΠΊΡΠΈΡΠΌ ΠΈ ΠΎΠ±ΡΠ΅ΠΉ Π³ΠΈΠ±ΠΊΠΎΡΡΠΈ Π΄Π»Ρ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ².
Flex Mega Menu
Flex Mega Menu, ΡΠΎΠ·Π΄Π°Π½Π½ΠΎΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Bootstrap, ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ ΠΌΠ°ΡΡΡΠ°Π±Π½ΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ ΠΌΠ΅Π½Ρ Π΄Π»Ρ ΠΏΠ»Π°ΡΡΠΎΡΠΌ ΡΠ»Π΅ΠΊΡΡΠΎΠ½Π½ΠΎΠΉ ΠΊΠΎΠΌΠΌΠ΅ΡΡΠΈΠΈ, Π‘ΠΠ ΠΈ ΠΈΠ·Π΄Π°ΡΠ΅Π»Π΅ΠΉ. ΠΠ½ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ ΠΌΠ΅Π½Ρ ΠΊΠ°ΠΊ ΡΡΠ΅Π΄ΡΡΠ²ΠΎ Π΄Π»Ρ ΠΊΡΠ°ΡΠΊΠΎΠΉ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ ΠΏΠΎ ΡΠ°ΠΉΡΡ Π΄Π»Ρ ΠΏΠΎΠΈΡΠΊΠ° ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° ΠΈ Π΄ΡΡΠ³ΠΈΡ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΡ Π΄Π°Π½Π½ΡΡ . ΠΠΎΠΏΡΠ»ΡΡΠ½ΠΎΡΡΡ ΠΌΠ΅Π³Π°ΠΌΠ΅Π½Ρ, Π±Π΅Π·ΡΡΠ»ΠΎΠ²Π½ΠΎ, ΡΠ°ΡΡΠ΅Ρ.Π’Π΅ΠΏΠ΅ΡΡ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΠΏΠΎΠ½ΠΈΠΌΠ°ΡΡ, ΡΡΠΎ Π½Π° ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅ ΠΎΠ½ΠΈ ΠΌΠΎΠ³ΡΡ ΡΠΏΠ°ΠΊΠΎΠ²Π°ΡΡ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ° Π² ΠΌΠ΅Π½Ρ. Π’Π΅ΠΌ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅, ΠΈΡ ΠΈΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΡ — ΡΡΠΎ ΡΠ°ΡΡΡ ΠΏΡΠ΅ΠΊΡΠ°ΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΎΠΏΡΡΠ°.
Flex Mega Menu ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ Π½Π° Π²ΡΠ±ΠΎΡ 5 ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΡ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΡ Π΅ΠΌ. ΠΠ½ ΠΈΠ½ΡΠ΅Π³ΡΠΈΡΡΠ΅ΡΡΡ Ρ FontAwesome Π΄Π»Ρ Π²ΡΠ΅Ρ Π²Π°ΡΠΈΡ ΠΏΠΎΡΡΠ΅Π±Π½ΠΎΡΡΠ΅ΠΉ Π² Π·Π½Π°ΡΠΊΠ°Ρ ΡΡΠΈΡΡΠΎΠ². Π€Π°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ, ΠΎΠ½ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΠΉ ΠΈ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠΌΠΈ ΡΡΡΡΠΎΠΉΡΡΠ²Π°ΠΌΠΈ ΠΌΠ°Π»ΠΎΠ³ΠΎ ΠΈ Π±ΠΎΠ»ΡΡΠΎΠ³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°. ΠΠ½ ΠΈΠΌΠ΅Π΅Ρ ΡΠ΅ΡΡΡΠ΅ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΡ ΡΡΠΈΠ»Ρ Π΄Π»Ρ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ ΡΡ ΠΌΠ΅Π½Ρ. ΠΠ½ ΠΈΠΌΠ΅Π΅Ρ ΠΈΡΠΊΠ»ΡΡΠΈΡΠ΅Π»ΡΠ½ΡΡ ΠΈΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΡ Ρ AJAX, ΡΠ°ΠΊ ΡΡΠΎ Π»ΡΠ΄ΠΈ ΠΌΠΎΠ³ΡΡ ΠΎΡΠΏΡΠ°Π²Π»ΡΡΡ ΡΠΎΡΠΌΡ ΠΈΠ· ΡΠ°ΠΌΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ.ΠΠΎΠ»Π΅Π΅ ΡΠΎΠ³ΠΎ, Π΅Π³ΠΎ ΠΏΠ°Π½Π΅Π»Ρ Π½Π°ΡΡΡΠΎΠ΅ΠΊ jQuery ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠΈΡΡΠ΅Ρ Π²ΡΠ΅ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΠ΅ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΠΈ, ΠΊΠ°ΠΊ ΡΠΆΠ΅ ΡΠΏΠΎΠΌΠΈΠ½Π°Π»ΠΎΡΡ, ΠΎΡΠ½ΠΎΠ²Π°Π½Π° Π½Π° ΠΌΠ°ΠΊΠ΅ΡΠ΅ ΡΠ΅ΡΠΊΠΈ Bootstrap.
Π‘ΠΊΠ°ΡΠ°ΡΡChartli — Interactive Chart
ΠΡ Π³ΡΠ°ΡΠΈΠΊΠΎΠ² Π½Π΅ ΡΠΉΡΠΈ, Π΅ΡΠ»ΠΈ Π²Ρ ΠΏΠΎΠ½ΠΈΠΌΠ°Π΅ΡΠ΅ ΡΠ΅Π½Π½ΠΎΡΡΡ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠΏΠΎΡΠΎΠ±ΡΡΠ²ΡΠ΅Ρ ΠΈΡΡΠ»Π΅Π΄ΠΎΠ²Π°Π½ΠΈΡΠΌ ΠΈ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΠΎΠΌΡ Π°Π½Π°Π»ΠΈΠ·Ρ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΡΠΈ Π΄Π²Π΅ ΠΈΠ·Π²Π΅ΡΡΠ½ΡΠ΅ ΠΌΠ΅ΡΠΎΠ΄ΠΎΠ»ΠΎΠ³ΠΈΠΈ Π΄Π»Ρ ΡΠ²Π΅Π»ΠΈΡΠ΅Π½ΠΈΡ Π²ΠΎΠ²Π»Π΅ΡΠ΅Π½Π½ΠΎΡΡΠΈ ΠΈ ΠΎΠ±ΠΌΠ΅Π½Π° ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠ΅ΠΉ Π² ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΡΡ . Π‘ Chartli Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ Π½Π° ΡΠ²ΠΎΠΉ ΡΠ°ΠΉΡ Π»ΡΠ±ΡΠ΅ ΡΠΎΡΠΌΡ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌ Ρ ΠΏΠΎΠΌΠΎΡΡΡ jQuery. ΠΠ½ Π½Π΅ Π±Π»ΠΎΠΊΠΈΡΡΠ΅ΡΡΡ ΠΏΡΠΈ ΠΏΡΠΎΡΠΌΠΎΡΡΠ΅ Ρ ΡΠΊΡΠ°Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠ³ΠΎ ΡΡΡΡΠΎΠΉΡΡΠ²Π°. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΡΡΡΠΎΠΈΡΡ Π΅Π³ΠΎ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ Π²Ρ ΠΌΠΎΠ³Π»ΠΈ ΡΠΊΡΠΏΠΎΡΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠ²ΠΎΠΈ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΡ.
Π‘ΠΊΠ°ΡΠ°ΡΡΠΡΠ±ΠΎΡ Π»ΡΡΡΠΈΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ jQuery Π΄Π»Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΡ ΡΡΡΠ΅ΠΊΡΠΎΠ² Π²Π΅Π±-ΡΠ°ΠΉΡΠ°
jQuery — ΡΡΠΎ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΡΠ°ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΠ°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° JavaScript ΠΏΠΎ ΠΌΠ½ΠΎΠ³ΠΈΠΌ Π²Π΅ΡΠΊΠΈΠΌ ΠΏΡΠΈΡΠΈΠ½Π°ΠΌ. Π‘ΡΠ΅Π΄ΠΈ Π½ΠΈΡ — Π΅Π³ΠΎ ΡΡΡΠ΅ΠΊΡΠΈΠ²Π½Π°Ρ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ. ΠΠ½ ΠΌΠΎΠΆΠ΅Ρ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ Π½Π° Π²Π΅Π±-ΡΠ°ΠΉΡ, Π² ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ»ΠΈ ΠΏΡΠΎΠ΅ΠΊΡ, Π΄ΠΎΡΡΡΠΏ ΠΊ ΠΊΠΎΡΠΎΡΡΠΌ ΠΎΡΡΡΠ΅ΡΡΠ²Π»ΡΠ΅ΡΡΡ Ρ ΡΠΎΡΠΊΠΈ Π·ΡΠ΅Π½ΠΈΡ Π²Π΅Π±-ΡΠ°ΠΉΡΠ°. ΠΡ ΠΏΠΎΠ½ΠΈΠΌΠ°Π΅ΠΌ, ΡΡΠΎ ΡΡΠΈ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ ΠΊΠ°ΡΠ°ΡΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ°ΠΌΠΎΠΉ ΠΏΠΎΠ²Π΅ΡΡ Π½ΠΎΡΡΠΈ ΡΠΎΠ³ΠΎ, ΡΡΠΎ ΡΠ°ΠΌ Π΅ΡΡΡ.ΠΡ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΡΡΠΎΠΊΡΡΠΈΡΠΎΠ²Π°Π½Ρ Π½Π° ΠΈΠ΄Π΅Π΅ Π²ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊΡΡΡΡΡ ΠΈ ΠΏΠΎΠ»Π΅Π·Π½ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ². ΠΡΠΈ ΡΡΡΠ΅ΠΊΡΡ ΡΠ»ΡΡΡΠ°Ρ, ΡΠΊΡΠ΅ΠΏΡΡ ΠΈ ΡΠ»ΡΡΡΠ°Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΎΠΏΡΡ, ΠΊΠΎΡΠΎΡΡΠΉ Π²Ρ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅ΡΠ΅ ΠΏΠΎΡΠ΅ΡΠΈΡΠ΅Π»ΡΠΌ ΡΠ²ΠΎΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ°. ΠΠΎΡΠΊΠΎΠ»ΡΠΊΡ Π²ΡΠ΅Π³Π΄Π° Π΅ΡΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ Π΄Π»Ρ ΡΠ»ΡΡΡΠ΅Π½ΠΈΡ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΎΡΡΠ°Π²ΠΈΡΡ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΡΠ²ΠΎΠΈ Π»ΡΠ±ΠΈΠΌΡΠ΅ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ jQuery. ΠΡ Π²Π½ΠΈΠΌΠ°ΡΠ΅Π»ΡΠ½ΠΎ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ Π²Π°ΡΠΈ ΠΏΡΠ΅Π΄Π»ΠΎΠΆΠ΅Π½ΠΈΡ.
JavaScript Β· Bootstrap
ΠΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΡΠΉ ΠΈΠ»ΠΈ ΡΠΎΡΡΠ°Π²Π½ΠΎΠΉ
ΠΠ»Π°Π³ΠΈΠ½Ρ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ Π²ΠΊΠ»ΡΡΠ΅Π½Ρ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΠΎ (Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π° *. js
) ΠΈΠ»ΠΈ Π²ΡΠ΅ ΡΡΠ°Π·Ρ (ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ bootstrap.js
ΠΈΠ»ΠΈ ΠΌΠΈΠ½ΠΈΡΠΈΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ bootstrap.min.js
).
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠΊΠΎΠΌΠΏΠΈΠ»ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ JavaScript
Π bootstrap.js,
, ΠΈ bootstrap.min.js
ΡΠΎΠ΄Π΅ΡΠΆΠ°Ρ Π²ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π² ΠΎΠ΄Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅. ΠΠΊΠ»ΡΡΠΈΡΠ΅ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½.
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ²
ΠΠ΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΈ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ CSS Π·Π°Π²ΠΈΡΡΡ ΠΎΡ Π΄ΡΡΠ³ΠΈΡ
ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ². ΠΡΠ»ΠΈ Π²Ρ Π²ΠΊΠ»ΡΡΠ°Π΅ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΏΠΎ ΠΎΡΠ΄Π΅Π»ΡΠ½ΠΎΡΡΠΈ, ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ ΠΏΡΠΎΠ²Π΅ΡΡΡΠ΅ Π½Π°Π»ΠΈΡΠΈΠ΅ ΡΡΠΈΡ
Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ Π² Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ.Π’Π°ΠΊΠΆΠ΅ ΠΎΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ Π²ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π·Π°Π²ΠΈΡΡΡ ΠΎΡ jQuery (ΡΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ jQuery Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±ΡΡΡ Π²ΠΊΠ»ΡΡΠ΅Π½ ΠΏΠ΅ΡΠ΅Π΄ ΡΠ°ΠΉΠ»Π°ΠΌΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Π°). ΠΠ±ΡΠ°ΡΠΈΡΠ΅ΡΡ ΠΊ Π½Π°ΡΠ΅ΠΌΡ bower.json
, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ, ΠΊΠ°ΠΊΠΈΠ΅ Π²Π΅ΡΡΠΈΠΈ jQuery ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ.
ΠΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π²ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Bootstrap ΡΠΎΠ»ΡΠΊΠΎ ΡΠ΅ΡΠ΅Π· API ΡΠ°Π·ΠΌΠ΅ΡΠΊΠΈ, Π½Π΅ Π½Π°ΠΏΠΈΡΠ°Π² Π½ΠΈ ΠΎΠ΄Π½ΠΎΠΉ ΡΡΡΠΎΡΠΊΠΈ JavaScript. ΠΡΠΎ ΠΏΠ΅ΡΠ²ΠΎΠΊΠ»Π°ΡΡΠ½ΡΠΉ API Bootstrap, ΠΈ Π²Ρ Π΄ΠΎΠ»ΠΆΠ½Ρ Π² ΠΏΠ΅ΡΠ²ΡΡ ΠΎΡΠ΅ΡΠ΅Π΄Ρ ΡΡΠΈΡΡΠ²Π°ΡΡ Π΅Π³ΠΎ ΠΏΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Π°.
Π’Π΅ΠΌ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅, Π² Π½Π΅ΠΊΠΎΡΠΎΡΡΡ
ΡΠΈΡΡΠ°ΡΠΈΡΡ
ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΡΡΠ΅Π±ΠΎΠ²Π°ΡΡΡΡ ΠΎΡΠΊΠ»ΡΡΠΈΡΡ ΡΡΡ ΡΡΠ½ΠΊΡΠΈΡ.Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΌΡ ΡΠ°ΠΊΠΆΠ΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅ΠΌ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΎΡΠΊΠ»ΡΡΠΈΡΡ API Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
, ΠΎΡΠΊΠ»ΡΡΠΈΠ² Π²ΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ Π² Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ΅ Ρ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎΠΌ ΠΈΠΌΠ΅Π½ data-api
. ΠΡΠΎ Π²ΡΠ³Π»ΡΠ΄ΠΈΡ ΡΠ°ΠΊ:
$ (document) .off ('. Data-api')
Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Ρ, ΡΡΠΎΠ±Ρ Π½Π°ΡΡΡΠΎΠΈΡΡ ΡΠ°ΡΠ³Π΅ΡΠΈΠ½Π³ Π½Π° ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΏΡΠΎΡΡΠΎ Π²ΠΊΠ»ΡΡΠΈΡΠ΅ ΠΈΠΌΡ ΠΏΠ»Π°Π³ΠΈΠ½Π° Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²Π° ΠΈΠΌΠ΅Π½ Π²ΠΌΠ΅ΡΡΠ΅ Ρ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎΠΌ ΠΈΠΌΠ΅Π½ data-api, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ:
$ (Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ) .off ('. Alert.data-api')
Π’ΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½ ΠΏΠ»Π°Π³ΠΈΠ½ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ ΠΈΠ· Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Π² ΠΎΠ΄Π½ΠΎΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅.ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΊΠ½ΠΎΠΏΠΊΠ° Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎ ΠΈΠΌΠ΅ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ ΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΎΠ±ΠΎΡΠ°ΡΠΈΠ²Π°ΡΡΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ.
ΠΡΠΎΠ³ΡΠ°ΠΌΠΌΠ½ΡΠΉ API
ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΡΡΠΈΡΠ°Π΅ΠΌ, ΡΡΠΎ Π²Ρ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π²ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Bootstrap ΡΠΎΠ»ΡΠΊΠΎ ΡΠ΅ΡΠ΅Π· JavaScript API. ΠΡΠ΅ ΠΎΠ±ΡΠ΅Π΄ΠΎΡΡΡΠΏΠ½ΡΠ΅ API-ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΡ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΡΡ ΡΠΎΠ±ΠΎΠΉ Π΅Π΄ΠΈΠ½ΡΠ΅, ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½ΡΠ΅ΠΌΡΠ΅ Π² ΡΠ΅ΠΏΠΎΡΠΊΠΈ ΠΌΠ΅ΡΠΎΠ΄Ρ ΠΈ Π²ΠΎΠ·Π²ΡΠ°ΡΠ°ΡΡ ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΡ, Π½Π° ΠΊΠΎΡΠΎΡΡΡ Π±ΡΠ»ΠΈ Π²ΡΠΏΠΎΠ»Π½Π΅Π½Ρ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ.
$ ('. Btn.danger'). Button ('toggle'). AddClass ('fat')
ΠΡΠ΅ ΠΌΠ΅ΡΠΎΠ΄Ρ Π΄ΠΎΠ»ΠΆΠ½Ρ ΠΏΡΠΈΠ½ΠΈΠΌΠ°ΡΡ Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΉ ΠΎΠ±ΡΠ΅ΠΊΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ², ΡΡΡΠΎΠΊΡ, Π½Π°ΡΠ΅Π»Π΅Π½Π½ΡΡ Π½Π° ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΡΠΉ ΠΌΠ΅ΡΠΎΠ΄, ΠΈΠ»ΠΈ Π½ΠΈΡΠ΅Π³ΠΎ (ΡΡΠΎ ΠΈΠ½ΠΈΡΠΈΠΈΡΡΠ΅Ρ ΠΏΠ»Π°Π³ΠΈΠ½ Ρ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ΠΌ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ):
$ ('# myModal').modal () // ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·ΠΈΡΡΠ΅ΡΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΡΠΌΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ
$ ('# myModal'). modal ({keyboard: false}) // ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·ΠΈΡΡΠ΅ΡΡΡ Π±Π΅Π· ΠΊΠ»Π°Π²ΠΈΠ°ΡΡΡΡ
$ ('# myModal'). modal ('show') // Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·ΠΈΡΡΠ΅Ρ ΠΈ Π²ΡΠ·ΡΠ²Π°Π΅Ρ show
ΠΠ°ΠΆΠ΄ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ ΡΠ°ΠΊΠΆΠ΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠ²ΠΎΠΉ Π½Π΅ΠΎΠ±ΡΠ°Π±ΠΎΡΠ°Π½Π½ΡΠΉ ΠΊΠΎΠ½ΡΡΡΡΠΊΡΠΎΡ Π² ΡΠ²ΠΎΠΉΡΡΠ²Π΅ Constructor
: $ .fn.popover.Constructor
. ΠΡΠ»ΠΈ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΡΠΉ ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½Π°, ΠΏΠΎΠ»ΡΡΠΈΡΠ΅ Π΅Π³ΠΎ ΠΏΡΡΠΌΠΎ ΠΈΠ· ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°: $ ('[rel = "popover"]'). Data ('popover')
.
ΠΠ°ΡΡΡΠΎΠΉΠΊΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ
ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π΄Π»Ρ ΠΏΠ»Π°Π³ΠΈΠ½Π°, ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ² Π΅Π³ΠΎ ΠΊΠΎΠ½ΡΡΡΡΠΊΡΠΎΡ . DEFAULTS
ΠΎΠ±ΡΠ΅ΠΊΡ:
$ .fn.modal.Constructor.DEFAULTS.keyboard = false // ΠΈΠ·ΠΌΠ΅Π½ΡΠ΅Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π΄Π»Ρ ΠΎΠΏΡΠΈΠΈ `keyboard` ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π° Π½Π° false
ΠΠ΅Ρ ΠΊΠΎΠ½ΡΠ»ΠΈΠΊΡΠ°
ΠΠ½ΠΎΠ³Π΄Π° Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Bootstrap Ρ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠ°ΠΌΠΈ UI. Π ΡΡΠΈΡ
ΠΎΠ±ΡΡΠΎΡΡΠ΅Π»ΡΡΡΠ²Π°Ρ
ΠΈΠ½ΠΎΠ³Π΄Π° ΠΌΠΎΠ³ΡΡ Π²ΠΎΠ·Π½ΠΈΠΊΠ°ΡΡ ΠΊΠΎΠ½ΡΠ»ΠΈΠΊΡΡ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ² ΠΈΠΌΠ΅Π½.ΠΡΠ»ΠΈ ΡΡΠΎ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΡΠ·Π²Π°ΡΡ .noConflict
Π² ΠΏΠ»Π°Π³ΠΈΠ½Π΅, Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ Π²Π΅ΡΠ½ΡΡΡ.
var bootstrapButton = $ .fn.button.noConflict () // Π²Π΅ΡΠ½ΡΡΡ $ .fn.button ΠΊ ΡΠ°Π½Π΅Π΅ ΠΏΡΠΈΡΠ²ΠΎΠ΅Π½Π½ΠΎΠΌΡ Π·Π½Π°ΡΠ΅Π½ΠΈΡ
$ .fn.bootstrapBtn = bootstrapButton // Π΄Π°ΡΡ $ (). bootstrapBtn ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ Bootstrap
Π‘ΠΎΠ±ΡΡΠΈΡ
Bootstrap ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ Π΄Π»Ρ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΡ
Π΄Π΅ΠΉΡΡΠ²ΠΈΠΉ Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²Π° ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ². ΠΠ°ΠΊ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ, ΠΎΠ½ΠΈ Π±ΡΠ²Π°ΡΡ Π² ΡΠΎΡΠΌΠ΅ ΠΈΠ½ΡΠΈΠ½ΠΈΡΠΈΠ²Π° ΠΈ ΠΏΡΠΈΡΠ°ΡΡΠΈΡ ΠΏΡΠΎΡΠ΅Π΄ΡΠ΅Π³ΠΎ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ, Π³Π΄Π΅ ΠΈΠ½ΡΠΈΠ½ΠΈΡΠΈΠ² (Π½Π°ΠΏΡ. show
) Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π² Π½Π°ΡΠ°Π»Π΅ ΡΠΎΠ±ΡΡΠΈΡ, Π° Π΅Π³ΠΎ ΡΠΎΡΠΌΠ° ΠΏΡΠΈΡΠ°ΡΡΠΈΡ ΠΏΡΠΎΡΠ΅Π΄ΡΠ΅Π³ΠΎ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ
) Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΠΏΡΠΈ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΠΈ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ.
ΠΠ°ΡΠΈΠ½Π°Ρ Ρ 3.0.0, Π²ΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ Bootstrap ΠΈΠΌΠ΅ΡΡ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΈΠΌΠ΅Π½.
ΠΡΠ΅ ΠΈΠ½ΡΠΈΠ½ΠΈΡΠΈΠ²Π½ΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°ΡΡ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ preventDefault
. ΠΡΠΎ Π΄Π°Π΅Ρ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΎΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ Π΄ΠΎ Π΅Π³ΠΎ Π·Π°ΠΏΡΡΠΊΠ°.
$ ('# myModal'). On ('show.bs.modal', function (e) {
if (! data) return e.preventDefault () // ΠΎΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π°
})
ΠΠ΅Π·ΠΈΠ½ΡΠΈΡΠΈΡΡΡΡΠ΅Π΅ ΡΡΠ΅Π΄ΡΡΠ²ΠΎ
ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ Π½Π°ΡΠ΅ Π²ΡΡΡΠΎΠ΅Π½Π½ΠΎΠ΅ ΡΡΠ΅Π΄ΡΡΠ²ΠΎ ΠΎΡΠΈΡΡΠΊΠΈ Π΄Π»Ρ ΠΎΡΠΈΡΡΠΊΠΈ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΡΠΈΠ½ΠΈΠΌΠ°ΡΡ HTML.Π°ΡΠΈΡ — [\ w -] * $ / i var DefaultWhitelist = { // ΠΠ»ΠΎΠ±Π°Π»ΡΠ½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½Ρ Π΄Π»Ρ Π»ΡΠ±ΠΎΠ³ΠΎ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠ³ΠΎ Π½ΠΈΠΆΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ‘*’: [‘ΠΊΠ»Π°ΡΡ’, ‘ΠΊΠ°ΡΠ°Π»ΠΎΠ³’, ‘ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡ’, ‘ΡΠ·ΡΠΊ’, ‘ΡΠΎΠ»Ρ’, ARIA_ATTRIBUTE_PATTERN], a: [‘target’, ‘href’, ‘title’, ‘rel’], ΠΏΠ»ΠΎΡΠ°Π΄Ρ: [], b: [], br: [], col: [], ΠΊΠΎΠ΄: [], div: [], em: [], ΡΠ°Ρ: [], h2: [], h3: [], h4: [], h5: [], h5: [], h6: [], Ρ: [], img: [‘src’, ‘alt’, ‘title’, ‘width’, ‘height’], li: [], ΠΎΠ»: [], ΠΏ: [], pre: [], s: [], ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΠΉ: [], ΠΎΡ Π²Π°ΡΡΠ²Π°ΡΡ: [], sub: [], ΠΠ°ΠΊ Π΄Π΅Π»Π°: [], ΡΠΈΠ»ΡΠ½ΡΠΉ: [], u: [], ul: [] }
ΠΡΠ»ΠΈ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π½ΠΎΠ²ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΊ ΡΡΠΎΠΌΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ whiteList
, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π΅:
var myDefaultWhiteList = $.data-my-app - [\ w -] + /
myDefaultWhiteList ['*']. push (myCustomRegex)
ΠΡΠ»ΠΈ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ ΠΎΠ±ΠΎΠΉΡΠΈ Π½Π°ΡΠ΅ ΡΡΠ΅Π΄ΡΡΠ²ΠΎ ΠΎΡΠΈΡΡΠΊΠΈ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ Π²Ρ ΠΏΡΠ΅Π΄ΠΏΠΎΡΠΈΡΠ°Π΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π²ΡΠ΄Π΅Π»Π΅Π½Π½ΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ DOMPurify, Π²Ρ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π΅:
$ ('# yourTooltip'). Tooltip ({
sanitizeFn: function (content) {
Π²Π΅ΡΠ½ΡΡΡ DOMPurify.sanitize (ΠΊΠΎΠ½ΡΠ΅Π½Ρ)
}
})
ΠΡΠ°ΡΠ·Π΅ΡΡ Π±Π΅Π·
document.implementation.createHTMLDocument
Π ΡΠ»ΡΡΠ°Π΅ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ², Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΠΈΡ
Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ .implementation.createHTMLDocument
, ΠΊΠ°ΠΊ ΠΈ Π² Internet Explorer 8, Π²ΡΡΡΠΎΠ΅Π½Π½Π°Ρ ΡΡΠ½ΠΊΡΠΈΡ ΠΎΡΠΈΡΡΠΊΠΈ Π²ΠΎΠ·Π²ΡΠ°ΡΠ°Π΅Ρ HTML ΠΊΠ°ΠΊ Π΅ΡΡΡ.
ΠΡΠ»ΠΈ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ Π²ΡΠΏΠΎΠ»Π½ΠΈΡΡ Π΄Π΅Π·ΠΈΠ½ΡΠ΅ΠΊΡΠΈΡ Π² ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅, ΡΠΊΠ°ΠΆΠΈΡΠ΅ sanitizeFn
ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π²Π½Π΅ΡΠ½ΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ DOMPurify.
ΠΠΎΠΌΠ΅ΡΠ° Π²Π΅ΡΡΠΈΠΉ
ΠΠΎΡΡΡΠΏ ΠΊ Π²Π΅ΡΡΠΈΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΈΠ· ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Bootstrap jQuery ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΡΠ΅ΡΠ΅Π· ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ VERSION
ΠΊΠΎΠ½ΡΡΡΡΠΊΡΠΎΡΠ° ΠΏΠ»Π°Π³ΠΈΠ½Π°. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π΄Π»Ρ ΠΏΠ»Π°Π³ΠΈΠ½Π° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ:
$.fn.tooltip.Constructor.VERSION // => "3.4.1"
ΠΠΈΠΊΠ°ΠΊΠΈΡ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅Π·Π΅ΡΠ²Π½ΡΡ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ² ΠΏΡΠΈ ΠΎΡΠΊΠ»ΡΡΠ΅Π½Π½ΠΎΠΌ JavaScript
ΠΠ»Π°Π³ΠΈΠ½Ρ Bootstrap Π½Π΅ ΠΎΡΠΎΠ±ΠΎ ΠΈΠ·ΡΡΠ½ΠΎ ΠΎΡΠΊΠ»ΡΡΠ°ΡΡΡΡ ΠΏΡΠΈ ΠΎΡΠΊΠ»ΡΡΠ΅Π½Π½ΠΎΠΌ JavaScript. ΠΡΠ»ΠΈ Π²Ρ Π·Π°Π±ΠΎΡΠΈΡΠ΅ΡΡ ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠΌ ΠΎΠΏΡΡΠ΅ Π² ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅
, ΡΡΠΎΠ±Ρ ΠΎΠ±ΡΡΡΠ½ΠΈΡΡ ΡΠΈΡΡΠ°ΡΠΈΡ (ΠΈ ΠΊΠ°ΠΊ ΠΏΠΎΠ²ΡΠΎΡΠ½ΠΎ Π²ΠΊΠ»ΡΡΠΈΡΡ JavaScript) Π²Π°ΡΠΈΠΌ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΠΌ ΠΈ / ΠΈΠ»ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΡΠ²ΠΎΠΈ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠ΅ ΡΠ΅Π·Π΅ΡΠ²Π½ΡΠ΅ Π²Π°ΡΠΈΠ°Π½ΡΡ.
Π‘ΡΠΎΡΠΎΠ½Π½ΠΈΠ΅ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ
Bootstrap ΠΎΡΠΈΡΠΈΠ°Π»ΡΠ½ΠΎ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΡΡΠΎΡΠΎΠ½Π½ΠΈΠ΅ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠΈ JavaScript , ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ Prototype ΠΈΠ»ΠΈ jQuery UI.ΠΠ΅ΡΠΌΠΎΡΡΡ Π½Π° .noConflict
ΠΈ ΡΠΎΠ±ΡΡΠΈΡ Π² ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²Π΅ ΠΈΠΌΠ΅Π½, ΠΌΠΎΠ³ΡΡ Π²ΠΎΠ·Π½ΠΈΠΊΠ½ΡΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ ΡΠΎΠ²ΠΌΠ΅ΡΡΠΈΠΌΠΎΡΡΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΠΈΡΠΏΡΠ°Π²ΠΈΡΡ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ.
Π ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π°Ρ
ΠΠ»Ρ ΠΏΡΠΎΡΡΡΡ
ΡΡΡΠ΅ΠΊΡΠΎΠ² ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° Π²ΠΊΠ»ΡΡΠΈΡΠ΅ transition.js
ΠΎΠ΄ΠΈΠ½ ΡΠ°Π· Π²ΠΌΠ΅ΡΡΠ΅ Ρ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΡΠ°ΠΉΠ»Π°ΠΌΠΈ JS. ΠΡΠ»ΠΈ Π²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ ΡΠΊΠΎΠΌΠΏΠΈΠ»ΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ (ΠΈΠ»ΠΈ ΠΌΠΈΠ½ΠΈΡΠΈΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ) bootstrap.js
, Π½Π΅Ρ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ Π²ΠΊΠ»ΡΡΠ°ΡΡ Π΅Π³ΠΎ — ΠΎΠ½ ΡΠΆΠ΅ Π΅ΡΡΡ.
Π§ΡΠΎ Π²Π½ΡΡΡΠΈ
Transition.js — ΡΡΠΎ Π±Π°Π·ΠΎΠ²ΡΠΉ ΠΏΠΎΠΌΠΎΡΠ½ΠΈΠΊ Π΄Π»Ρ ΡΠΎΠ±ΡΡΠΈΠΉ transitionEnd
, Π° ΡΠ°ΠΊΠΆΠ΅ ΡΠΌΡΠ»ΡΡΠΎΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° CSS.ΠΠ½ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Π°ΠΌΠΈ Π΄Π»Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΈ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS ΠΈ Π΄Π»Ρ ΠΎΠ±Π½Π°ΡΡΠΆΠ΅Π½ΠΈΡ Π·Π°Π²ΠΈΡΡΠΈΡ
ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ².
ΠΡΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΎΠ²
ΠΠ΅ΡΠ΅Ρ
ΠΎΠ΄Ρ ΠΌΠΎΠΆΠ½ΠΎ Π³Π»ΠΎΠ±Π°Π»ΡΠ½ΠΎ ΠΎΡΠΊΠ»ΡΡΠΈΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π³ΠΎ ΡΡΠ°Π³ΠΌΠ΅Π½ΡΠ° ΠΊΠΎΠ΄Π° JavaScript, ΠΊΠΎΡΠΎΡΡΠΉ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±ΡΡΡ ΠΏΠΎΡΠ»Π΅ Π·Π°Π³ΡΡΠ·ΠΊΠΈ transition.js
(ΠΈΠ»ΠΈ bootstrap.js
ΠΈΠ»ΠΈ bootstrap.min.js
, Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΠΎΠ±ΡΡΠΎΡΡΠ΅Π»ΡΡΡΠ²):
$ .support.transition = false
ΠΠΎΠ΄Π°Π»ΡΠ½ΡΠ΅ ΠΎΠΊΠ½Π° — ΡΡΠΎ ΡΠΏΡΠΎΡΠ΅Π½Π½ΡΠ΅, Π½ΠΎ Π³ΠΈΠ±ΠΊΠΈΠ΅ Π΄ΠΈΠ°Π»ΠΎΠ³ΠΎΠ²ΡΠ΅ ΠΎΠΊΠ½Π° Ρ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΠΎ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡΡ ΠΈ ΠΈΠ½ΡΠ΅Π»Π»Π΅ΠΊΡΡΠ°Π»ΡΠ½ΡΠΌΠΈ Π½Π°ΡΡΡΠΎΠΉΠΊΠ°ΠΌΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ.
ΠΠ΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΎΡΠΊΡΡΡΡΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ ΠΎΠΊΠΎΠ½ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ
ΠΠ΅ ΠΎΡΠΊΡΡΠ²Π°ΠΉΡΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ, ΠΏΠΎΠΊΠ° Π΅ΡΠ΅ Π²ΠΈΠ΄Π½ΠΎ Π΄ΡΡΠ³ΠΎΠ΅. ΠΠ»Ρ ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π±ΠΎΠ»Π΅Π΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ΄.
Π Π°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠΉ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠΈ
ΠΡΠ΅Π³Π΄Π° ΡΡΠ°ΡΠ°ΠΉΡΠ΅ΡΡ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ HTML-ΠΊΠΎΠ΄ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° Π½Π° Π²Π΅ΡΡ Π½Π΅ΠΌ ΡΡΠΎΠ²Π½Π΅ Π² Π²Π°ΡΠ΅ΠΌ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ΅, ΡΡΠΎΠ±Ρ Π΄ΡΡΠ³ΠΈΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ Π½Π΅ Π²Π»ΠΈΡΠ»ΠΈ Π½Π° Π²Π½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄ ΠΈ / ΠΈΠ»ΠΈ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π°.
ΠΠ·-Π·Π° ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ HTML5 ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠ²ΠΎΡ ΡΠ΅ΠΌΠ°Π½ΡΠΈΠΊΡ, Π°ΡΡΠΈΠ±ΡΡ autofocus
HTML Π½Π΅ Π΄Π΅ΠΉΡΡΠ²ΡΠ΅Ρ Π² ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ
ΠΎΠΊΠ½Π°Ρ
Bootstrap. Π§ΡΠΎΠ±Ρ Π΄ΠΎΠ±ΠΈΡΡΡΡ ΡΠΎΠ³ΠΎ ΠΆΠ΅ ΡΡΡΠ΅ΠΊΡΠ°, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ ΠΊΠΎΠ΄ JavaScript:
$ ('# myModal'). On ('shown.bs.modal', function () {
$ ('# myInput'). ΡΠΎΠΊΡΡ ()
})
ΠΡΠΈΠΌΠ΅ΡΡ
Π‘ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ
ΠΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΠΌΠΎΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Ρ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ, ΡΠ΅Π»ΠΎΠΌ ΠΈ Π½Π°Π±ΠΎΡΠΎΠΌ Π΄Π΅ΠΉΡΡΠ²ΠΈΠΉ Π² Π½ΠΈΠΆΠ½Π΅ΠΌ ΠΊΠΎΠ»ΠΎΠ½ΡΠΈΡΡΠ»Π΅.
ΠΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ
ΠΠ΄Π½ΠΎ ΠΏΡΠ΅ΠΊΡΠ°ΡΠ½ΠΎΠ΅ ΡΠ΅Π»ΠΎ & hellip;
ΠΠΈΠ²Π°Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ JavaScript, Π½Π°ΠΆΠ°Π² ΠΊΠ½ΠΎΠΏΠΊΡ Π½ΠΈΠΆΠ΅. ΠΠ½ Π±ΡΠ΄Π΅Ρ ΡΠΊΠΎΠ»ΡΠ·ΠΈΡΡ Π²Π½ΠΈΠ· ΠΈ ΠΈΡΡΠ΅Π·Π°ΡΡ ΠΈΠ· Π²Π΅ΡΡ Π½Π΅ΠΉ ΡΠ°ΡΡΠΈ ΡΡΡΠ°Π½ΠΈΡΡ.
Π’Π΅ΠΊΡΡ Π² ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠΌ ΠΎΠΊΠ½Π΅
Duis mollis, est nonmodo luctus, nisi erat porttitor ligula.
ΠΠΎΠΏΠΎΠ²Π΅Ρ Π² ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠΌ ΠΎΠΊΠ½Π΅
ΠΡΠ° ΠΊΠ½ΠΎΠΏΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Π° Π²ΡΠ·ΡΠ²Π°ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ.
ΠΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Π² ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠΌ ΠΎΠΊΠ½Π΅
ΠΡΠ° ΡΡΡΠ»ΠΊΠ° ΠΈ ΡΡΠ° ΡΡΡΠ»ΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Ρ ΠΈΠΌΠ΅ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ°.
ΠΠ΅ΡΠ΅ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ
Cras mattis Concectetur Purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac conctetur ac, vestibulum at eros.
Praesentmodo cursus magna, vel scelerisque nisl consctetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed Conctetur. Praesentmodo cursus magna, vel scelerisque nisl conctetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Cras mattis Concectetur Purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac conctetur ac, vestibulum at eros.
Praesentmodo cursus magna, vel scelerisque nisl consctetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed Conctetur. Praesentmodo cursus magna, vel scelerisque nisl conctetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Cras mattis Concectetur Purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac conctetur ac, vestibulum at eros.
Praesentmodo cursus magna, vel scelerisque nisl consctetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed Conctetur. Praesentmodo cursus magna, vel scelerisque nisl conctetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
ΠΠ°ΠΏΡΡΡΠΈΡΡ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΎΠ½Π½ΡΠΉ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΡΠ΅ΠΆΠΈΠΌ
ΠΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ
...
Π‘Π΄Π΅Π»Π°ΡΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠ΅ ΠΎΠΊΠ½Π° Π΄ΠΎΡΡΡΠΏΠ½ΡΠΌΠΈ
ΠΠ΅ Π·Π°Π±ΡΠ΄ΡΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ role = "dialog"
ΠΈ aria-labelledby = "..."
ΡΠΎ ΡΡΡΠ»ΠΊΠΎΠΉ Π½Π° ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Π² .modal
ΠΈ role = "document"
Π² .modal- ΡΠ°ΠΌ Π΄ΠΈΠ°Π»ΠΎΠ³
.
ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π΄Π°ΡΡ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ Π²Π°ΡΠ΅Π³ΠΎ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ Π΄ΠΈΠ°Π»ΠΎΠ³Π° Ρ aria, ΠΎΠΏΠΈΡΠ°Π½Π½ΡΠΌ
Π½Π° .modal
.
ΠΡΡΡΠ°ΠΈΠ²Π°Π½ΠΈΠ΅ Π²ΠΈΠ΄Π΅ΠΎ Ρ YouTube
ΠΡΡΡΠ°ΠΈΠ²Π°Π½ΠΈΠ΅ Π²ΠΈΠ΄Π΅ΠΎ YouTube Π² ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠ΅ ΠΎΠΊΠ½Π° ΡΡΠ΅Π±ΡΠ΅Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ JavaScript Π½Π΅ Π² Bootstrap Π΄Π»Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠΉ ΠΎΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΡ ΠΈ Ρ. Π. Π‘ΠΌ. ΠΡΠΎΡ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΏΠΎΡΡ ΠΎ ΠΏΠ΅ΡΠ΅ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΈ ΡΡΠ΅ΠΊΠ° Π΄Π»Ρ ΠΏΠΎΠ»ΡΡΠ΅Π½ΠΈΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠΉ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ.
ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΡ
ΠΠΎΠ΄Π°Π»Ρ ΠΈΠΌΠ΅ΡΡ Π΄Π²Π° Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΡ
ΡΠ°Π·ΠΌΠ΅ΡΠ°, Π΄ΠΎΡΡΡΠΏΠ½ΡΡ
ΡΠ΅ΡΠ΅Π· ΠΊΠ»Π°ΡΡΡ ΠΌΠΎΠ΄ΠΈΡΠΈΠΊΠ°ΡΠΎΡΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ Π½Π° .ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ Π΄ΠΈΠ°Π»ΠΎΠ³
.
ΠΠΎΠ»ΡΡΠΎΠΉ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΠΠ°Π»ΡΠΉ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ
...
...
Π£Π΄Π°Π»ΠΈΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ
ΠΠ»Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ
ΠΎΠΊΠΎΠ½, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΡΠΎΡΡΠΎ ΠΏΠΎΡΠ²Π»ΡΡΡΡΡ, Π° Π½Π΅ ΠΈΡΡΠ΅Π·Π°ΡΡ, ΡΠ΄Π°Π»ΠΈΡΠ΅ ΠΊΠ»Π°ΡΡ .fade
ΠΈΠ· ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠΉ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠΈ.
...
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠΈΡΡΠ΅ΠΌΡ ΡΠ΅ΡΠΎΠΊ
Π§ΡΠΎΠ±Ρ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ ΠΏΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ²Π°ΠΌΠΈ ΡΠΈΡΡΠ΅ΠΌΡ ΡΠ΅ΡΠΎΠΊ Bootstrap Π² ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠΌ ΠΎΠΊΠ½Π΅, ΠΏΡΠΎΡΡΠΎ Π²Π»ΠΎΠΆΠΈΡΠ΅ .row
Π² .modal-body
, Π° Π·Π°ΡΠ΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΎΠ±ΡΡΠ½ΡΠ΅ ΠΊΠ»Π°ΡΡΡ ΡΠΈΡΡΠ΅ΠΌΡ ΡΠ΅ΡΠΎΠΊ.
.col-md-4
.col-md-4 .col-md-offset-4
.col-md-3 .col-md-offset-3
.col-md-2 .col-md-offset-4
.col-md-6 .col-md-offset-3
Π£ΡΠΎΠ²Π΅Π½Ρ 1: .col-sm-9Π£ΡΠΎΠ²Π΅Π½Ρ 2: .col-xs-8 .col-sm-6
Π£ΡΠΎΠ²Π΅Π½Ρ 2: .col-XS-4 .col-sm-6
ΠΠ°ΠΏΡΡΡΠΈΡΡ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΎΠ½Π½ΡΠΉ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΡΠ΅ΠΆΠΈΠΌ
ΠΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ
.col-md-4
.col-md-4 .col-md-offset-4
.col-md-3 .col-md-offset-3
.col-md-2 .col-md-offset-4
.col-md-6 .col-md-offset-3
Π£ΡΠΎΠ²Π΅Π½Ρ 1: .col-sm-9
Π£ΡΠΎΠ²Π΅Π½Ρ 2: .col-XS-8 .col-sm-6
Π£ΡΠΎΠ²Π΅Π½Ρ 2: .col-xs-4 .col-sm-6
Π£ Π²Π°Ρ Π΅ΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΊΠ½ΠΎΠΏΠΎΠΊ, ΠΊΠΎΡΠΎΡΡΠ΅ Π·Π°ΠΏΡΡΠΊΠ°ΡΡ ΠΎΠ΄Π½ΠΎ ΠΈ ΡΠΎ ΠΆΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ, ΡΠΎΠ»ΡΠΊΠΎ Ρ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ°Π·Π½ΡΠΌ ΡΠΎΠ΄Π΅ΡΠΆΠ°Π½ΠΈΠ΅ΠΌ? ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ event.relatedTarget
ΠΈ HTML data- *
(Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, ΡΠ΅ΡΠ΅Π· jQuery), ΡΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊΠ°Ρ ΠΊΠ½ΠΎΠΏΠΊΠ° Π±ΡΠ»Π° Π½Π°ΠΆΠ°ΡΠ°. Π‘ΠΌ. ΠΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ ΠΏΠΎ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΌ ΡΠΎΠ±ΡΡΠΈΡΠΌ Π΄Π»Ρ ΠΏΠΎΠ»ΡΡΠ΅Π½ΠΈΡ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎΠΉ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ ΠΎ relatedTarget
,
...Π±ΠΎΠ»ΡΡΠ΅ ΠΊΠ½ΠΎΠΏΠΎΠΊ ...
ΠΠΎΠ²ΠΎΠ΅ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅
<ΡΠΎΡΠΌΠ°>
$ ('# exampleModal').on ('show.bs.modal', ΡΡΠ½ΠΊΡΠΈΡ (ΡΠΎΠ±ΡΡΠΈΠ΅) {
var button = $ (event.relatedTarget) // ΠΠ½ΠΎΠΏΠΊΠ°, Π·Π°ΠΏΡΡΠΊΠ°ΡΡΠ°Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ
var recipient = button.data ('Any') // ΠΠ·Π²Π»Π΅ΡΡ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ ΠΈΠ· Π°ΡΡΠΈΠ±ΡΡΠΎΠ² data- *
// ΠΡΠΈ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΠ½ΠΈΡΠΈΠΈΡΠΎΠ²Π°ΡΡ Π·Π΄Π΅ΡΡ Π·Π°ΠΏΡΠΎΡ AJAX (Π° Π·Π°ΡΠ΅ΠΌ Π²ΡΠΏΠΎΠ»Π½ΠΈΡΡ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ Π² ΠΎΠ±ΡΠ°ΡΠ½ΠΎΠΌ Π²ΡΠ·ΠΎΠ²Π΅).
// ΠΠ±Π½ΠΎΠ²Π»ΡΠ΅ΠΌ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π°. ΠΠ΄Π΅ΡΡ ΠΌΡ Π±ΡΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ jQuery, Π½ΠΎ Π²ΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΡ ΠΏΡΠΈΠ²ΡΠ·ΠΊΠΈ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΌΠ΅ΡΠΎΠ΄Ρ.
var modal = $ (ΡΡΠΎ)
modal.find ('. modal-title'). text ('ΠΠΎΠ²ΠΎΠ΅ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅' + ΠΏΠΎΠ»ΡΡΠ°ΡΠ΅Π»Ρ)
ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ.find ('. Π²Π²ΠΎΠ΄ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΠ΅Π»Π°'). val (ΠΏΠΎΠ»ΡΡΠ°ΡΠ΅Π»Ρ)
})
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
ΠΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ Π²Π°Ρ ΡΠΊΡΡΡΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΠΏΠΎ Π·Π°ΠΏΡΠΎΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ .modal-open
ΠΊ
, ΡΡΠΎΠ±Ρ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΠΈ Π³Π΅Π½Π΅ΡΠΈΡΡΠ΅Ρ .modal-backdrop
, ΡΡΠΎΠ±Ρ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²ΠΈΡΡ ΠΎΠ±Π»Π°ΡΡΡ ΡΠ΅Π»ΡΠΊΠ° Π΄Π»Ρ ΠΎΡΠΊΠ»ΠΎΠ½Π΅Π½ΠΈΡ ΠΏΠΎΠΊΠ°Π·Π°Π½Π½ΡΡ
ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ
ΠΎΠΊΠΎΠ½ ΠΏΡΠΈ ΡΠ΅Π»ΡΠΊΠ΅ Π²Π½Π΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π°.
Π§Π΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°ΡΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Π±Π΅Π· Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΡ JavaScript.Π£ΡΡΠ°Π½ΠΎΠ²ΠΈΡΠ΅ data-toggle = "modal"
Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ ΠΊΠΎΠ½ΡΡΠΎΠ»Π»Π΅ΡΠ°, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ ΠΊΠ½ΠΎΠΏΠΊΠ΅, Π²ΠΌΠ΅ΡΡΠ΅ Ρ data-target = "# foo"
ΠΈΠ»ΠΈ href = "# foo"
, ΡΡΠΎΠ±Ρ Π½Π°ΡΡΡΠΎΠΈΡΡ ΡΠ°ΡΠ³Π΅ΡΠΈΠ½Π³ Π½Π° ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΠΎΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Π΄Π»Ρ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ.
Π§Π΅ΡΠ΅Π· JavaScript
ΠΡΠ·ΠΎΠ² ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° Ρ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡΠΎΠΌ myModal
Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΎΠ΄Π½ΠΎΠΉ ΡΡΡΠΎΠΊΠΈ JavaScript:
$ ('# myModal'). Modal (ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ)
ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ
ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΡΡ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript.ΠΠ»Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΈΠΌΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΊ data-
, ΠΊΠ°ΠΊ Π² data-backdrop = ""
.
ΠΠΌΡ | ΡΠΈΠΏ | ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ | ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ |
---|---|---|---|
ΡΠΎΠ½ | boolean ΠΈΠ»ΠΈ ΡΡΡΠΎΠΊΠ° 'static' | ΠΏΡΠ°Π²Π΄Π° | ΠΠΊΠ»ΡΡΠ°Π΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΠΎΠ½Π°. Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Ρ ΡΠΊΠ°ΠΆΠΈΡΠ΅ ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΉ Π΄Π»Ρ ΡΠΎΠ½Π°, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π΅ Π·Π°ΠΊΡΡΠ²Π°Π΅Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ. |
ΠΊΠ»Π°Π²ΠΈΠ°ΡΡΡΠ° | Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ | ΠΏΡΠ°Π²Π΄Π° | ΠΠ°ΠΊΡΡΠ²Π°Π΅Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ ΠΊΠ»Π°Π²ΠΈΡΠΈ Π²ΡΡ ΠΎΠ΄Π° |
ΠΏΠΎΠΊΠ°Π·Π°ΡΡ | Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ | ΠΏΡΠ°Π²Π΄Π° | ΠΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ ΠΏΡΠΈ ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·Π°ΡΠΈΠΈ. |
ΡΠ΄Π°Π»Π΅Π½Π½ΡΠΉ | ΠΏΡΡΡ | Π»ΠΎΠΆΡ | ΠΡΠ° ΠΎΠΏΡΠΈΡ ΡΡΡΠ°ΡΠ΅Π»Π°, Π½Π°ΡΠΈΠ½Π°Ρ Ρ Π²Π΅ΡΡΠΈΠΈ v3.3.0 ΠΈ Π±ΡΠ» ΡΠ΄Π°Π»Π΅Π½ Π² v4. ΠΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ ΠΌΡ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ°Π±Π»ΠΎΠ½Ρ Π½Π° ΡΡΠΎΡΠΎΠ½Π΅ ΠΊΠ»ΠΈΠ΅Π½ΡΠ° ΠΈΠ»ΠΈ ΡΡΡΡΠΊΡΡΡΡ ΠΏΡΠΈΠ²ΡΠ·ΠΊΠΈ Π΄Π°Π½Π½ΡΡ ΠΈΠ»ΠΈ Π²ΡΠ·ΡΠ²Π°ΡΡ jQuery.load ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ. ΠΡΠ»ΠΈ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½ ΡΠ΄Π°Π»Π΅Π½Π½ΡΠΉ URL-Π°Π΄ΡΠ΅Ρ, ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π±ΡΠ΄Π΅Ρ Π·Π°Π³ΡΡΠΆΠ΅Π½ΠΎ ΠΎΠ΄ΠΈΠ½ ΡΠ°Π· Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΌΠ΅ΡΠΎΠ΄Π° load jQuery ΠΈ Π²ΡΡΠ°Π²Π»Π΅Π½ΠΎ Π² div |
ΠΠ΅ΡΠΎΠ΄Ρ
.modal (ΠΎΠΏΡΠΈΠΈ)
ΠΠΊΡΠΈΠ²ΠΈΡΡΠ΅Ρ Π²Π°Ρ ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΠΊΠ°ΠΊ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ. ΠΡΠΈΠ½ΠΈΠΌΠ°Π΅Ρ Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ , ΠΎΠ±ΡΠ΅ΠΊΡ
.
$ ('# myModal'). Modal ({
ΠΊΠ»Π°Π²ΠΈΠ°ΡΡΡΠ°: Π»ΠΎΠΆΡ
})
.modal ('toggle')
ΠΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Π²ΡΡΡΠ½ΡΡ. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Π±ΡΠ»ΠΎ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ ΠΈΠ»ΠΈ ΡΠΊΡΡΡΠΎ (Ρ.Π΅.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ shown.bs.modal
ΠΈΠ»ΠΈ hidden.bs.modal
).
$ ('# myModal'). Modal ('toggle')
.modal ('ΠΏΠΎΠΊΠ°Π·Π°ΡΡ')
ΠΡΠΊΡΡΠ²Π°Π΅Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Π²ΡΡΡΠ½ΡΡ. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° (Ρ.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ shown.bs.modal
).
$ ('# myModal'). Modal ('show')
.modal ('hide')
ΠΡΡΡΠ½ΡΡ ΡΠΊΡΡΠ²Π°Π΅Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΡΠΊΡΡΡΠΈΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° (Ρ.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ hidden.bs.modal
).
$ ('# myModal'). Modal ('hide')
.modal ('handleUpdate')
ΠΠ΅ΡΠ΅Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅Ρ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° Π΄Π»Ρ ΠΏΡΠΎΡΠΈΠ²ΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ ΠΏΠΎΠ»ΠΎΡΠ΅ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ Π² ΡΠ»ΡΡΠ°Π΅ Π΅Π΅ ΠΏΠΎΡΠ²Π»Π΅Π½ΠΈΡ, ΡΡΠΎ ΠΏΡΠΈΠ²Π΅Π΄Π΅Ρ ΠΊ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π° Π²Π»Π΅Π²ΠΎ.
Π’ΡΠ΅Π±ΡΠ΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ Π²ΡΡΠΎΡΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π°, ΠΊΠΎΠ³Π΄Π° ΠΎΠ½ΠΎ ΠΎΡΠΊΡΡΡΠΎ.
$ ('# myModal').ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ('handleUpdate')
Π‘ΠΎΠ±ΡΡΠΈΡ
ΠΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΠΊΠ»Π°ΡΡBootstrap ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠΎΠ±ΡΡΠΈΠΉ Π΄Π»Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΌ ΡΡΠ½ΠΊΡΠΈΡΠΌ.
ΠΡΠ΅ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ Π·Π°ΠΏΡΡΠΊΠ°ΡΡΡΡ Π² ΡΠ°ΠΌΠΎΠΌ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠΌ ΠΎΠΊΠ½Π΅ (Ρ.Π΅. Π² ΠΠΎΠ±Π°Π²ΡΡΠ΅ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠ΅ΡΡ ΠΌΠ΅Π½Ρ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΠΊΠΎ Π²ΡΠ΅ΠΌΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΠΎΠ³ΠΎ ΠΏΡΠΎΡΡΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π°, Π²ΠΊΠ»ΡΡΠ°Ρ ΠΏΠ°Π½Π΅Π»Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΠΈ ΡΠ°Π±Π»Π΅ΡΠΊΠΈ. Π‘ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΠΉ ΠΌΠΎΠ΄ΡΠ»Ρ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π³ΠΎΡΡ ΡΠΏΠΈΡΠΊΠ° ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΡΠΊΡΡΡΠΎΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ (ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠ΅ΡΡ ΠΌΠ΅Π½Ρ) ΠΏΡΡΠ΅ΠΌ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊΠ»Π°ΡΡΠ° ΠΠ° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ
ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ
ΠΎΡΠΊΡΡΡΠΈΠ΅ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π³ΠΎΡΡ ΡΠΏΠΈΡΠΊΠ° Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅. ΠΡΡΠΈΠ±ΡΡ ΠΠΎΠ±Π°Π²ΡΡΠ΅ Π§ΡΠΎΠ±Ρ URL-Π°Π΄ΡΠ΅ΡΠ° ΠΎΡΡΠ°Π²Π°Π»ΠΈΡΡ Π½Π΅ΠΈΠ·ΠΌΠ΅Π½Π½ΡΠΌΠΈ Ρ ΠΊΠ½ΠΎΠΏΠΊΠ°ΠΌΠΈ ΡΡΡΠ»ΠΎΠΊ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π°ΡΡΠΈΠ±ΡΡ ΠΡΠ·ΠΎΠ² ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ
ΡΡ ΡΠΏΠΈΡΠΊΠΎΠ² ΡΠ΅ΡΠ΅Π· JavaScript: ΠΠ΅Π·Π°Π²ΠΈΡΠΈΠΌΠΎ ΠΎΡ ΡΠΎΠ³ΠΎ, Π²ΡΠ·ΡΠ²Π°Π΅ΡΠ΅ Π»ΠΈ Π²Ρ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠΉΡΡ ΡΠΏΠΈΡΠΎΠΊ Ρ ΠΏΠΎΠΌΠΎΡΡΡ JavaScript ΠΈΠ»ΠΈ Π²ΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ data-api, ΠΠ΅Ρ ΠΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π΅ΡΡ ΠΌΠ΅Π½Ρ Π΄Π°Π½Π½ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ ΠΈΠ»ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ. ΠΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ dropdown Π·Π°ΠΏΡΡΠΊΠ°ΡΡΡΡ Π² ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ ΠΡΠ΅ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠ΅ΡΡ ΡΠΎΠ±ΡΡΠΈΡ ΠΈΠΌΠ΅ΡΡ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΠ»Π°Π³ΠΈΠ½ ScrollSpy ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½ Π΄Π»Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΡΡ
ΡΠ΅Π»Π΅ΠΉ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ. ΠΡΠΎΠΊΡΡΡΠΈΡΠ΅ ΠΎΠ±Π»Π°ΡΡΡ ΠΏΠΎΠ΄ ΠΏΠ°Π½Π΅Π»ΡΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ ΠΈ ΠΏΠΎΡΠΌΠΎΡΡΠΈΡΠ΅, ΠΊΠ°ΠΊ ΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π°ΠΊΡΠΈΠ²Π½ΡΠΉ ΠΊΠ»Π°ΡΡ. ΠΠΎΠ΄ΠΏΡΠ½ΠΊΡΡ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π³ΠΎΡΡ ΡΠΏΠΈΡΠΊΠ° ΡΠ°ΠΊΠΆΠ΅ Π±ΡΠ΄ΡΡ Π²ΡΠ΄Π΅Π»Π΅Π½Ρ. Π Π΅ΠΊΠ»Π°ΠΌΠ½ΡΠ΅ Π»Π΅Π³Π³ΠΈΠ½ΡΡ keytar, brunch id art party dolor labore. Pitchfork yrim lo-fi, ΠΏΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ ΠΎΠ½ΠΈ ΡΠ°ΡΠΏΡΠΎΠ΄Π°Π½Ρ qui.Tumblr ΠΏΡΠ°Π²Π° Π²Π΅Π»ΠΎΡΠΈΠΏΠ΅Π΄Π° Ρ ΡΠ΅ΡΠΌΡ Π½Π° ΡΡΠΎΠ», ΡΡΠΎ ΡΠ³ΠΎΠ΄Π½ΠΎ. ΠΠ°ΡΠ΄ΠΈΠ³Π°Π½ Anim keffiyeh carles. Π€ΠΎΡΠΎΠ±ΡΠ΄ΠΊΠ° Velit seitan mcsweeney 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie ΠΌΠΈΠ½ΠΈΠΌΡΠΌ, Π²Ρ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ ΠΎ Π½ΠΈΡ
ΠΈ ΠΊΠ°ΡΠ΄ΠΈΠ³Π°Π½ ΡΡΠ°ΡΡΠΎΠ²ΡΠΉ ΡΠΎΠ½Π΄ culpa biodiesel ΡΡΡΠ΅ΡΠΈΠΊΠ° Π£ΡΡΠ° ΠΠ½Π΄Π΅ΡΡΠΎΠ½Π°. ΠΠΈΡ
ΠΈΠ» ΡΠ°ΡΡΠΈΡΠΎΠ²Π°Π» Π°ΠΊΡΡΠ°ΠΌΡΡ, ΠΈΡΠΎΠ½ΠΈΡ ΡΡΠ΄ΡΠ±Ρ, Π±ΠΈΠΎΠ΄ΠΈΠ·Π΅Π»Ρ, ΠΊΠ΅ΡΠΈΡ, ΡΠ΅ΠΌΠ΅ΡΠ»Π΅Π½Π½ΠΈΠΊ, ΡΠ»Π»Π°ΠΌΠΊΠΎ, ΠΊΠΎΠ½ΡΠΊΠ²Π°Ρ. Veniam marfa, ΡΠΊΠ΅ΠΉΡΠ±ΠΎΡΠ΄ Ρ ΡΡΠ°ΠΌΠΈ, ΠΆΠΈΡΠ½Π°Ρ Π±ΠΎΡΠΎΠ΄Π° Ρ Π²ΠΈΠ»Π°ΠΌΠΈ. Freegan Π±ΠΎΡΠΎΠ΄Π° aliqua cupidatat mcsweeney’s vero.Cupidatat four loko nisi, ea helvetica nulla carles. Π’Π°ΡΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΠ²ΠΈΡΠ΅Ρ Ρ ΠΊΠΎΡΠ±ΠΈ, ΡΡΡΠ³ΠΎΠ½ Ρ Π΅Π΄ΠΎΠΉ, Π²ΠΈΠ½ΠΈΠ» mcsweeney’s quis non freegan. Lo-fi wes anderson +1 ΠΏΠΎΡΡΠ½ΠΎΠΉ. ΠΠ°ΡΠ»Π΅Ρ Π½Π΅ΡΡΡΠ΅ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΡΠΏΡΠ°ΠΆΠ½Π΅Π½ΠΈΠ΅ quis genrify Brooklyn adipisicing craft beer vice keytar deserunt. Occaecat Commodo aliqua delectus. Fap craft beer deserunt skateboard ea. Lomo bike rights adipisicing banh mi, velit ea sunt next level locavore, ΠΊΠΎΡΠ΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΏΡΠΎΠΈΡΡ
ΠΎΠΆΠ΄Π΅Π½ΠΈΡ Π² magna veniam. ΠΠΈΠ½ΠΈΠ»ΠΎΠ²Π°Ρ ΠΏΠ»Π°ΡΡΠΈΠ½ΠΊΠ° High Life, Echo Park Concquat Quis Aliquip Banh Mi Villas.Vero VHS ΠΎΡΠ΅Π½Ρ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΠΉ. Π‘ΡΠΌΠΊΠ°-ΠΌΠ΅ΡΡΠ΅Π½Π΄ΠΆΠ΅Ρ Consectetur nisi DIY Minim. Cred ex in, ΡΠΊΠΎΠ»ΠΎΠ³ΠΈΡΠ½Π°Ρ ΡΡΠΌΠΊΠ° Π½Π° ΠΏΠΎΡΡ delectus Conctetur Π΄Π»Ρ iphone. Π ΠΏΠ°ΡΠΊΠ΅ Incididunt Echo, Π²ΠΈΠ΄Π½ΡΠΉ ΠΌΠ°ΡΡΠ΅Ρ ΠΏΠΎ ΠΎΡΠΈΡΡΠΊΠ΅ thundercats sapiente veniam ΠΎΡΠΈΡΠ° deserunt mcsweeney. Excepteur VHS elit, proident shoreditch +1 biodiesel Laborum ΠΊΡΠ°ΡΡΠΎΠ²ΠΎΠ΅ ΠΏΠΈΠ²ΠΎ. ΠΠΎΡΠ΅-ΠΏΡΡΠ½ΠΈΠΊΠΈ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΏΡΠΎΠΈΡΡ
ΠΎΠΆΠ΄Π΅Π½ΠΈΡ irure four loko, cupidatat terry richardson master cleanse. ΠΡΠ΅Π΄ΠΏΠΎΠ»ΠΎΠΆΠΈΠΌ, Π²Ρ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ ΠΎ Π½ΠΈΡ
: ΠΏΠΎΡΡΠ½Π°Ρ ΡΡΠΌΠΊΠ° Π΄Π»Ρ Π°ΡΡ-Π²Π΅ΡΠ΅ΡΠΈΠ½ΠΊΠΈ, Π²ΡΠ΅ΠΌΠ΅Π½Π½Π°Ρ ΡΠ΅ΠΊΠ»Π°ΠΌΠ° ΡΠ°ΡΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΠΊΠ°ΡΠ΄ΠΈΠ³Π°Π½Π° nulla.Proident wolf nesciunt sartorial keffiyeh eu banh mi ΡΡΡΠΎΠΉΡΠΈΠ²ΡΠΉ. ΠΠ»ΠΈΡΠ½ΡΠΉ Π²ΠΎΠ»ΠΊ ΡΠ»Π°Π΄ΠΎΡΡΡΠ°ΡΡΠ½ΡΠΉ, lo-fi ea portland, ΠΏΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ ΠΎΠ½ΠΈ ΠΏΡΠΎΠ΄Π°Π»ΠΈ ΡΠ΅ΡΡΡΠ΅ Π»ΠΎΠΊΠΎ. Locavore enim nostrud mlkshk brooklyn nesciunt. Π Π΅ΠΊΠ»Π°ΠΌΠ½ΡΠ΅ Π»Π΅Π³Π³ΠΈΠ½ΡΡ keytar, brunch id art party dolor labore. Pitchfork yrim lo-fi, ΠΏΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ ΠΎΠ½ΠΈ ΡΠ°ΡΠΏΡΠΎΠ΄Π°Π½Ρ qui. Tumblr ΠΏΡΠ°Π²Π° Π²Π΅Π»ΠΎΡΠΈΠΏΠ΅Π΄Π° Ρ ΡΠ΅ΡΠΌΡ Π½Π° ΡΡΠΎΠ», ΡΡΠΎ ΡΠ³ΠΎΠ΄Π½ΠΎ. ΠΠ°ΡΠ΄ΠΈΠ³Π°Π½ Anim keffiyeh carles. Π€ΠΎΡΠΎΠ±ΡΠ΄ΠΊΠ° Velit seitan mcsweeney 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie ΠΌΠΈΠ½ΠΈΠΌΡΠΌ, Π²Ρ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ ΠΎ Π½ΠΈΡ
ΠΈ ΠΊΠ°ΡΠ΄ΠΈΠ³Π°Π½ ΡΡΠ°ΡΡΠΎΠ²ΡΠΉ ΡΠΎΠ½Π΄ culpa biodiesel ΡΡΡΠ΅ΡΠΈΠΊΠ° Π£ΡΡΠ° ΠΠ½Π΄Π΅ΡΡΠΎΠ½Π°.ΠΠΈΡ
ΠΈΠ» ΡΠ°ΡΡΠΈΡΠΎΠ²Π°Π» Π°ΠΊΡΡΠ°ΠΌΡΡ, ΠΈΡΠΎΠ½ΠΈΡ ΡΡΠ΄ΡΠ±Ρ, Π±ΠΈΠΎΠ΄ΠΈΠ·Π΅Π»Ρ, ΠΊΠ΅ΡΠΈΡ, ΡΠ΅ΠΌΠ΅ΡΠ»Π΅Π½Π½ΠΈΠΊ, ΡΠ»Π»Π°ΠΌΠΊΠΎ, ΠΊΠΎΠ½ΡΠΊΠ²Π°Ρ. Keytar twee blog, CALPA Messenger Bag Marfa AnyDelectus food truck. Sapiente synth id ΠΏΡΠ΅Π΄ΠΏΠΎΠ»ΠΎΠΆΠΈΡΠ΅Π»ΡΠ½ΠΎ. Locavore sed helvetica cliche ΠΈΡΠΎΠ½ΠΈΡ, thundercats, ΠΎ ΠΊΠΎΡΠΎΡΡΡ
Π²Ρ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ, conquat Π±Π΅Π·Π³Π»ΡΡΠ΅Π½ΠΎΠ²ΡΠΉ lo-fi fap aliquip. ΠΠ»ΠΈΡΠ½ΠΎΠ΅ ΠΌΠ΅ΡΡΠΎ ΡΠ°Π±ΠΎΡΡ ΠΏΠ΅ΡΠ΅Π΄ ΡΠ°ΡΠΏΡΠΎΠ΄Π°ΠΆΠ΅ΠΉ, terry richardson proident brunch nesciunt quis cosby sweater pariatur keffiyeh ut helvetica artisan. ΠΠ°ΡΠ΄ΠΈΠ³Π°Π½ ΠΊΡΠ°ΡΡΠΎΠ²ΡΠΉ ΠΏΠΈΠ²Π½ΠΎΠΉ ΡΠ΅ΠΉΡΠ°Π½ Π³ΠΎΡΠΎΠ²ΡΠΉ Π²Π΅Π»ΠΈΡ.VHS chambray labouris tempor veniam. Anim mollit Minimum Commodo Ullamco Thundercats. ΠΠ΅Π·Π°Π²ΠΈΡΠΈΠΌΠΎ ΠΎΡ ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ, scrollspy ΡΡΠ΅Π±ΡΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π§ΡΠΎΠ±Ρ Π»Π΅Π³ΠΊΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ scrollspy ΠΊ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Π½Π° Π²Π΅ΡΡ
Π½Π΅ΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ, Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΠΎΡΠ»Π΅ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΠΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ scrollspy Π² ΡΠΎΡΠ΅ΡΠ°Π½ΠΈΠΈ Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ ΠΈΠ»ΠΈ ΡΠ΄Π°Π»Π΅Π½ΠΈΠ΅ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΠΈΠ· ΠΌΠΎΠ΄Π΅Π»ΠΈ DOM Π²Π°ΠΌ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ Π²ΡΠ·Π²Π°ΡΡ ΠΌΠ΅ΡΠΎΠ΄ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ: ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΡΡ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript. ΠΠ»Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΈΠΌΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΊ ΠΠΎΠ±Π°Π²ΡΡΠ΅ Π±ΡΡΡΡΡΠ΅ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π΄Π»Ρ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° ΠΏΠΎ ΠΏΠ°Π½Π΅Π»ΡΠΌ Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, Π΄Π°ΠΆΠ΅ ΡΠ΅ΡΠ΅Π· ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠ΅ΡΡ ΠΌΠ΅Π½Ρ. ΠΠ»ΠΎΠΆΠ΅Π½Π½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ. ΠΠ΅ΠΎΠ±ΡΠ°Π±ΠΎΡΠ°Π½Π½ΡΠΉ Π΄Π΅Π½ΠΈΠΌ ΠΡ Π½Π°Π²Π΅ΡΠ½ΡΠΊΠ° Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ ΠΎ Π΄ΠΆΠΈΠ½ΡΠΎΠ²ΡΡ
ΡΠΎΡΡΠ°Ρ
Austin. Nesciunt tofu stumptown aliqua, ΠΌΠ°ΡΡΠ΅Ρ ΠΎΡΠΈΡΡΠΊΠΈ ΡΠ΅ΡΡΠΎ-ΡΠΈΠ½ΡΠ΅Π·Π°ΡΠΎΡΠ°. Π£ΡΡ cliche tempor, williamsburg carles vegan helvetica. Π Π΅ΠΏΡΠ΅Π·Π΅Π½Π΄Π΅ΡΠΈΡ ΠΌΡΡΠ½ΠΈΠΊ ΡΠ΅ΡΡΠΎ ΠΊΠ΅ΡΠΈΠ΅Ρ
Π»ΠΎΠ²Π΅Ρ ΡΠ½ΠΎΠ² ΡΠΈΠ½ΡΠ΅Π·Π°ΡΠΎΡ. Π‘Π²ΠΈΡΠ΅Ρ Cosby eu banh mi, qui irure terry richardson ex squid. ΠΠ»ΠΈΠΊΠ²ΠΈΠΏ ΠΏΠ»Π°Ρ Π΄Π»Ρ ΡΠ°Π»ΡΠ΅Ρ cillum iphone. ΠΠ°ΡΠ΄ΠΈΠ³Π°Π½ Seitan aliquip quis Π°ΠΌΠ΅ΡΠΈΠΊΠ°Π½ΡΠΊΠ°Ρ ΠΎΠ΄Π΅ΠΆΠ΄Π°, butcher voluptate nisi qui. Food truck fixie locavore, ΠΊΠΎΡΠ΅ΠΉΠ½ΡΠΉ ΠΊΠ°Π»ΡΠΌΠ°Ρ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΏΡΠΎΠΈΡΡ
ΠΎΠΆΠ΄Π΅Π½ΠΈΡ accusamus mcsweeney’s marfa nulla. Exercitation +1 labore velit, Π±Π»ΠΎΠ³ ΠΏΠΎΡΡΠ½ΡΠΆΠ½ΡΠ΅ Π»Π΅Π³Π³ΠΈΠ½ΡΡ PBR ΡΠ»Π΅Π΄ΡΡΡΠ΅Π³ΠΎ ΡΡΠΎΠ²Π½Ρ wes anderson artisan four loko-farm to table craft beer twee. Qui photo booth Π²ΡΡΠΎΠΊΠΎΠΉ ΠΏΠ΅ΡΠ°ΡΠΈ, ΠΊΠΎΠΌΠΌΠΎΠ΄ΠΎ enim craft ΠΏΠΈΠ²ΠΎ ΠΌΠ»ΠΊΡΠΊ Π°Π»ΠΈΠΊΠ²ΠΈΠΏ Π΄ΠΆΠΈΠ½ΡΠΎΠ²ΡΠ΅ ΡΠΎΡΡΡ ullamco ad Π²ΠΈΠ½ΠΈΠ» cillum PBR. Homo nostrud organic, ΠΏΡΠ΅Π΄ΠΏΠΎΠ»ΠΎΠΆΠΈΡΠ΅Π»ΡΠ½ΠΎ, ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΡΡΡΠ΅ΡΠΈΡΠ΅ΡΠΊΠ°Ρ magna delectus mollit. Keytar helvetica VHS salvia yr, vero magna velit sapiente labore stumptown.Vegan fanny pack odio cillum wes anderson 8-Π±ΠΈΡΠ½ΡΠ΅ ΡΠΊΠΎΠ»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΈ ΡΠΈΡΡΡΠ΅ Π΄ΠΆΠΈΠ½ΡΠΎΠ²ΡΠ΅ ΡΠΎΡΡΡ Ρ Π±ΠΎΡΠΎΠ΄ΠΎΠΉ ΠΈ ΡΡΠΈΡΠ΅ΡΠΊΠΈΠΌ Π±ΠΈΠΎΠ΄ΠΈΠ·Π΅Π»Π΅ΠΌ Π’Π΅ΡΡΠΈ Π ΠΈΡΠ°ΡΠ΄ΡΠΎΠ½Π° ΡΠ²ΠΎΠΈΠΌΠΈ ΡΡΠΊΠ°ΠΌΠΈ. Art party sceneter stumptown, tumblr butcher vero sint qui sapiente accusamus ΡΠ°ΡΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΡ
ΠΎ-ΠΏΠ°ΡΠΊ. ΠΡΡΠ΅ΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΈΠΊΠΈ ΠΏΠΎ ΠΌΠΈΠΊΡΡΠ΅ΠΉΠΏΡ Etsy, ΡΡΠΈΡΠ½ΡΠΉ ΡΠΎΡΡ Π£ΡΡΠ° ΠΠ½Π΄Π΅ΡΡΠΎΠ½Π° Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ ΡΠ°ΡΠΏΡΠΎΠ΄Π°Π»ΠΈ ΠΎΡΠ³Π°Π½ΠΈΡΠ΅ΡΠΊΠΈΠΉ Π»ΠΎΠΌΠΎ-ΡΠ΅ΡΡΠΎ ΡΠ°Π½Π½ΠΈ-ΠΏΠ°ΠΊΠ΅Ρ ΠΎΡ mcsweeney, Π³ΠΎΡΠΎΠ²ΡΠΉ ΠΊ ΠΎΡΠΏΡΠ°Π²ΠΊΠ΅ Ρ ΡΠ΅ΡΠΌΡ Π½Π° ΡΡΠΎΠ». Π‘ΡΠΌΠΊΠ°-ΠΌΠ΅ΡΡΠ΅Π½Π΄ΠΆΠ΅Ρ Ρ ΡΠ°ΡΡΠΈΡΠΎΠ²ΠΊΠΎΠΉ Π² ββΠ²ΠΈΠ΄Π΅ Π²ΠΈΠ»ΠΎΠΊ Π΄Π»Ρ ΠΊΡΠ°ΡΡΠΎΠ²ΠΎΠ³ΠΎ ΠΏΠΈΠ²Π°, iphone skateboard locavore carles etsy salvia banksy Ρ ΠΊΠ°ΠΏΡΡΠΎΠ½ΠΎΠΌ helvetica.DIY synth PBR ΠΠ°Π½ΠΊΠΈ ΠΈΡΠΎΠ½ΠΈΡ. ΠΠΎΠ½ΠΎΠΆΠΈ Π΄ΠΆΠ΅Π½ΡΡΠΈΡΠΈΠΊΠ°ΡΠΈΠΈ ΠΊΠ°Π»ΡΠΌΠ°ΡΠ° 8-Π±ΠΈΡΠ½ΡΠΉ ΠΊΡΠ΅Π΄ΠΈΡ Π²ΠΈΠ»Π°ΠΌΠΈ. Williamsburg banh mi Π±Π΅Π· Π³Π»ΡΡΠ΅Π½Π°, ΠΊΠ°ΡΠ»Π΅Ρ Π²ΠΈΠ»Ρ Π±ΠΈΠΎΠ΄ΠΈΠ·Π΅Π»Ρ fixie etsy retro mlkshk Vice blog. ΠΡ, Π½Π°Π²Π΅ΡΠ½ΠΎΠ΅, Π½ΠΈΠΊΠΎΠ³Π΄Π° ΠΎ Π½ΠΈΡ
Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ, Π±Π»ΠΎΠ³ ΠΎ ΠΊΡΠ°ΡΡΠΎΠ²ΠΎΠΌ Π²ΠΈΠ½ΠΈΠ»ΠΎΠ²ΠΎΠΌ ΠΏΠΈΠ²Π΅ stumptown. ΠΠΈΠ»Ρ ΠΈΠ· ΡΠΊΠΎΠ»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΈ ΡΠΈΡΡΠΎΠ³ΠΎ ΡΠΎΡΡ Synth Chambray yr. ΡΡΠ°ΡΡΠΎΠ²ΡΠΉ ΡΠΎΠ½Π΄ seitan Π²ΡΡΠΎΠΊΠΎΠΉ ΠΏΠ΅ΡΠ°ΡΠΈ, keytar raw denim keffiyeh etsy art party ΠΏΠ΅ΡΠ΅Π΄ ΡΠ°ΡΠΏΡΠΎΠ΄Π°ΠΆΠ΅ΠΉ ΡΠ²ΠΈΡΠ΅Ρ master cleanse Π±Π΅Π· Π³Π»ΡΡΠ΅Π½Π° Ρ ΠΊΠ°Π»ΡΠΌΠ°ΡΠ°ΠΌΠΈ.Fanny pack portland seitan DIY, Π°ΡΡ-Π²Π΅ΡΠ΅ΡΠΈΠ½ΠΊΠ° locavore Π²ΠΎΠ»ΠΊ ΠΊΠ»ΠΈΡΠ΅ ΡΠ²Π΅ΡΡΠΊΠ°Ρ ΠΆΠΈΠ·Π½Ρ ΡΡ
ΠΎ-ΠΏΠ°ΡΠΊ Π² ΠΡΡΠΈΠ½Π΅. ΠΡΠ΅Π΄ Π²ΠΈΠ½ΠΈΠ» keffiyeh DIY salvia PBR, banh mi Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ ΡΠ°ΡΠΏΡΠΎΠ΄Π°Π»ΠΈ ΡΠ²ΠΈΡΠ΅Ρ VHS Ρ Π²ΠΈΡΡΡΠΎΠΌ locavore cosby. Lomo wolf viral, Π³ΠΎΡΠΎΠ²ΡΠ΅ ΡΡΡ thundercats keffiyeh craft beer marfa ethical. Wolf salvia freegan, sartorial keffiyeh echo park vegan. ΠΠΊΠ»ΡΡΠΈΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ ΡΠ΅ΡΠ΅Π· JavaScript (ΠΊΠ°ΠΆΠ΄ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ Π½ΡΠΆΠ½ΠΎ Π°ΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°ΡΡ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΠΎ): ΠΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°ΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΠΌΠΎΠΆΠ½ΠΎ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΠΌΠΈ ΡΠΏΠΎΡΠΎΠ±Π°ΠΌΠΈ: ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π°ΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°ΡΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ ΠΏΠΎ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌ ΠΈΠ»ΠΈ ΡΠ°Π±Π»Π΅ΡΠΊΠ°ΠΌ Π±Π΅Π· Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΡ ΠΊΠΎΠ΄Π° JavaScript, ΠΏΡΠΎΡΡΠΎ ΡΠΊΠ°Π·Π°Π² Π§ΡΠΎΠ±Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΠΏΠΎΡΡΠ΅ΠΏΠ΅Π½Π½ΠΎ ΠΏΠΎΡΠ²Π»ΡΠ»ΠΈΡΡ, Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΠΊΡΠΈΠ²ΠΈΡΡΠ΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΠΈ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ. ΠΠΊΠ»Π°Π΄ΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Π° ΠΈΠΌΠ΅ΡΡ Π»ΠΈΠ±ΠΎ ΠΡΠ±ΠΈΡΠ°Π΅Ρ Π΄Π°Π½Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ ΠΈ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠ²ΡΠ·Π°Π½Π½ΠΎΠ΅ Ρ Π½Π΅ΠΉ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅. ΠΡΠ±Π°Ρ Π΄ΡΡΠ³Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°, ΠΊΠΎΡΠΎΡΠ°Ρ Π±ΡΠ»Π° Π²ΡΠ±ΡΠ°Π½Π° ΡΠ°Π½Π΅Π΅, ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π½Π΅Π²ΡΠ΄Π΅Π»Π΅Π½Π½ΠΎΠΉ, Π° ΡΠ²ΡΠ·Π°Π½Π½ΠΎΠ΅ Ρ Π½Π΅ΠΉ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΡΠΊΡΡΠ²Π°Π΅ΡΡΡ. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΌΡ Π°Π±ΠΎΠ½Π΅Π½ΡΡ Π΄ΠΎ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΠ°Π½Π΅Π»ΠΈ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ (Ρ. Π. ΠΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ ΠΡΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ Π½ΠΎΠ²ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΡΠΎΠ±ΡΡΠΈΡ Π·Π°ΠΏΡΡΠΊΠ°ΡΡΡΡ Π² ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ ΠΏΠΎΡΡΠ΄ΠΊΠ΅: ΠΡΠ»ΠΈ Π½ΠΈ ΠΎΠ΄Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ° Π΅ΡΠ΅ Π½Π΅ Π±ΡΠ»Π° Π°ΠΊΡΠΈΠ²Π½ΠΎΠΉ, ΡΠΎ ΡΠΎΠ±ΡΡΠΈΡ ΠΠ° ΠΎΡΠ½ΠΎΠ²Π΅ ΠΎΡΠ»ΠΈΡΠ½ΠΎΠ³ΠΎ jQuery.ΠΏΠΎΠ΄Π²ΡΠΏΠΈΠ²ΡΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, Π½Π°ΠΏΠΈΡΠ°Π½Π½ΡΠΉ ΠΠΆΠ΅ΠΉΡΠΎΠ½ΠΎΠΌ Π€ΡΠ΅ΠΉΠΌΠΎΠΌ; ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ — ΡΡΠΎ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Π½Π°Ρ Π²Π΅ΡΡΠΈΡ, ΠΊΠΎΡΠΎΡΠ°Ρ Π½Π΅ ΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ CSS3 Π΄Π»Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ ΠΈ Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
Π΄Π»Ρ Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ Ρ
ΡΠ°Π½Π΅Π½ΠΈΡ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ². ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Ρ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°ΠΌΠΈ Π½ΡΠ»Π΅Π²ΠΎΠΉ Π΄Π»ΠΈΠ½Ρ Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ. ΠΠ°Π²Π΅Π΄ΠΈΡΠ΅ ΠΊΡΡΡΠΎΡ Π½Π° ΡΡΡΠ»ΠΊΠΈ Π½ΠΈΠΆΠ΅, ΡΡΠΎΠ±Ρ ΡΠ²ΠΈΠ΄Π΅ΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ: ΠΠΎΡΡΡΠΏΠ½Ρ ΡΠ΅ΡΡΡΠ΅ Π²Π°ΡΠΈΠ°Π½ΡΠ°: ΠΏΠΎ Π²Π΅ΡΡ
Π½Π΅ΠΌΡ, ΠΏΡΠ°Π²ΠΎΠΌΡ, Π½ΠΈΠΆΠ½Π΅ΠΌΡ ΠΈ Π»Π΅Π²ΠΎΠΌΡ ΠΊΡΠ°ΡΠΌ. ΠΠ»Π°Π³ΠΈΠ½ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ Π³Π΅Π½Π΅ΡΠΈΡΡΠ΅Ρ ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠΊΡ ΠΏΠΎ Π·Π°ΠΏΡΠΎΡΡ ΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΏΠΎΠΌΠ΅ΡΠ°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΏΠΎΡΠ»Π΅ ΠΈΡ
ΡΡΠΈΠ³Π³Π΅ΡΠ½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΡΠ·Π²Π°ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ ΡΠ΅ΡΠ΅Π· JavaScript: Π’ΡΠ΅Π±ΡΠ΅ΠΌΠ°Ρ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠ° Π΄Π»Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ — ΡΡΠΎ ΡΠΎΠ»ΡΠΊΠΎ Π°ΡΡΠΈΠ±ΡΡ ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΡΡ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript.ΠΠ»Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΈΠΌΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΊ ΠΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ ΠΊ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ.ΠΡΠΈΠΌΠ΅Ρ: ΠΠ°Π΄Π΅ΡΠΆΠΊΠ° ΠΏΠΎΠΊΠ°Π·Π° ΠΈ ΡΠΊΡΡΡΠΈΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ (ΠΌΡ) — Π½Π΅ ΠΎΡΠ½ΠΎΡΠΈΡΡΡ ΠΊ ΡΡΡΠ½ΠΎΠΌΡ ΡΠΈΠΏΡ Π·Π°ΠΏΡΡΠΊΠ° ΠΡΠ»ΠΈ Π½ΠΎΠΌΠ΅Ρ ΡΠΊΠ°Π·Π°Π½, Π·Π°Π΄Π΅ΡΠΆΠΊΠ° ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ ΠΊ ΡΠΊΡΡΡΠΈΡ / ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π‘ΡΡΡΠΊΡΡΡΠ° ΠΎΠ±ΡΠ΅ΠΊΡΠ°: ΠΠ°ΠΊ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ — Π²Π²Π΅ΡΡ
Ρ | Π²Π½ΠΈΠ·Ρ | ΡΠ»Π΅Π²Π° | ΠΏΡΠ°Π²ΠΎ | Π°Π²ΡΠΎ. ΠΠΎΠ³Π΄Π° ΡΡΠ½ΠΊΡΠΈΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ, ΠΎΠ½Π° Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ Ρ ΡΠ·Π»ΠΎΠΌ DOM Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΏΠ΅ΡΠ²ΠΎΠ³ΠΎ Π°ΡΠ³ΡΠΌΠ΅Π½ΡΠ° ΠΈ ΡΠ·Π»ΠΎΠΌ DOM ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π·Π°ΠΏΡΡΠΊΠ° Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π²ΡΠΎΡΠΎΠ³ΠΎ. ΠΠΎΠ½ΡΠ΅ΠΊΡΡ ΠΠ°Π·ΠΎΠ²ΡΠΉ HTML-ΠΊΠΎΠ΄ Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΏΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ. ΠΠ°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Π‘Π°ΠΌΡΠΉ Π²Π½Π΅ΡΠ½ΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΎΠ±ΠΎΠ»ΠΎΡΠΊΠΈ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΈΠΌΠ΅ΡΡ ΠΊΠ»Π°ΡΡ ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, Π΅ΡΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡ ΠΡΠ»ΠΈ Π·Π°Π΄Π°Π½Π° ΡΡΠ½ΠΊΡΠΈΡ, ΠΎΠ½Π° Π±ΡΠ΄Π΅Ρ Π²ΡΠ·ΡΠ²Π°ΡΡΡΡ ΡΠΎ ΡΠ²ΠΎΠ΅ΠΉ ΡΡΡΠ»ΠΊΠΎΠΉ Π‘ΠΎΡ
ΡΠ°Π½ΡΠ΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ
ΡΡΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.ΠΡΠΈΠΌΠ΅Ρ: ΠΡΠ»ΠΈ ΡΡΠ½ΠΊΡΠΈΡ Π·Π°Π΄Π°Π½Π°, ΠΎΠ½Π° Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ Ρ Π·Π°ΠΏΡΡΠΊΠ°ΡΡΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ DOM-ΡΠ·Π»ΠΎΠΌ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π΅Π΄ΠΈΠ½ΡΡΠ²Π΅Π½Π½ΠΎΠ³ΠΎ Π°ΡΠ³ΡΠΌΠ΅Π½ΡΠ°. ΠΠΎΠ½ΡΠ΅ΠΊΡΡ ΠΡΠΈΡΠΎΠ΅Π΄ΠΈΠ½ΡΠ΅Ρ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΊ ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ². ΠΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° Π±ΡΠ»Π° ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠΊΠ°Π·Π°Π½Π° (Ρ.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ Π‘ΠΊΡΡΠ²Π°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΠΎΠ·Π²ΡΠ°ΡΠ°Π΅ΡΡΡ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° Π±ΡΠ»Π° ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΡΠΊΡΡΡΠ°. (Ρ.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ ΠΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° Π±ΡΠ»Π° ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠΊΠ°Π·Π°Π½Π° ΠΈΠ»ΠΈ ΡΠΊΡΡΡΠ° (Ρ.Π΅.Π΅. ΠΏΠ΅ΡΠ΅Π΄ ΡΠΎΠ±ΡΡΠΈΠ΅ΠΌ Π‘ΠΊΡΡΠ²Π°Π΅Ρ ΠΈ ΡΠ½ΠΈΡΡΠΎΠΆΠ°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΠΈΠ΅ Π΄Π΅Π»Π΅Π³ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ (ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΎΠ·Π΄Π°ΡΡΡΡ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΎΠΏΡΠΈΠΈ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΠ° ΠΠΎΠ±Π°Π²Π»ΡΠΉΡΠ΅ Π½Π΅Π±ΠΎΠ»ΡΡΠΈΠ΅ Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, ΠΊΠ°ΠΊ Π½Π° iPad, ΠΊ Π»ΡΠ±ΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π΄Π»Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ Π²ΡΠΎΡΠΈΡΠ½ΠΎΠΉ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ. ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π°, Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΠΊΠΎΡΠΎΡΡΡ
ΠΈΠΌΠ΅ΡΡ Π½ΡΠ»Π΅Π²ΡΡ Π΄Π»ΠΈΠ½Ρ, Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ. ΠΠΎ ΡΠΎΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½ΠΎΡΡΠΈ API Π΄Π°Π½Π½ΡΡ
Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π° ΡΠ²Π»ΡΡΡΡΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΌΠΈ, ΡΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ Π²Ρ Π΄ΠΎΠ»ΠΆΠ½Ρ ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ ΠΈΡ
ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ . ΠΠ΄ΠΈΠ½ ΠΈΠ· ΡΠΏΠΎΡΠΎΠ±ΠΎΠ² ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ Π²ΡΠ΅ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π° Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ - Π²ΡΠ±ΡΠ°ΡΡ ΠΈΡ
Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠ° ΠΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΎΠΊΠΎΠ½ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°Ρ
Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ
ΠΡΠ·ΠΎΠ² Π§ΡΠΎΠ±Ρ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΠ½ΠΎΠ³Π΄Π° Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΠΊ Π³ΠΈΠΏΠ΅ΡΡΡΡΠ»ΠΊΠ΅, ΠΊΠΎΡΠΎΡΠ°Ρ ΠΏΠ΅ΡΠ΅Π½ΠΎΡΠΈΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΡΠΎΠΊ. ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½ popover ΡΠ΅Π½ΡΡΠΈΡΡΠ΅Ρ Π΅Π³ΠΎ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ ΠΈ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ. ΠΠΎΠ±Π°Π²ΡΡΠ΅ ΠΠΎΡΡΡΠΏΠ½Ρ ΡΠ΅ΡΡΡΠ΅ Π²Π°ΡΠΈΠ°Π½ΡΠ°: ΠΏΠΎ Π²Π΅ΡΡ
Π½Π΅ΠΌΡ, ΠΏΡΠ°Π²ΠΎΠΌΡ, Π½ΠΈΠΆΠ½Π΅ΠΌΡ ΠΈ Π»Π΅Π²ΠΎΠΌΡ ΠΊΡΠ°ΡΠΌ. Sed posuere consctetur est at lobortis.Aenean eu leo ββquam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consctetur est at lobortis. Aenean eu leo ββquam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consctetur est at lobortis. Aenean eu leo ββquam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consctetur est at lobortis.Aenean eu leo ββquam. Pellentesque ornare sem lacinia quam venenatis vestibulum. ΠΠ°ΠΆΠΌΠΈΡΠ΅, ΡΡΠΎΠ±Ρ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΡΠΏΡΠ°Π²Π°
ΠΠΎΠΏΠΎΠ²Π΅Ρ ΡΠ²Π΅ΡΡ
Ρ
ΠΠΎΠΏΠΎΠ²Π΅Ρ Π²Π½ΠΈΠ·Ρ
ΠΠΎΠΏΠΎΠ²Π΅Ρ ΡΠ»Π΅Π²Π° ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΡΠΈΠ³Π³Π΅Ρ ΠΠ»Ρ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠ³ΠΎ ΠΊΡΠΎΡΡΠ±ΡΠ°ΡΠ·Π΅ΡΠ½ΠΎΠ³ΠΎ ΠΈ ΠΊΡΠΎΡΡΠΏΠ»Π°ΡΡΠΎΡΠΌΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΡ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ΅Π³ ΠΠΊΠ»ΡΡΠΈΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π° ΡΠ΅ΡΠ΅Π· JavaScript: ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΡΡ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript. ΠΠ»Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΈΠΌΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΊ ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΏΠΎ ΡΠΎΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌ Π±Π΅Π·ΠΎΠΏΠ°ΡΠ½ΠΎΡΡΠΈ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΠΊ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ.ΠΡΠΈΠΌΠ΅Ρ: ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, Π΅ΡΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡ ΠΡΠ»ΠΈ Π·Π°Π΄Π°Π½Π° ΡΡΠ½ΠΊΡΠΈΡ, ΠΎΠ½Π° Π±ΡΠ΄Π΅Ρ Π²ΡΠ·ΡΠ²Π°ΡΡΡΡ ΡΠΎ ΡΠ²ΠΎΠ΅ΠΉ ΡΡΡΠ»ΠΊΠΎΠΉ ΠΠ°Π΄Π΅ΡΠΆΠΊΠ° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈ ΡΠΊΡΡΡΠΈΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π° (ΠΌΡ) - Π½Π΅ ΠΎΡΠ½ΠΎΡΠΈΡΡΡ ΠΊ ΡΡΡΠ½ΠΎΠΌΡ ΡΠΈΠΏΡ Π·Π°ΠΏΡΡΠΊΠ° ΠΡΠ»ΠΈ Π½ΠΎΠΌΠ΅Ρ ΡΠΊΠ°Π·Π°Π½, Π·Π°Π΄Π΅ΡΠΆΠΊΠ° ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ ΠΊ ΡΠΊΡΡΡΠΈΡ / ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π‘ΡΡΡΠΊΡΡΡΠ° ΠΎΠ±ΡΠ΅ΠΊΡΠ°: ΠΠ°ΠΊ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ - Π²Π²Π΅ΡΡ
Ρ | Π²Π½ΠΈΠ·Ρ | ΡΠ»Π΅Π²Π° | ΠΏΡΠ°Π²ΠΎ | Π°Π²ΡΠΎ. ΠΠΎΠ³Π΄Π° ΡΡΠ½ΠΊΡΠΈΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ, ΠΎΠ½Π° Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ·Π»Π° DOM Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π° Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΏΠ΅ΡΠ²ΠΎΠ³ΠΎ Π°ΡΠ³ΡΠΌΠ΅Π½ΡΠ° ΠΈ ΡΠ·Π»Π° DOM ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π·Π°ΠΏΡΡΠΊΠ° Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π²ΡΠΎΡΠΎΠ³ΠΎ. ΠΠΎΠ½ΡΠ΅ΠΊΡΡ ΠΠ°Π·ΠΎΠ²ΡΠΉ HTML Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΏΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°. ΠΠ°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Π‘ΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π‘Π°ΠΌΡΠΉ Π²Π½Π΅ΡΠ½ΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΎΠ±ΠΎΠ»ΠΎΡΠΊΠΈ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΈΠΌΠ΅ΡΡ ΠΊΠ»Π°ΡΡ ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, Π΅ΡΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡ ΠΡΠ»ΠΈ Π·Π°Π΄Π°Π½Π° ΡΡΠ½ΠΊΡΠΈΡ, ΠΎΠ½Π° Π±ΡΠ΄Π΅Ρ Π²ΡΠ·ΡΠ²Π°ΡΡΡΡ ΡΠΎ ΡΠ²ΠΎΠ΅ΠΉ ΡΡΡΠ»ΠΊΠΎΠΉ Π‘ΠΎΡ
ΡΠ°Π½ΡΠ΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ
ΡΡΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.ΠΡΠΈΠΌΠ΅Ρ: ΠΡΠ»ΠΈ ΡΡΠ½ΠΊΡΠΈΡ Π·Π°Π΄Π°Π½Π°, ΠΎΠ½Π° Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ Ρ Π·Π°ΠΏΡΡΠΊΠ°ΡΡΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ DOM-ΡΠ·Π»ΠΎΠΌ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π΅Π΄ΠΈΠ½ΡΡΠ²Π΅Π½Π½ΠΎΠ³ΠΎ Π°ΡΠ³ΡΠΌΠ΅Π½ΡΠ°. ΠΠΎΠ½ΡΠ΅ΠΊΡΡ ΠΠΏΡΠΈΠΈ Π΄Π»Ρ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ
Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΎΠΊΠΎΠ½ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°ΠΊΠΆΠ΅ ΡΠΊΠ°Π·Π°ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
, ΠΊΠ°ΠΊ ΠΎΠΏΠΈΡΠ°Π½ΠΎ Π²ΡΡΠ΅. ΠΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·ΠΈΡΡΠ΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π° Π΄Π»Ρ ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ². ΠΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π° (Ρ. Π. ΠΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ Π‘ΠΊΡΡΠ²Π°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ Π±ΡΠ»ΠΎ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΡΠΊΡΡΡΠΎ. (Ρ.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ ΠΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ Π±ΡΠ»ΠΎ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ ΠΈΠ»ΠΈ ΡΠΊΡΡΡΠΎ (Ρ.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ Π‘ΠΊΡΡΠ²Π°Π΅Ρ ΠΈ ΡΠ½ΠΈΡΡΠΎΠΆΠ°Π΅Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π°, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΠΈΠ΅ Π΄Π΅Π»Π΅Π³ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ (ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΎΠ·Π΄Π°ΡΡΡΡ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΡΠ΅Π»Π΅ΠΊΡΠΎΡΠ° Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΠΎΠ³ΠΎ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΠΎΠ³ΠΎ ΠΌΠΎΠ΄ΡΠ»Ρ Π΄ΠΎΠ±Π°Π²Π»ΡΠΉΡΠ΅ ΡΡΠ½ΠΊΡΠΈΡ Π·Π°ΠΊΡΡΡΠΈΡ ΠΊΠΎ Π²ΡΠ΅ΠΌ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π°ΡΡΠΈΠΌ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΡΠΌ. ΠΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΠΊΠ½ΠΎΠΏΠΊΠΈ Γ Π‘Π²ΡΡΠΎΠΉ Π³ΡΠ°ΠΊΠ°ΠΌΠΎΠ»Π΅! ΠΡΠΎΠ²Π΅ΡΡΡΠ΅ ΡΠ΅Π±Ρ, Π²Ρ Π½Π΅ ΠΎΡΠ΅Π½Ρ Ρ
ΠΎΡΠΎΡΠΎ Π²ΡΠ³Π»ΡΠ΄ΠΈΡΠ΅. ΠΠ·ΠΌΠ΅Π½ΠΈΡΠ΅ ΡΠΎ ΠΈ ΡΠΎ ΠΈ ΠΏΠΎΠΏΡΠΎΠ±ΡΠΉΡΠ΅ Π΅ΡΠ΅ ΡΠ°Π·. Duis mollis, est nonmodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis Concectetur Purus Sit Amet Fermentum. ΠΡΠΏΠΎΠ»Π½ΠΈΡΠ΅ ΡΡΠΎ Π΄Π΅ΠΉΡΡΠ²ΠΈΠ΅
ΠΠ»ΠΈ ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ ΠΡΠΎΡΡΠΎ Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ Π§ΡΠΎΠ±Ρ Π²Π°ΡΠΈ ΠΎΠΏΠΎΠ²Π΅ΡΠ΅Π½ΠΈΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π»ΠΈ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΠΏΡΠΈ Π·Π°ΠΊΡΡΡΠΈΠΈ, ΡΠ±Π΅Π΄ΠΈΡΠ΅ΡΡ, ΡΡΠΎ ΠΊ Π½ΠΈΠΌ ΡΠΆΠ΅ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½Ρ ΠΊΠ»Π°ΡΡΡ ΠΠ°ΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΎΠΏΠΎΠ²Π΅ΡΠ΅Π½ΠΈΠ΅ ΠΏΡΠΎΡΠ»ΡΡΠΈΠ²Π°ΡΡ ΡΠΎΠ±ΡΡΠΈΡ ΡΠ΅Π»ΡΠΊΠ° Π½Π° Π΄ΠΎΡΠ΅ΡΠ½ΠΈΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°Ρ
, ΠΈΠΌΠ΅ΡΡΠΈΡ
Π°ΡΡΠΈΠ±ΡΡ ΠΠ°ΠΊΡΡΠ²Π°Π΅Ρ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠ΅, ΡΠ΄Π°Π»ΡΡ Π΅Π³ΠΎ ΠΈΠ· ΠΌΠΎΠ΄Π΅Π»ΠΈ DOM. ΠΡΠ»ΠΈ Π² ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ ΠΏΡΠΈΡΡΡΡΡΠ²ΡΡΡ ΠΊΠ»Π°ΡΡΡ Bootstrap ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠΎΠ±ΡΡΠΈΠΉ Π΄Π»Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊ ΡΡΠ½ΠΊΡΠΈΡΠΌ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠΉ. ΠΠ΅Π»Π°ΠΉΡΠ΅ Π±ΠΎΠ»ΡΡΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΊΠ½ΠΎΠΏΠΎΠΊ. Π£ΠΏΡΠ°Π²Π»ΡΠΉΡΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΡΠΌΠΈ ΠΊΠ½ΠΎΠΏΠΎΠΊ ΠΈΠ»ΠΈ ΡΠΎΠ·Π΄Π°Π²Π°ΠΉΡΠ΅ Π³ΡΡΠΏΠΏΡ ΠΊΠ½ΠΎΠΏΠΎΠΊ Π΄Π»Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΡ
ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ², ΡΠ°ΠΊΠΈΡ
ΠΊΠ°ΠΊ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠ². ΠΠΎΠ±Π°Π²ΡΡΠ΅ ΠΡΠ° ΡΡΠ½ΠΊΡΠΈΡ ΡΡΡΠ°ΡΠ΅Π»Π°, Π½Π°ΡΠΈΠ½Π°Ρ Ρ Π²Π΅ΡΡΠΈΠΈ 3.3.5, ΠΈ Π±ΡΠ»Π° ΡΠ΄Π°Π»Π΅Π½Π° Π² Π²Π΅ΡΡΠΈΠΈ 4. Π‘ΠΎΡΡΠΎΡΠ½ΠΈΠ΅ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΠΠΎΠ±Π°Π²ΡΡΠ΅ ΠΠ»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ Ρ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ΠΌ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΊΠ»Π°ΡΡ ΠΠ΄ΠΈΠ½ΠΎΡΠ½ΡΠΉ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»Ρ ΠΠΎΠ±Π°Π²ΡΡΠ΅ ΠΠ»Ρ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π²ΡΠ±ΡΠ°Π½Π½ΡΡ
ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² Π²Ρ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΠ°ΠΌΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΊΠ»Π°ΡΡ ΠΡΠ»ΠΈ ΠΎΡΠΌΠ΅ΡΠ΅Π½Π½ΠΎΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΡΠ»Π°ΠΆΠΊΠ° ΠΎΠ±Π½ΠΎΠ²Π»ΡΠ΅ΡΡΡ Π±Π΅Π· Π·Π°ΠΏΡΡΠΊΠ° ΡΠΎΠ±ΡΡΠΈΡ ΠΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ push. ΠΡΠΈΠ΄Π°Π΅Ρ ΠΊΠ½ΠΎΠΏΠΊΠ΅ Π²ΠΈΠ΄, ΡΡΠΎ ΠΎΠ½Π° Π±ΡΠ»Π° Π°ΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°Π½Π°. Π‘Π±ΡΠ°ΡΡΠ²Π°Π΅Ρ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ - Π·Π°ΠΌΠ΅Π½ΡΠ΅Ρ ΡΠ΅ΠΊΡΡ ΠΈΡΡ
ΠΎΠ΄Π½ΡΠΌ ΡΠ΅ΠΊΡΡΠΎΠΌ. ΠΡΠΎΡ ΠΌΠ΅ΡΠΎΠ΄ ΡΠ²Π»ΡΠ΅ΡΡΡ Π°ΡΠΈΠ½Ρ
ΡΠΎΠ½Π½ΡΠΌ ΠΈ Π²ΠΎΠ·Π²ΡΠ°ΡΠ°Π΅ΡΡΡ Π΄ΠΎ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΡΠ±ΡΠΎΡΠ°. ΠΠ΅Π½ΡΠ΅Ρ ΡΠ΅ΠΊΡΡ Π½Π° Π»ΡΠ±ΠΎΠ΅ ΡΠ΅ΠΊΡΡΠΎΠ²ΠΎΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅, ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ΅ Π΄Π°Π½Π½ΡΠΌΠΈ. ΠΠΈΠ±ΠΊΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΊΠ»Π°ΡΡΠΎΠ² Π΄Π»Ρ Π»Π΅Π³ΠΊΠΎΠ³ΠΎ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ. Collapse ΡΡΠ΅Π±ΡΠ΅Ρ, ΡΡΠΎΠ±Ρ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² Π±ΡΠ» Π²ΠΊΠ»ΡΡΠ΅Π½ Π² Π²Π°ΡΡ Π²Π΅ΡΡΠΈΡ Bootstrap. ΠΠ°ΠΆΠΌΠΈΡΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ Π½ΠΈΠΆΠ΅, ΡΡΠΎΠ±Ρ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ ΠΈΠ»ΠΈ ΡΠΊΡΡΡΡ Π΄ΡΡΠ³ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ ΠΊΠ»Π°ΡΡΠ°: ΠΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΡΡΠ»ΠΊΡ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ Π‘ΡΡΠ»ΠΊΠ° Π½Π° href
ΠΠ½ΠΎΠΏΠΊΠ° Ρ ΡΠ΅Π»ΡΡ Π΄Π°Π½Π½ΡΡ
Anim pariatur cliche correhenderit, enim eiusmod high life accusamus terry richardson ad squid.Nihil anim keffiyeh helvetica, ΠΊΡΠ°ΡΡΠΎΠ²ΡΠΉ ΠΏΠΈΠ²Π½ΠΎΠΉ ΡΡΡΠ΄ ΡΡΡ Π°Π½Π΄Π΅ΡΡΠΎΠ½ ΠΊΡΠ΅Π΄ΠΈΡ Π½Π΅ΡΡΠ°Π½Ρ ΡΠ°ΠΏΠΈΠ΅Π½ΡΠ΅ Π΅Π° ΠΏΡΠΎΠΈΠ΄Π΅Π½Ρ. Π Π°ΡΡΠΈΡΠΈΡΡ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π½ΠΈΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΡΡΠΎΠ±Ρ ΡΠΎΠ·Π΄Π°ΡΡ Π³Π°ΡΠΌΠΎΡΠΊΡ Ρ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠΌ ΠΏΠ°Π½Π΅Π»ΠΈ. Anim pariatur cliche correhenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, Π±ΡΠ°Π½Ρ ΡΠΎ ΡΠΊΠ΅ΠΉΡΠ±ΠΎΡΠ΄ΠΎΠΌ Π±Π΅Π· ΠΊΡΠΏΠΈΠ΄Π°ΡΠ°ΡΠ°. ΠΡΠΎΠ΄ΠΎΠ²ΠΎΠ»ΡΡΡΠ²Π΅Π½Π½ΡΠΉ Π³ΡΡΠ·ΠΎΠ²ΠΈΠΊ ΠΊΠ²ΠΈΠ½ΠΎΠ° nesciunt labourum eiusmod. ΠΡΠ°Π½Ρ 3 Π²ΠΎΠ»ΠΊ Π»ΡΠ½Π½ΡΠΉ ΡΠ΅ΠΌΠΏΠΎΡ, Π·Π°Π³Π°Ρ Π°Π»ΠΈΠΊΠ²Π° ΠΏΠΎΠ»ΠΎΠΆΠΈ Π½Π° Π½Π΅Π³ΠΎ ΠΏΡΠΈΡΡ ΠΊΠ°Π»ΡΠΌΠ°Ρ, ΠΊΠΎΡΠ΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΏΡΠΎΠΈΡΡ
ΠΎΠΆΠ΄Π΅Π½ΠΈΡ nulla acceptnda shoreditch et. Nihil anim keffiyeh helvetica, ΠΊΡΠ°ΡΡΠΎΠ²ΡΠΉ ΠΏΠΈΠ²Π½ΠΎΠΉ ΡΡΡΠ΄ ΡΡΡ Π°Π½Π΄Π΅ΡΡΠΎΠ½ ΠΊΡΠ΅Π΄ΠΈΡ Π½Π΅ΡΡΠ°Π½Ρ ΡΠ°ΠΏΠΈΠ΅Π½ΡΠ΅ Π΅Π° ΠΏΡΠΎΠΈΠ΄Π΅Π½Ρ. ΠΠ±ΡΡΠ²Π»Π΅Π½ΠΈΠ΅ vegan excepteur butcher vice lomo.ΠΠ΅Π³Π³ΠΈΠ½ΡΡ occaecat craft beer farm-to-table, Π½Π΅ΠΎΠ±ΡΠ°Π±ΠΎΡΠ°Π½Π½ΡΠΉ Π΄Π΅Π½ΠΈΠΌ, ΡΡΡΠ΅ΡΠΈΡΠ½ΡΠΉ ΡΠΈΠ½ΡΠ΅Π·Π°ΡΠΎΡ, ΠΎ ΠΊΠΎΡΠΎΡΡΡ
Π²Ρ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ, accusamus labore, ΡΡΡΠΎΠΉΡΠΈΠ²ΡΠ΅ VHS. Anim pariatur cliche correhenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, Π±ΡΠ°Π½Ρ ΡΠΎ ΡΠΊΠ΅ΠΉΡΠ±ΠΎΡΠ΄ΠΎΠΌ Π±Π΅Π· ΠΊΡΠΏΠΈΠ΄Π°ΡΠ°ΡΠ°. ΠΡΠΎΠ΄ΠΎΠ²ΠΎΠ»ΡΡΡΠ²Π΅Π½Π½ΡΠΉ Π³ΡΡΠ·ΠΎΠ²ΠΈΠΊ ΠΊΠ²ΠΈΠ½ΠΎΠ° nesciunt labourum eiusmod. ΠΡΠ°Π½Ρ 3 Π²ΠΎΠ»ΠΊ Π»ΡΠ½Π½ΡΠΉ ΡΠ΅ΠΌΠΏΠΎΡ, Π·Π°Π³Π°Ρ Π°Π»ΠΈΠΊΠ²Π° ΠΏΠΎΠ»ΠΎΠΆΠΈ Π½Π° Π½Π΅Π³ΠΎ ΠΏΡΠΈΡΡ ΠΊΠ°Π»ΡΠΌΠ°Ρ, ΠΊΠΎΡΠ΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΏΡΠΎΠΈΡΡ
ΠΎΠΆΠ΄Π΅Π½ΠΈΡ nulla acceptnda shoreditch et.Nihil anim keffiyeh helvetica, ΠΊΡΠ°ΡΡΠΎΠ²ΡΠΉ ΠΏΠΈΠ²Π½ΠΎΠΉ ΡΡΡΠ΄ ΡΡΡ Π°Π½Π΄Π΅ΡΡΠΎΠ½ ΠΊΡΠ΅Π΄ΠΈΡ Π½Π΅ΡΡΠ°Π½Ρ ΡΠ°ΠΏΠΈΠ΅Π½ΡΠ΅ Π΅Π° ΠΏΡΠΎΠΈΠ΄Π΅Π½Ρ. ΠΠ±ΡΡΠ²Π»Π΅Π½ΠΈΠ΅ vegan excepteur butcher vice lomo. ΠΠ΅Π³Π³ΠΈΠ½ΡΡ occaecat craft beer farm-to-table, Π½Π΅ΠΎΠ±ΡΠ°Π±ΠΎΡΠ°Π½Π½ΡΠΉ Π΄Π΅Π½ΠΈΠΌ, ΡΡΡΠ΅ΡΠΈΡΠ½ΡΠΉ ΡΠΈΠ½ΡΠ΅Π·Π°ΡΠΎΡ, ΠΎ ΠΊΠΎΡΠΎΡΡΡ
Π²Ρ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ, accusamus labore, ΡΡΡΠΎΠΉΡΠΈΠ²ΡΠ΅ VHS. Anim pariatur cliche correhenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, Π±ΡΠ°Π½Ρ ΡΠΎ ΡΠΊΠ΅ΠΉΡΠ±ΠΎΡΠ΄ΠΎΠΌ Π±Π΅Π· ΠΊΡΠΏΠΈΠ΄Π°ΡΠ°ΡΠ°.ΠΡΠΎΠ΄ΠΎΠ²ΠΎΠ»ΡΡΡΠ²Π΅Π½Π½ΡΠΉ Π³ΡΡΠ·ΠΎΠ²ΠΈΠΊ ΠΊΠ²ΠΈΠ½ΠΎΠ° nesciunt labourum eiusmod. ΠΡΠ°Π½Ρ 3 Π²ΠΎΠ»ΠΊ Π»ΡΠ½Π½ΡΠΉ ΡΠ΅ΠΌΠΏΠΎΡ, Π·Π°Π³Π°Ρ Π°Π»ΠΈΠΊΠ²Π° ΠΏΠΎΠ»ΠΎΠΆΠΈ Π½Π° Π½Π΅Π³ΠΎ ΠΏΡΠΈΡΡ ΠΊΠ°Π»ΡΠΌΠ°Ρ, ΠΊΠΎΡΠ΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΏΡΠΎΠΈΡΡ
ΠΎΠΆΠ΄Π΅Π½ΠΈΡ nulla acceptnda shoreditch et. Nihil anim keffiyeh helvetica, ΠΊΡΠ°ΡΡΠΎΠ²ΡΠΉ ΠΏΠΈΠ²Π½ΠΎΠΉ ΡΡΡΠ΄ ΡΡΡ Π°Π½Π΄Π΅ΡΡΠΎΠ½ ΠΊΡΠ΅Π΄ΠΈΡ Π½Π΅ΡΡΠ°Π½Ρ ΡΠ°ΠΏΠΈΠ΅Π½ΡΠ΅ Π΅Π° ΠΏΡΠΎΠΈΠ΄Π΅Π½Ρ. ΠΠ±ΡΡΠ²Π»Π΅Π½ΠΈΠ΅ vegan excepteur butcher vice lomo. ΠΠ΅Π³Π³ΠΈΠ½ΡΡ occaecat craft beer farm-to-table, Π½Π΅ΠΎΠ±ΡΠ°Π±ΠΎΡΠ°Π½Π½ΡΠΉ Π΄Π΅Π½ΠΈΠΌ, ΡΡΡΠ΅ΡΠΈΡΠ½ΡΠΉ ΡΠΈΠ½ΡΠ΅Π·Π°ΡΠΎΡ, ΠΎ ΠΊΠΎΡΠΎΡΡΡ
Π²Ρ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, Π½Π΅ ΡΠ»ΡΡΠ°Π»ΠΈ, accusamus labore, ΡΡΡΠΎΠΉΡΠΈΠ²ΡΠ΅ VHS. Π’Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π·Π°ΠΌΠ΅Π½ΠΈΡΡ ΠΠ΅ Π·Π°Π±ΡΠ΄ΡΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π΅ΡΠ»ΠΈ Π²Π°Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π½Π°ΡΠ΅Π»Π΅Π½ Π½Π° ΠΎΠ΄ΠΈΠ½ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, Ρ.Π΅.Π°ΡΡΠΈΠ±ΡΡ ΠΠ»Π°Π³ΠΈΠ½ ΠΊΠΎΠ»Π»Π°ΠΏΡΠ° ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΊΠ»Π°ΡΡΠΎΠ² Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ Ρ ΡΡΠΆΠ΅Π»ΠΎΠΉ ΡΠ°Π±ΠΎΡΠΎΠΉ: ΠΡΠΈ ΠΊΠ»Π°ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡΠΈ Π² ΠΡΠΎΡΡΠΎ Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ Π§ΡΠΎΠ±Ρ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ Π³ΡΡΠΏΠΏΠ°ΠΌΠΈ Π² Π²ΠΈΠ΄Π΅ Π³Π°ΡΠΌΠΎΡΠΊΠΈ ΠΊ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ, Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ Π°ΡΡΠΈΠ±ΡΡ Π΄Π°Π½Π½ΡΡ
ΠΠΊΠ»ΡΡΠΈΡΡ Π²ΡΡΡΠ½ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ: ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΡΡ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript. ΠΠ»Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΈΠΌΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΊ ΠΠΊΡΠΈΠ²ΠΈΡΡΠ΅Ρ Π²Π°Ρ ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΠΊΠ°ΠΊ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ. ΠΡΠΈΠ½ΠΈΠΌΠ°Π΅Ρ Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π½Π° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ»ΠΈ ΡΠΊΡΡΡΠΈΠ΅. ΠΠΎΠ·Π²ΡΠ°Ρ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ» ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠΊΠ°Π·Π°Π½ ΠΈΠ»ΠΈ ΡΠΊΡΡΡ (Ρ.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ ΠΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ. ΠΠΎΠ·Π²ΡΠ°ΡΠ°Π΅ΡΡΡ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ» ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠΊΠ°Π·Π°Π½ (Ρ.Π΅.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ Π‘ΠΊΡΡΠ²Π°Π΅Ρ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ. ΠΠΎΠ·Π²ΡΠ°ΡΠ°Π΅ΡΡΡ ΠΊ Π²ΡΠ·ΡΠ²Π°ΡΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Π΅ Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ» ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ ΡΠΊΡΡΡ. (Ρ.Π΅. Π΄ΠΎ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ ΡΠΎΠ±ΡΡΠΈΠ΅ ΠΠ»Π°ΡΡ ΠΊΠΎΠ»Π»Π°ΠΏΡΠ° Bootstrap ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠΎΠ±ΡΡΠΈΠΉ Π΄Π»Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΠΈ ΠΊΠΎΠ»Π»Π°ΠΏΡΠ°. ΠΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ Π΄Π»Ρ ΡΠΈΠΊΠ»ΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ², Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ. ΠΠ»ΠΎΠΆΠ΅Π½Π½ΡΠ΅ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ. ΠΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΠΎΠ±ΡΡΠ½ΠΎ Π½Π΅ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΠ΅Ρ ΡΡΠ°Π½Π΄Π°ΡΡΠ°ΠΌ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΡΡ
Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠ΅ΠΉ.ΠΡΠ»ΠΈ Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°ΡΡ ΡΡΠ΅Π±ΠΎΠ²Π°Π½ΠΈΡΠΌ, ΡΠ°ΡΡΠΌΠΎΡΡΠΈΡΠ΅ Π΄ΡΡΠ³ΠΈΠ΅ Π²Π°ΡΠΈΠ°Π½ΡΡ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ Π²Π°ΡΠ΅Π³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°. Bootstrap ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ ΠΈΡΠΊΠ»ΡΡΠΈΡΠ΅Π»ΡΠ½ΠΎ CSS3 Π΄Π»Ρ ΡΠ²ΠΎΠ΅ΠΉ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ, Π½ΠΎ Internet Explorer 8 ΠΈ 9 Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΡΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²Π° CSS. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΏΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΡΡΠΈΡ
Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ² Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»Π°ΠΉΠ΄Π°ΠΌΠΈ ΠΎΡΡΡΡΡΡΠ²ΡΠ΅Ρ. ΠΡ Π½Π°ΠΌΠ΅ΡΠ΅Π½Π½ΠΎ ΡΠ΅ΡΠΈΠ»ΠΈ Π½Π΅ Π²ΠΊΠ»ΡΡΠ°ΡΡ Π² ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Ρ ΡΠ΅Π·Π΅ΡΠ²Π½ΡΠ΅ Π²Π°ΡΠΈΠ°Π½ΡΡ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ jQuery. ΠΠΎΠ΄Π΅Π»Ρ ΠΠ»Π°ΡΡΡ ΠΠ΅Π³ΠΊΠΎ Π΄ΠΎΠ±Π°Π²Π»ΡΠΉΡΠ΅ ΠΏΠΎΠ΄ΠΏΠΈΡΠΈ ΠΊ ΡΠ»Π°ΠΉΠ΄Π°ΠΌ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Nulla vitae elit libero, pharetra augue mollis interdum. Lorem ipsum dolor sit amet, conctetur adipiscing elit. Praesentmodo cursus magna, vel scelerisque nisl consctetur. ... ΠΠ°ΡΡΡΠ΅Π»ΠΈ ΡΡΠ΅Π±ΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
, ΡΡΠΎΠ±Ρ Π»Π΅Π³ΠΊΠΎ ΡΠΏΡΠ°Π²Π»ΡΡΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ. ΠΡΡΠΈΠ±ΡΡ ΠΡΠ·ΠΎΠ² ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ Π²ΡΡΡΠ½ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ: ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΡΡ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript. ΠΠ»Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΈΠΌΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΊ ΠΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·ΠΈΡΡΠ΅Ρ ΠΊΠ°ΡΡΡΠ΅Π»Ρ Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΠΎΠ±ΡΠ΅ΠΊΡΠΎΠΌ options ΠΠ΅ΡΠ΅Π±ΠΈΡΠ°Π΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΡΠ»Π΅Π²Π° Π½Π°ΠΏΡΠ°Π²ΠΎ. ΠΠ΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΠΏΠ΅ΡΠ΅Π±ΠΈΡΠ°ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ. Π¦ΠΈΠΊΠ»ΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΠΊ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌΡ ΠΊΠ°Π΄ΡΡ (Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ 0, Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΠΎ ΠΌΠ°ΡΡΠΈΠ²Ρ). ΠΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΠΊ ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ. ΠΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΠΊ ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ. Bootstrap ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ Π΄Π²Π° ΡΠΎΠ±ΡΡΠΈΡ Π΄Π»Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΠΈ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ. ΠΠ±Π° ΡΠΎΠ±ΡΡΠΈΡ ΠΈΠΌΠ΅ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²Π°: ΠΡΠ΅ ΡΠΎΠ±ΡΡΠΈΡ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ Π·Π°ΠΏΡΡΠΊΠ°ΡΡΡΡ Π² ΡΠ°ΠΌΠΎΠΉ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ (ΡΠΎ Π΅ΡΡΡ Π² ΠΠ»Π°Π³ΠΈΠ½ Π°ΡΡΠΈΠΊΡΠ° ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΠΉ ΠΌΠΎΠ΄ΡΠ»Ρ affix ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ Π²ΡΡΡΠ½ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎΠ³ΠΎ JavaScript. Π ΠΎΠ±ΠΎΠΈΡ
ΡΠ»ΡΡΠ°ΡΡ
Π²Ρ Π΄ΠΎΠ»ΠΆΠ½Ρ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²ΠΈΡΡ CSS Π΄Π»Ρ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΠΈ ΡΠΈΡΠΈΠ½Ρ Π²Π°ΡΠ΅Π³ΠΎ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°. ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅. ΠΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΠΉ ΠΌΠΎΠ΄ΡΠ»Ρ Π°ΡΡΠΈΠΊΡΠ° ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠ΅ΠΌΡΡΡ Π² ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅, ΡΠ°ΠΊΠΎΠΌ ΠΊΠ°ΠΊ Π²ΡΡΡΠ½ΡΡΡΠΉ ΠΈΠ»ΠΈ Π²ΡΡΠ°Π»ΠΊΠΈΠ²Π°Π΅ΠΌΡΠΉ ΡΡΠΎΠ»Π±Π΅Ρ, ΠΈΠ·-Π·Π° ΠΎΡΠΈΠ±ΠΊΠΈ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³Π° Safari. ΠΠ»Π°Π³ΠΈΠ½ Π°ΡΡΠΈΠΊΡΠΎΠ² ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΠ΅ΠΌΡ ΠΊΠ»Π°ΡΡΠ°ΠΌΠΈ, ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΈΠ· ΠΊΠΎΡΠΎΡΡΡ
ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅: ΠΠΎΡ ΠΊΠ°ΠΊ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΏΠ»Π°Π³ΠΈΠ½ affix: ΠΡΠΏΠΎΠ»Π½ΠΈΡΠ΅ ΡΠΊΠ°Π·Π°Π½Π½ΡΠ΅ Π²ΡΡΠ΅ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ, ΡΡΠΎΠ±Ρ Π½Π°ΡΡΡΠΎΠΈΡΡ CSS Π΄Π»Ρ Π»ΡΠ±ΠΎΠ³ΠΎ ΠΈΠ· ΡΠΊΠ°Π·Π°Π½Π½ΡΡ
Π½ΠΈΠΆΠ΅ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ² ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ. Π§ΡΠΎΠ±Ρ Π»Π΅Π³ΠΊΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ Π°ΡΡΠΈΠΊΡΠ° ΠΊ Π»ΡΠ±ΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΠΏΡΠΎΡΡΠΎ Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΡΠ·ΠΎΠ² ΠΏΠ»Π°Π³ΠΈΠ½Π° Π°ΡΡΠΈΠΊΡΠ° ΡΠ΅ΡΠ΅Π· JavaScript: ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°ΡΡ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ JavaScript. ΠΠ»Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΈΠΌΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΊ ΠΠΊΡΠΈΠ²ΠΈΡΡΠ΅Ρ Π²Π°Ρ ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΠΊΠ°ΠΊ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡΠΈΠ½ΠΈΠΌΠ°Π΅Ρ Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΠ΅ΡΠ΅ΡΡΠΈΡΡΠ²Π°Π΅Ρ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ Π°ΡΡΠΈΠΊΡΠ° Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ², ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΈ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ². Bootstrap ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠΎΠ±ΡΡΠΈΠΉ Π΄Π»Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊ ΡΡΠ½ΠΊΡΠΈΡΠΌ Π°ΡΡΠΈΠΊΡΠΎΠ². ΠΡΡΠ°ΡΠΎΡΡΠΊΠΈΠΉ ΡΠΏΠΈΡΠΎΠΊ Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ
ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² jQuery, ΡΠ΅ΡΡΡΡΠΎΠ² ΠΈ Π΄ΡΡΠ³ΠΈΡ
Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ
Π²Π΅ΡΠ΅ΠΉ.ΠΠ΄ΠΎΡ
Π½ΠΎΠ²Π»Π΅Π½Π½ΡΠΉ ΡΡΠ΅Π½Π΄ΠΎΠΌ jQuery - ΡΡΠΎ Π±ΡΡΡΡΠ°Ρ, Π½Π΅Π±ΠΎΠ»ΡΡΠ°Ρ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½Π°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° JavaScript. ΠΠ½ Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠΏΡΠΎΡΠ°Π΅Ρ ΡΠ°ΠΊΠΈΠ΅ Π²Π΅ΡΠΈ, ΠΊΠ°ΠΊ ΠΎΠ±Ρ
ΠΎΠ΄ ΠΈ ΠΌΠ°Π½ΠΈΠΏΡΠ»ΡΡΠΈΠΈ Ρ HTML-Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΠΌΠΈ, ΠΎΠ±ΡΠ°Π±ΠΎΡΠΊΠ° ΡΠΎΠ±ΡΡΠΈΠΉ, Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΠΈ Ajax Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΏΡΠΎΡΡΠΎΠ³ΠΎ Π² ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ API, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π²ΠΎ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²Π΅ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ². ΠΠ»Π°Π³ΠΎΠ΄Π°ΡΡ ΡΠΎΡΠ΅ΡΠ°Π½ΠΈΡ ΡΠ½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΠΎΡΡΠΈ ΠΈ ΡΠ°ΡΡΠΈΡΡΠ΅ΠΌΠΎΡΡΠΈ jQuery ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ» ΡΠΏΠΎΡΠΎΠ± Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΡ JavaScript ΠΌΠΈΠ»Π»ΠΈΠΎΠ½Π°ΠΌΠΈ Π»ΡΠ΄Π΅ΠΉ. ΠΡΠ»ΠΈΡΠ½ΡΠΉ ΡΡΠ΅Π±Π½ΡΠΉ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π» Π΄Π»Ρ Π·Π½Π°ΠΊΠΎΠΌΡΡΠ²Π° Ρ jQuery ΠΈ JavaScript ΠΈΠ»ΠΈ Π΄Π»Ρ ΠΈΠ·ΡΡΠ΅Π½ΠΈΡ ΡΠ΅Π³ΠΎ-ΡΠΎ Π±ΠΎΠ»Π΅Π΅ ΡΠ»ΠΎΠΆΠ½ΠΎΠ³ΠΎ.ΠΠ΅ΡΠΊΠΎΠ»ΡΠΊΠΎ Π΄ΡΡΠΆΠ΅ΡΠΊΠΈΡ
ΡΠΎΠ²Π΅ΡΠΎΠ²: ΠΏΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ ΡΠ³Π»ΡΠ±Π»ΡΡΡΡΡ Π² jQuery, Ρ
ΠΎΡΠΎΡΠΎ ΠΈΠ·ΡΡΠΈΡΠ΅ JavaScript. ΠΡΠ»ΠΈΡΠ½ΡΠ΅ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²Π° ΠΈ ΠΊΡΡΡΡ ΠΏΠΎ ΠΈΠ·ΡΡΠ΅Π½ΠΈΡ jQuery. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΠΌΡΠ΅ ΠΈ Π½Π΅ ΡΠ»ΠΈΡΠΊΠΎΠΌ ΡΡΡΠ°ΡΠ΅Π²ΡΠΈΠ΅ ΠΊΠ½ΠΈΠ³ΠΈ ΠΏΠΎ jQuery. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΠ΅ Π±Π»ΠΎΠ³ΠΈ ΠΈ Π²Π΅Π±-ΡΠ°ΠΉΡΡ, ΡΠ²ΡΠ·Π°Π½Π½ΡΠ΅ Ρ jQuery. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ Π Π°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠΈΠΏΡ ΡΠ΅ΡΡΡΡΠΎΠ². ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΡΠ»ΠΈΡΠ½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠΎ Π²ΡΠ΅ΠΉ Π²ΡΠ΅Π»Π΅Π½Π½ΠΎΠΉ jQuery. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ½ΠΈΠΌΠ°ΡΠΈΠΈ, ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Ρ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ Π Π΅Π΄Π°ΠΊΡΠΎΡΡ WYSIWYG. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΡΠΎΡΠΌ, AJAX, ΠΏΡΠΎΠ²Π΅ΡΠΊΠ°. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ»Π°Π³ΠΈΠ½Ρ, ΡΠ²ΡΠ·Π°Π½Π½ΡΠ΅ Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ, ΠΌΠ°Π½ΠΈΠΏΡΠ»ΡΡΠΈΡΠΌΠΈ Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ, Π³Π°Π»Π΅ΡΠ΅ΡΠΌΠΈ, ΠΊΠ°ΡΡΠ°ΠΌΠΈ ΠΈ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΠ°ΠΌΠΈ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ½ΠΈΠΌΠ°ΡΠΈΡ ΠΌΠ΅Π½Ρ, ΡΠ»ΡΡΡΠ΅Π½ΠΈΠ΅ ΡΠ΄ΠΎΠ±ΡΡΠ²Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΈ ΡΠΊΡΠ°ΡΠ΅Π½ΠΈΠ΅. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ
ΠΎΠΊΠΎΠ½ (Π΄ΠΈΠ°Π»ΠΎΠ³ΠΎΠ²ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ / Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π°), Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ ΠΈ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΡ
Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΎΠΊΠΎΠ½. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ»Π°Π³ΠΈΠ½Ρ ΠΈ ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΡΠ΅ΡΠΊΠΈ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π΄Π°Π½Π½ΡΡ
Π² Π²ΠΈΠ΄Π΅ ΡΠ°Π±Π»ΠΈΡ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΠΎΠ±ΡΠ°Π±ΠΎΡΠΊΠΈ, ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΠΈΠ»ΠΈ ΡΠΎΡΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΡ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ ΠΈ Π΄Π°ΡΡ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ½ΡΠ΅ΡΠ½Π°ΡΠΈΠΎΠ½Π°Π»ΠΈΠ·Π°ΡΠΈΡ (i18n) ΠΈ Π»ΠΎΠΊΠ°Π»ΠΈΠ·Π°ΡΠΈΡ (l10n). ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ»Π°Π³ΠΈΠ½Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ»Π°Π³ΠΈΠ½Ρ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠΊΠ° Π½Π΅Π»ΡΠ·Ρ ΠΎΡΡΠΎΡΡΠΈΡΠΎΠ²Π°ΡΡ ΠΏΠΎ ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΡΠΌ Π²ΡΡΠ΅. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠΎΠ±ΠΈΠ»ΡΠ½Π°Ρ ΡΠ΅ΠΊΡΠΈΡ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ Π Π°Π·Π΄Π΅Π» ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ°. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠΎΠ΄ΡΠ»ΡΠ½ΡΠ΅ ΡΠ΅ΡΡΡ, ΡΠ°Π·Π΄Π΅Π» ΡΠ΅ΡΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΡΡΡΠΈΠ΅ ΠΏΡΠ°ΠΊΡΠΈΠΊΠΈ ΠΈΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΠΈ ΠΊΠ»ΠΈΠ΅Π½ΡΡΠΊΠΎΠ³ΠΎ jQuery Ρ ΡΠ΅ΡΠ²Π΅ΡΠ½ΡΠΌΠΈ ΡΠ΅Ρ
Π½ΠΎΠ»ΠΎΠ³ΠΈΡΠΌΠΈ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ°Π΄Π°Π²Π°ΠΉΡΠ΅ Π²ΠΎΠΏΡΠΎΡΡ ΠΈ ΠΎΡΠ²Π΅ΡΠ°ΠΉΡΠ΅ Π½Π° Π½ΠΈΡ
, Π΄Π΅Π»ΠΈΡΠ΅ΡΡ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»Π°ΠΌΠΈ, ΡΠ²ΡΠ·Π°Π½Π½ΡΠΌΠΈ Ρ jQuery, ΠΈ ΠΏΠΎΠ»ΡΡΠ°ΠΉΡΠ΅ ΠΈΡ
, Π° ΡΠ°ΠΊΠΆΠ΅ ΡΠ²ΡΠ·ΡΠ²Π°ΠΉΡΠ΅ΡΡ Ρ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎΠΌ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΡΠ΅ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ jQuery API. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ ΠΡΠΈΠ³Π»Π°ΡΠ°Π΅ΠΌ Π²Π°Ρ Π²Π½Π΅ΡΡΠΈ ΡΠ²ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ ΠΈ Π² ΡΡΠΎΡ Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ jQuery.ΠΠΎΠ»ΡΡΠΎΠ΅ ΡΠΏΠ°ΡΠΈΠ±ΠΎ Π²ΡΠ΅ΠΌ ΡΡΠ°ΡΡΠ½ΠΈΠΊΠ°ΠΌ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠΌΠΎΠ³Π»ΠΈ ΡΠΎΡΡΠ°Π²ΠΈΡΡ ΡΡΠΎΡ ΡΠΏΠΈΡΠΎΠΊ. Π ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ
, ΠΏΡΠ΅Π΄ΡΡΠΌΠΎΡΡΠ΅Π½Π½ΡΡ
Π·Π°ΠΊΠΎΠ½ΠΎΠΌ, ΠΠΈΡΠ΅Ρ ΠΠΎΠΊΠΎΡ ΠΎΡΠΊΠ°Π·Π°Π»ΡΡ ΠΎΡ Π²ΡΠ΅Ρ
Π°Π²ΡΠΎΡΡΠΊΠΈΡ
ΠΈ ΡΠΌΠ΅ΠΆΠ½ΡΡ
ΠΏΡΠ°Π² Π½Π° ΡΡΡ ΡΠ°Π±ΠΎΡΡ. ΠΠ΅ΡΠ½ΡΡΡΡΡ ΠΊ Π½Π°ΡΠ°Π»Ρ Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅ ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° show
.ΠΡΠ»ΠΈ ΡΡΠΎ Π²ΡΠ·Π²Π°Π½ΠΎ ΡΠ΅Π»ΡΠΊΠΎΠΌ, Π²ΡΠ±ΡΠ°Π½Π½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π΄ΠΎΡΡΡΠΏΠ΅Π½ ΠΊΠ°ΠΊ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ relatedTarget
ΡΠΎΠ±ΡΡΠΈΡ. ΠΏΠΎΠΊΠ°Π·Π°Π½ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π²ΠΈΠ΄ΠΈΠΌΡΠΌ Π΄Π»Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (ΠΎΠΆΠΈΠ΄Π°Π΅Ρ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS). ΠΡΠ»ΠΈ ΡΡΠΎ Π²ΡΠ·Π²Π°Π½ΠΎ ΡΠ΅Π»ΡΠΊΠΎΠΌ, Π²ΡΠ±ΡΠ°Π½Π½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π΄ΠΎΡΡΡΠΏΠ΅Π½ ΠΊΠ°ΠΊ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ relatedTarget
ΡΠΎΠ±ΡΡΠΈΡ. hide.bs.modal ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΡΡΠ°Π·Ρ ΠΏΠΎΡΠ»Π΅ Π²ΡΠ·ΠΎΠ²Π° ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° hide
. ΡΠΊΡΡΡΡΠΉ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΡΡΠ°Π»ΠΎ Π±ΡΡΡ ΡΠΊΡΡΡΡΠΌ ΠΎΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (Π±ΡΠ΄Π΅Ρ ΠΎΠΆΠΈΠ΄Π°ΡΡ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS). Π·Π°Π³ΡΡΠΆΠ΅Π½Π½ΡΠΉ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΠΉ ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΌΠΎΠ΄Π°Π»ΡΠ½ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Π·Π°Π³ΡΡΠΆΠ°Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° remote
.
$ ('# myModal'). On ('hidden.bs.modal', function (e) {
// ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ-Π½ΠΈΠ±ΡΠ΄Ρ...
})
ΠΡΠΈΠΌΠ΅ΡΡ
ΠΠ° ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ
ΠΠ½ΡΡΡΠΈ ΡΠ°Π±Π»Π΅ΡΠΎΠΊ
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
.open
Π½Π° ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΏΠΈΡΠΊΠ°. .dropdown-backdrop
Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΎΠ±Π»Π°ΡΡΠΈ ΠΊΠ°ΡΠ°Π½ΠΈΡ Π΄Π»Ρ Π·Π°ΠΊΡΡΡΠΈΡ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ
ΡΡ ΠΌΠ΅Π½Ρ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π²Π½Π΅ ΠΌΠ΅Π½Ρ, ΡΡΠΎ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΡΠ΅Π±ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π΄Π»Ρ Π½Π°Π΄Π»Π΅ΠΆΠ°ΡΠ΅ΠΉ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΈ iOS. ΠΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΈΠ· ΠΎΡΠΊΡΡΡΠΎΠ³ΠΎ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π³ΠΎΡΡ ΠΌΠ΅Π½Ρ Π² Π΄ΡΡΠ³ΠΎΠ΅ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π΅ΡΡ ΠΌΠ΅Π½Ρ ΡΡΠ΅Π±ΡΠ΅Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ Π½Π°ΠΆΠ°ΡΠΈΡ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠΌ ΡΡΡΡΠΎΠΉΡΡΠ²Π΅. data-toggle = "dropdown"
ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ Π·Π°ΠΊΡΡΡΠΈΡ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ
ΡΡ ΠΌΠ΅Π½Ρ Π½Π° ΡΡΠΎΠ²Π½Π΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ, ΠΏΠΎΡΡΠΎΠΌΡ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΡΡΡ Π²ΡΠ΅Π³Π΄Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ. Π§Π΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
data-toggle = "dropdown"
ΠΊ ΡΡΡΠ»ΠΊΠ΅ ΠΈΠ»ΠΈ ΠΊΠ½ΠΎΠΏΠΊΠ΅, ΡΡΠΎΠ±Ρ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΡ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠΉΡΡ ΡΠΏΠΈΡΠΎΠΊ.
...
data-target
Π²ΠΌΠ΅ΡΡΠΎ href = "#"
.
Π§Π΅ΡΠ΅Π· JavaScript
$ ('.dropdown-toggle '). dropdown ()
data-toggle = "dropdown"
ΠΏΠΎ-ΠΏΡΠ΅ΠΆΠ½Π΅ΠΌΡ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ data-toggle = "dropdown"
Π²ΡΠ΅Π³Π΄Π° Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΏΡΠΈΡΡΡΡΡΠ²ΠΎΠ²Π°ΡΡ Π² ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ ΡΡΠΈΠ³Π³Π΅ΡΠ° ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π³ΠΎΡΡ ΡΠΏΠΈΡΠΊΠ°. ΠΠΏΡΠΈΠΈ
ΠΠ΅ΡΠΎΠ΄Ρ
$ (). Π Π°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠΉΡΡ ΡΠΏΠΈΡΠΎΠΊ ('ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅')
Π‘ΠΎΠ±ΡΡΠΈΡ
.dropdown-menu
. relatedTarget
, Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ ΠΏΡΠΈΠ²ΡΠ·ΠΊΠΈ. Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ.bs.dropdown ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ ΡΡΠ°Π·Ρ ΠΏΠΎΡΠ»Π΅ Π²ΡΠ·ΠΎΠ²Π° ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° ΡΠΎΡ. ΠΠΎΠΊΠ°Π·Π°Π½ΠΎ.bs.dropdown ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠΉΡΡ ΡΠΏΠΈΡΠΎΠΊ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π²ΠΈΠ΄ΠΈΠΌΡΠΌ Π΄Π»Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (ΠΎΠΆΠΈΠ΄Π°Π΅Ρ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS). hide.bs.dropdown ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΡΡΠ°Π·Ρ ΠΏΠΎΡΠ»Π΅ Π²ΡΠ·ΠΎΠ²Π° ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° hide. hidden.bs.dropdown ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΠΉΡΡ ΡΠΏΠΈΡΠΎΠΊ ΠΏΠ΅ΡΠ΅ΡΡΠ°Π΅Ρ Π±ΡΡΡ ΡΠΊΡΡΡΡΠΌ ΠΎΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (Π±ΡΠ΄Π΅Ρ ΠΎΠΆΠΈΠ΄Π°ΡΡ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS).
$ ('# myDropdown'). On ('show.bs.dropdown', function () {
// ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ-Π½ΠΈΠ±ΡΠ΄Ρβ¦
})
@ ΠΆΠΈΡ
@mdo
ΠΎΠ΄Π½Π°
Π΄Π²Π°
ΡΡΠΈ
Π’ΡΠ΅Π±ΡΠ΅ΡΡΡ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅
position: relative;
Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅, Π·Π° ΠΊΠΎΡΠΎΡΡΠΌ Π²Ρ ΡΠΏΠΈΠΎΠ½ΠΈΡΠ΅. Π Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²Π΅ ΡΠ»ΡΡΠ°Π΅Π² ΡΡΠΎ
. ΠΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°Ρ
, ΠΎΡΠ»ΠΈΡΠ½ΡΡ
ΠΎΡ
, ΡΠ±Π΅Π΄ΠΈΡΠ΅ΡΡ, ΡΡΠΎ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π° ββΠ²ΡΡΠΎΡΠ° ,
ΠΈ overflow-y: scroll; ΠΠΎΠ΄Π°Π½ΠΎ
. Π§Π΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
data-spy = "scroll"
ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, Π·Π° ΠΊΠΎΡΠΎΡΡΠΌ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ ΡΠ»Π΅Π΄ΠΈΡΡ (ΡΠ°ΡΠ΅ Π²ΡΠ΅Π³ΠΎ ΡΡΠΎ
). ΠΠ°ΡΠ΅ΠΌ Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ Π°ΡΡΠΈΠ±ΡΡ data-target
Ρ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡΠΎΠΌ ΠΈΠ»ΠΈ ΠΊΠ»Π°ΡΡΠΎΠΌ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π»ΡΠ±ΠΎΠ³ΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ° Bootstrap .nav
.
body {
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅;
}
...
...
Π§Π΅ΡΠ΅Π· JavaScript
ΠΏΠΎΠ·ΠΈΡΠΈΡ: ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½Π°Ρ;
Π² Π²Π°ΡΠ΅ΠΌ CSS, Π²ΡΠ·ΠΎΠ²ΠΈΡΠ΅ scrollspy ΡΠ΅ΡΠ΅Π· JavaScript:
$ ('body'). Scrollspy ({target: '# navbar-example'})
ΠΠ΅ΡΠΎΠ΄Ρ
.scrollspy ('ΠΎΠ±Π½ΠΎΠ²ΠΈΡΡ')
$ ('[data-spy = "scroll"]').each (function () {
var $ spy = $ (ΡΡΠΎ) .scrollspy ('ΠΎΠ±Π½ΠΎΠ²ΠΈΡΡ')
})
ΠΠΏΡΠΈΠΈ
data-
, ΠΊΠ°ΠΊ Π² data-offset = ""
. ΠΠΌΡ ΡΠΈΠΏ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ Π½ΠΎΠΌΠ΅Ρ 10 ΠΠΈΠΊΡΠ΅Π»Π΅ΠΉ Π΄Π»Ρ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΡΠ²Π΅ΡΡ
Ρ ΠΏΡΠΈ Π²ΡΡΠΈΡΠ»Π΅Π½ΠΈΠΈ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ. Π‘ΠΎΠ±ΡΡΠΈΡ
Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ activate.bs.scrollspy ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π²ΡΡΠΊΠΈΠΉ ΡΠ°Π·, ΠΊΠΎΠ³Π΄Π° scrollspy Π°ΠΊΡΠΈΠ²ΠΈΡΡΠ΅Ρ Π½ΠΎΠ²ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ.
$ ('# myScrollspy'). On ('activate.bs.scrollspy', function () {
// ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ-Π½ΠΈΠ±ΡΠ΄Ρβ¦
})
ΠΡΠΈΠΌΠ΅ΡΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
$ ('# myTabs a').click (function (e) {
e.preventDefault ()
$ (ΡΡΠΎ) .tab ('ΠΏΠΎΠΊΠ°Π·Π°ΡΡ')
})
$ ('# myTabs a [href = "# profile"]'). Tab ('show') // ΠΡΠ±ΡΠ°ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ ΠΏΠΎ ΠΈΠΌΠ΅Π½ΠΈ
$ ('# myTabs a: first'). tab ('show') // ΠΡΠ±ΡΠ°ΡΡ ΠΏΠ΅ΡΠ²ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ
$ ('# myTabs a: last'). tab ('show') // ΠΡΠ±ΡΠ°ΡΡ ΠΏΠΎΡΠ»Π΅Π΄Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ
$ ('# myTabs li: eq (2) a'). tab ('show') // ΠΡΠ±ΡΠ°ΡΡ ΡΡΠ΅ΡΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ (Ρ ΠΈΠ½Π΄Π΅ΠΊΡΠΎΠΌ 0)
Π Π°Π·ΠΌΠ΅ΡΠΊΠ°
data-toggle = "tab"
ΠΈΠ»ΠΈ data-toggle = "pill"
Π΄Π»Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.ΠΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ ΠΊΠ»Π°ΡΡΠΎΠ² nav
ΠΈ nav-tabs
Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΡ ul
ΠΏΡΠΈΠΌΠ΅Π½ΠΈΡ ΡΡΠΈΠ»Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Bootstrap, Π° Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ ΠΊΠ»Π°ΡΡΠΎΠ² nav
ΠΈ nav-pills
ΠΏΡΠΈΠΌΠ΅Π½ΠΈΡ ΡΡΠΈΠ»Ρ ΡΠ°Π±Π»Π΅ΡΠΊΠΈ.
ΠΡΡΠ΅ΠΊΡ Π·Π°ΡΡΡ
Π°Π½ΠΈΡ
.fade
ΠΊ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ .tab-pane
. ΠΠ° ΠΏΠ΅ΡΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΡΠ°ΠΊΠΆΠ΅ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±ΡΡΡ .in
, ΡΡΠΎΠ±Ρ ΠΈΡΡ
ΠΎΠ΄Π½ΠΎΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π±ΡΠ»ΠΎ Π²ΠΈΠ΄ΠΈΠΌΡΠΌ.
ΠΠ΅ΡΠΎΠ΄Ρ
$ (). ΠΠΊΠ»Π°Π΄ΠΊΠ°
data-target
, Π»ΠΈΠ±ΠΎ href
, Π½Π°ΡΠ΅Π»Π΅Π½Π½ΡΠΉ Π½Π° ΡΠ·Π΅Π» ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° Π² DOM. Π ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΡΡ
Π²ΡΡΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΠ°Ρ
Π²ΠΊΠ»Π°Π΄ΠΊΠΈ — ΡΡΠΎ
s Ρ Π°ΡΡΠΈΠ±ΡΡΠ°ΠΌΠΈ data-toggle = "tab"
..tab ('ΠΏΠΎΠΊΠ°Π·Π°ΡΡ')
shown.bs.tab
).
$ ('# someTab'). Tab ('show')
Π‘ΠΎΠ±ΡΡΠΈΡ
ΡΠΊΡΡΡΡ.bs.tab
(Π½Π° ΡΠ΅ΠΊΡΡΠ΅ΠΉ Π°ΠΊΡΠΈΠ²Π½ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅) show.bs.tab
(Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ) hidden.bs.tab
(Π½Π° ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΉ Π°ΠΊΡΠΈΠ²Π½ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ ΡΠ°ΠΊΠ°Ρ ΠΆΠ΅, ΠΊΠ°ΠΊ Π΄Π»Ρ ΡΠΎΠ±ΡΡΠΈΡ hide.bs.tab
) shown.bs.tab
(Π½Π° Π½Π΅Π΄Π°Π²Π½ΠΎ Π°ΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉ ΡΠΎΠ»ΡΠΊΠΎ ΡΡΠΎ ΠΏΠΎΠΊΠ°Π·Π°Π½Π½ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ ΡΠ° ΠΆΠ΅, ΡΡΠΎ ΠΈ Π΄Π»Ρ ΡΠΎΠ±ΡΡΠΈΡ show.bs.tab
) hide.bs.tab
ΠΈ hidden.bs.tab
Π·Π°ΠΏΡΡΠΊΠ°ΡΡΡΡ Π½Π΅ Π±ΡΠ΄ΡΡ. Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ show.bs.tab ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ ΠΏΡΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ, Π½ΠΎ Π΄ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½ΠΎΠ²ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ event.target
ΠΈ event.relatedTarget
Π΄Π»Ρ ΡΠ°ΡΠ³Π΅ΡΠΈΠ½Π³Π° Π½Π° Π°ΠΊΡΠΈΠ²Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ ΠΈ ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΡΡ Π°ΠΊΡΠΈΠ²Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ (Π΅ΡΠ»ΠΈ Π΅ΡΡΡ) ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²Π΅Π½Π½ΠΎ. ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ.bs.tab ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ ΠΏΡΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²ΠΊΠ»Π°Π΄ΠΊΠ° Π±ΡΠ»Π° ΠΏΠΎΠΊΠ°Π·Π°Π½Π°.ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ event.target
ΠΈ event.relatedTarget
Π΄Π»Ρ ΡΠ°ΡΠ³Π΅ΡΠΈΠ½Π³Π° Π½Π° Π°ΠΊΡΠΈΠ²Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ ΠΈ ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΡΡ Π°ΠΊΡΠΈΠ²Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ (Π΅ΡΠ»ΠΈ Π΅ΡΡΡ) ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²Π΅Π½Π½ΠΎ. hide.bs.tab ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ, ΠΊΠΎΠ³Π΄Π° Π΄ΠΎΠ»ΠΆΠ½Π° Π±ΡΡΡ ΠΏΠΎΠΊΠ°Π·Π°Π½Π° Π½ΠΎΠ²Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ° (ΠΈ, ΡΠ»Π΅Π΄ΠΎΠ²Π°ΡΠ΅Π»ΡΠ½ΠΎ, ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ°Ρ Π°ΠΊΡΠΈΠ²Π½Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Π° Π±ΡΡΡ ΡΠΊΡΡΡΠ°). ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ event.target
ΠΈ event.relatedTarget
, ΡΡΠΎΠ±Ρ Π½Π°ΡΡΡΠΎΠΈΡΡ ΡΠ°ΡΠ³Π΅ΡΠΈΠ½Π³ Π½Π° ΡΠ΅ΠΊΡΡΡΡ Π°ΠΊΡΠΈΠ²Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ ΠΈ Π½ΠΎΠ²ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΠΊΠΎΡΠΎ ΡΡΠ°Π½Π΅Ρ Π°ΠΊΡΠΈΠ²Π½ΠΎΠΉ, ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²Π΅Π½Π½ΠΎ. ΡΠΊΡΡΡΠΎ.bs.tab ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ ΠΏΠΎΡΠ»Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½ΠΎΠ²ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ (ΠΈ, ΡΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ°Ρ Π°ΠΊΡΠΈΠ²Π½Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ° ΡΠΊΡΡΡΠ°). ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ event.target
ΠΈ event.relatedTarget
Π΄Π»Ρ Π½Π°ΡΠ΅Π»ΠΈΠ²Π°Π½ΠΈΡ Π½Π° ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΡΡ Π°ΠΊΡΠΈΠ²Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ ΠΈ Π½ΠΎΠ²ΡΡ Π°ΠΊΡΠΈΠ²Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²Π΅Π½Π½ΠΎ.
$ ('a [data-toggle = "tab"]'). On ('shown.bs.tab', function (e) {
e.target // Π½Π΅Π΄Π°Π²Π½ΠΎ Π°ΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°Π½Π½Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°
e.relatedTarget // ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ°Ρ Π°ΠΊΡΠΈΠ²Π½Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°
})
Π‘ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ°
Π§Π΅ΡΡΡΠ΅ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ
$ ('# example'). Tooltip (options)
Markup
Π΄Π°Π½Π½ΡΡ
,
ΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ,
Π² ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ HTML, Π΄Π»Ρ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ ΠΈΠΌΠ΅ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ. Π‘Π³Π΅Π½Π΅ΡΠΈΡΠΎΠ²Π°Π½Π½Π°Ρ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠ° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Π΄ΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ ΠΏΡΠΎΡΡΠ°, Ρ
ΠΎΡΡ Π΄Π»Ρ Π½Π΅Π΅ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΠΏΠΎΠ·ΠΈΡΠΈΡ (ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ top
).
ΠΠ°Π²Π΅Π΄ΠΈΡΠ΅ ΡΠΊΠ°Π·Π°ΡΠ΅Π»Ρ ΠΌΡΡΠΈ Π½Π° ΠΌΠ΅Π½Ρ
ΠΠΏΡΠΈΠΈ
data-
, ΠΊΠ°ΠΊ Π² data-animation = ""
. ΠΠΌΡ Π’ΠΈΠΏ ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠ°Π²Π΄Π° ΠΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° CSS ΠΏΠΎΡΡΠ΅ΠΏΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΊ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ΅ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ ΡΡΡΠΎΠΊΠ° | Π»ΠΎΠΆΠ½ΡΠΉ Π»ΠΎΠΆΡ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ: 'body'
. ΠΡΠΎΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ ΠΏΠΎΠ»Π΅Π·Π΅Π½ ΡΠ΅ΠΌ, ΡΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΠΌ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ Π² ΠΏΠΎΡΠΎΠΊΠ΅ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ° ΡΡΠ΄ΠΎΠΌ Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ Π·Π°ΠΏΡΡΠΊΠ°, ΡΡΠΎ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠΈΡ ΠΎΡΡΡΠ² Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΎΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π·Π°ΠΏΡΡΠΊΠ° Π²ΠΎ Π²ΡΠ΅ΠΌΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΠΎΠΊΠ½Π°. Π·Π°Π΄Π΅ΡΠΆΠΊΠ° ΠΠΎΠΌΠ΅Ρ | ΠΎΠ±ΡΠ΅ΠΊΡ 0 Π·Π°Π΄Π΅ΡΠΆΠΊΠ°: {"show": 500, "hide": 100}
HTML Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π»ΠΎΠΆΡ ΠΡΡΠ°Π²ΡΡΠ΅ HTML Π²ΠΎ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΡ.ΠΡΠ»ΠΈ false, ΠΌΠ΅ΡΠΎΠ΄ jQuery text
Π±ΡΠ΄Π΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π΄Π»Ρ Π²ΡΡΠ°Π²ΠΊΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Π² DOM. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΠ΅ΠΊΡΡ, Π΅ΡΠ»ΠΈ Π²Π°Ρ Π±Π΅ΡΠΏΠΎΠΊΠΎΡΡ XSS-Π°ΡΠ°ΠΊΠΈ. ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΡΡΡΠΎΠΊΠ° | ΡΡΠ½ΠΊΡΠΈΡ ‘Π²Π΅ΡΡ
’
ΠΡΠ»ΠΈ Π·Π°Π΄Π°Π½ΠΎ Β«Π°Π²ΡΠΎΒ», Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° Π±ΡΠ΄Π΅Ρ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠ΅ΡΠ΅ΠΎΡΠΈΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½Π°. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π΅ΡΠ»ΠΈ Π΄Π»Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ Π²ΡΠ±ΡΠ°Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Β«Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π²Π»Π΅Π²ΠΎΒ», Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ ΡΠ»Π΅Π²Π°, ΠΊΠΎΠ³Π΄Π° ΡΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π² ΠΏΡΠΎΡΠΈΠ²Π½ΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ — ΡΠΏΡΠ°Π²Π°. ΠΈ ΡΡΠΎΡ
ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ Π΄Π»Ρ ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ. ΡΠ΅Π»Π΅ΠΊΡΠΎΡ ΡΡΡΠΎΠΊΠ° Π»ΠΎΠΆΡ ΠΡΠ»ΠΈ ΠΏΡΠ΅Π΄ΡΡΠΌΠΎΡΡΠ΅Π½ ΡΠ΅Π»Π΅ΠΊΡΠΎΡ, ΠΎΠ±ΡΠ΅ΠΊΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Π±ΡΠ΄ΡΡ Π΄Π΅Π»Π΅Π³ΠΈΡΠΎΠ²Π°Π½Ρ ΡΠΊΠ°Π·Π°Π½Π½ΡΠΌ ΡΠ΅Π»ΡΠΌ. ΠΠ° ΠΏΡΠ°ΠΊΡΠΈΠΊΠ΅ ΡΡΠΎ ΡΠ°ΠΊΠΆΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ ΠΊ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΠΌΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ DOM ( jQuery.Π½Π° ΠΎΠΏΠΎΡΠ΅
). Π‘ΠΌ. ΠΡΠΎΡ ΠΈ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠ²Π½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ. ΡΠ°Π±Π»ΠΎΠ½ ΡΡΡΠΎΠΊΠ° '
Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ
Π±ΡΠ΄Π΅Ρ Π²ΡΡΠ°Π²Π»Π΅Π½ Π² .tooltip-inner
. .tooltip-arrow
ΡΡΠ°Π½Π΅Ρ ΡΡΡΠ΅Π»ΠΊΠΎΠΉ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ. .tooltip
. Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΡΡΡΠΎΠΊΠ° | ΡΡΠ½ΠΊΡΠΈΡ ‘ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ
ΠΎΡΡΡΡΡΡΠ²ΡΠ΅Ρ. ΠΈ ΡΡΠΎΠΉ
ΡΡΡΠ»ΠΊΠΎΠΉ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΊ ΠΊΠΎΡΠΎΡΠΎΠΌΡ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ°. ΡΡΠΈΠ³Π³Π΅Ρ ΡΡΡΠΎΠΊΠ° ‘hover focus’ ΠΠ°ΠΊ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° — ΡΠ΅Π»ΠΊΠ½ΠΈΡΠ΅ | Π·Π°Π²ΠΈΡΠ°ΡΡ | ΡΠΎΠΊΡΡ | ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²ΠΎ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠ΅ΡΠ΅Π΄Π°ΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΠΈΠ³Π³Π΅ΡΠΎΠ²; ΡΠ°Π·Π΄Π΅Π»ΠΈΡΠ΅ ΠΈΡ
ΠΏΡΠΎΠ±Π΅Π»ΠΎΠΌ. ΡΡΡΠ½ΠΎΠΉ
Π½Π΅Π»ΡΠ·Ρ ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡΠΎΠ²Π°ΡΡ Ρ ΠΊΠ°ΠΊΠΈΠΌ-Π»ΠΈΠ±ΠΎ Π΄ΡΡΠ³ΠΈΠΌ ΡΠΏΡΡΠΊΠΎΠ²ΡΠΌ ΠΊΡΡΡΠΊΠΎΠΌ. ΠΎΠΊΠ½ΠΎ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° ΡΡΡΠΎΠΊΠ° | ΠΎΠ±ΡΠ΅ΠΊΡ | ΡΡΠ½ΠΊΡΠΈΡ {ΡΠ΅Π»Π΅ΠΊΡΠΎΡ: ‘ΡΠ΅Π»ΠΎ’, ΠΎΡΡΡΡΠΏ: 0} viewport: '#viewport'
ΠΈΠ»ΠΈ {"selector": "#viewport", "padding": 0}
ΠΈ ΡΡΠΎΡ
ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ Π΄Π»Ρ ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ. ΠΏΡΠΎΠ΄Π΅Π·ΠΈΠ½ΡΠΈΡΠΈΡΠΎΠ²Π°ΡΡ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠ°Π²Π΄Π° ΠΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΈΠ»ΠΈ ΠΎΡΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΎΡΠΈΡΡΠΊΠΈ. ΠΡΠ»ΠΈ Π°ΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°Π½ Β«ΡΠ°Π±Π»ΠΎΠ½Β»
, Β«ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅Β»
ΠΈ Β«Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊΒ»
ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ Π±ΡΠ΄ΡΡ ΠΎΡΠΈΡΠ΅Π½Ρ. Π±Π΅Π»ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ ΠΎΠ±ΡΠ΅ΠΊΡ ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΠ±ΡΠ΅ΠΊΡ, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΠΉ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½Π½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΠΈ ΡΠ΅Π³ΠΈ sanitizeFn null | ΡΡΠ½ΠΊΡΠΈΡ null ΠΠ΄Π΅ΡΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΊΠ°Π·Π°ΡΡ ΡΠ²ΠΎΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ ΡΡΠ½ΠΊΡΠΈΡ Π΄Π΅Π·ΠΈΠ½ΡΠ΅ΠΊΡΠΈΠΈ. ΠΡΠΎ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ, Π΅ΡΠ»ΠΈ Π²Ρ ΠΏΡΠ΅Π΄ΠΏΠΎΡΠΈΡΠ°Π΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΡ Π΄Π»Ρ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ ΠΎΡΠΈΡΡΠΊΠΈ. ΠΠ΅ΡΠΎΠ΄Ρ
$ ().Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° (ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ)
.tooltip ('ΠΏΠΎΠΊΠ°Π·Π°ΡΡ')
shown.bs.tooltip
). ΠΡΠΎ ΡΡΠΈΡΠ°Π΅ΡΡΡ «ΡΡΡΠ½ΡΠΌ» Π·Π°ΠΏΡΡΠΊΠΎΠΌ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ. ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Ρ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°ΠΌΠΈ Π½ΡΠ»Π΅Π²ΠΎΠΉ Π΄Π»ΠΈΠ½Ρ Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ.
$ ('# element'). Tooltip ('show')
.Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° ('ΡΠΊΡΡΡΡ')
hidden.bs.tooltip
). ΠΡΠΎ ΡΡΠΈΡΠ°Π΅ΡΡΡ «ΡΡΡΠ½ΡΠΌ» Π·Π°ΠΏΡΡΠΊΠΎΠΌ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ.
$ ('# element'). Tooltip ('hide')
.tooltip ('toggle')
shown.bs.tooltip
ΠΈΠ»ΠΈ hidden.bs.tooltip
). ΠΡΠΎ ΡΡΠΈΡΠ°Π΅ΡΡΡ «ΡΡΡΠ½ΡΠΌ» Π·Π°ΠΏΡΡΠΊΠΎΠΌ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ.
$ ('# element'). Tooltip ('toggle')
.tooltip ('destroy')
), Π½Π΅ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ ΡΠ½ΠΈΡΡΠΎΠΆΠ΅Π½Ρ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΠΎ Π΄Π»Ρ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΡ
ΡΡΠΈΠ³Π³Π΅ΡΠ½ΡΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ².
$ ('# ΡΠ»Π΅ΠΌΠ΅Π½Ρ').tooltip ('destroy')
Π‘ΠΎΠ±ΡΡΠΈΡ
Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ.bs.tooltip ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅ ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° ΠΠΎΠΊΠ°Π·Π°Π½ΠΎ show
..bs.tooltip ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π²ΠΈΠ΄ΠΈΠΌΠΎΠΉ Π΄Π»Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (ΠΎΠΆΠΈΠ΄Π°Π΅Ρ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS). hide.bs.tooltip ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΡΡΠ°Π·Ρ ΠΏΠΎΡΠ»Π΅ Π²ΡΠ·ΠΎΠ²Π° ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° hide
. hidden.bs.tooltip ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ° ΠΏΠ΅ΡΠ΅ΡΡΠ°Π»Π° Π±ΡΡΡ ΡΠΊΡΡΡΠΎΠΉ ΠΎΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (Π±ΡΠ΄Π΅Ρ ΠΎΠΆΠΈΠ΄Π°ΡΡ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS). Insert.bs.tooltip ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ±ΡΡΠΈΡ show.bs.tooltip
, ΠΊΠΎΠ³Π΄Π° ΡΠ°Π±Π»ΠΎΠ½ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΉ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ Π±ΡΠ» Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ Π² DOM.
$ ('# myTooltip'). On ('hidden.bs.tooltip', function () {
// ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ-Π½ΠΈΠ±ΡΠ΄Ρβ¦
})
ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΏΠΎΠ΄ΠΏΠΈΡΠΊΠΈ
data-toggle
:
$ (function () {
$ ('[data-toggle = "popover"]'). popover ()
})
ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π° Π² Π³ΡΡΠΏΠΏΠ°Ρ
ΠΊΠ½ΠΎΠΏΠΎΠΊ, Π³ΡΡΠΏΠΏΠ°Ρ
Π²Π²ΠΎΠ΄Π° ΠΈ ΡΠ°Π±Π»ΠΈΡΠ°Ρ
ΡΡΠ΅Π±ΡΡΡ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΠΎΠΉ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ
.btn-group
ΠΈΠ»ΠΈ .input-group
, ΠΈΠ»ΠΈ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°Ρ
, ΡΠ²ΡΠ·Π°Π½Π½ΡΡ
Ρ ΡΠ°Π±Π»ΠΈΡΠ°ΠΌΠΈ ( , , , < thead>
, ,
), Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΡΠΊΠ°Π·Π°ΡΡ ΠΎΠΏΡΠΈΡ
container: 'body'
(Π·Π°Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½ΠΎ Π½ΠΈΠΆΠ΅), ΡΡΠΎΠ±Ρ ΠΈΠ·Π±Π΅ΠΆΠ°ΡΡ Π½Π΅ΠΆΠ΅Π»Π°ΡΠ΅Π»ΡΠ½ΡΡ
ΠΏΠΎΠ±ΠΎΡΠ½ΡΡ
ΡΡΡΠ΅ΠΊΡΠΎΠ² (ΡΠ°ΠΊΠΈΡ
ΠΊΠ°ΠΊ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΈ / ΠΈΠ»ΠΈ ΡΠ΅ΡΡΠ΅Ρ Π·Π°ΠΊΡΡΠ³Π»Π΅Π½Π½ΡΠ΅ ΡΠ³Π»Ρ ΠΏΡΠΈ ΡΡΠ°Π±Π°ΡΡΠ²Π°Π½ΠΈΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°). ΠΠ΅ ΠΏΡΡΠ°ΠΉΡΠ΅ΡΡ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π° Π½Π° ΡΠΊΡΡΡΡΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°Ρ
$ (...). Popover ('show')
, ΠΊΠΎΠ³Π΄Π° ΡΠ΅Π»Π΅Π²ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ - display: none;
ΠΏΡΠΈΠ²Π΅Π΄Π΅Ρ ΠΊ Π½Π΅ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠΌΡ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°. ΠΠ»Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΎΠΊΠΎΠ½ Π½Π° ΠΎΡΠΊΠ»ΡΡΠ΅Π½Π½ΡΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°Ρ
ΡΡΠ΅Π±ΡΡΡΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΎΠ±ΠΎΠ»ΠΎΡΠΊΠΈ
disabled
ΠΈΠ»ΠΈ .disabled
, ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π²Π½ΡΡΡΠΈ ΠΠ½ΠΎΠ³ΠΎΡΡΡΠΎΡΠ½ΡΠ΅ ΡΡΡΠ»ΠΊΠΈ
ΠΏΡΠΎΠ±Π΅Π»ΠΎΠ²: nowrap;
ΠΊ Π²Π°ΡΠΈΠΌ ΡΠΊΠΎΡΡΠΌ, ΡΡΠΎΠ±Ρ ΠΈΠ·Π±Π΅ΠΆΠ°ΡΡ ΡΡΠΎΠ³ΠΎ. ΠΡΠΈΠΌΠ΅ΡΡ
Π‘ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ
Π’ΠΎΠΏ Ρ ΠΎΡΠΊΡΡΡΠΎΠΉ ΡΠΏΠΈΠ½ΠΎΠΉ
ΠΠΎΠΏΠΎΠ²Π΅Ρ ΠΏΡΠ°Π²ΡΠΉ
ΠΡΠ΄Π²ΠΈΠΆΠ½ΠΎΠΉ Π½ΠΈΠ·
ΠΠΎΠΏΠΎΠ²Π΅Ρ ΡΠ»Π΅Π²Π°
ΠΠΈΠ²Π°Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
Π§Π΅ΡΡΡΠ΅ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ
ΠΠ°ΠΊΡΡΡΡ ΠΏΡΠΈ ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ Π½Π°ΠΆΠ°ΡΠΈΠΈ
focus
, ΡΡΠΎΠ±Ρ Π·Π°ΠΊΡΡΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π° ΠΏΡΠΈ ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ ΡΠ΅Π»ΡΠΊΠ΅, ΡΠ΄Π΅Π»Π°Π½Π½ΠΎΠΌ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ. Π‘ΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½Π°Ρ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠ°, Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠ°Ρ Π΄Π»Ρ Π·Π°ΠΊΡΡΡΠΈΡ ΠΏΡΠΈ ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ Π½Π°ΠΆΠ°ΡΠΈΠΈ
, , Π° Π½Π΅ ΡΠ΅Π³
, Π° ΡΠ°ΠΊΠΆΠ΅ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ Π²ΠΊΠ»ΡΡΠΈΡΡ role = "button"
ΠΈ tabindex
Π°ΡΡΠΈΠ±ΡΡΠΎΠ².
Π Π°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π΅ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
$ ('# example'). Popover (options)
Options
data-
, ΠΊΠ°ΠΊ Π² data-animation = ""
. sanitize
, sanitizeFn
ΠΈ whiteList
Π½Π΅ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½Ρ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π΄Π°Π½Π½ΡΡ
. ΠΠΌΡ Π’ΠΈΠΏ ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠ°Π²Π΄Π° ΠΡΠΈΠΌΠ΅Π½ΠΈΡΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ CSS fade ΠΊ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅ΠΌΡ ΠΎΠΊΠ½Ρ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ ΡΡΡΠΎΠΊΠ° | Π»ΠΎΠΆΠ½ΡΠΉ Π»ΠΎΠΆΡ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ: 'body'
. ΠΡΠΎΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ ΠΏΠΎΠ»Π΅Π·Π΅Π½ ΡΠ΅ΠΌ, ΡΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΠΌ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ Π² ΠΏΠΎΡΠΎΠΊΠ΅ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ° ΡΡΠ΄ΠΎΠΌ Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ Π·Π°ΠΏΡΡΠΊΠ°, ΡΡΠΎ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠ°Π΅Ρ ΠΎΡΡΡΠ² Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π° ΠΎΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π·Π°ΠΏΡΡΠΊΠ° Π²ΠΎ Π²ΡΠ΅ΠΌΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΠΎΠΊΠ½Π°. ΡΠΎΠ΄Π΅ΡΠΆΠ°Π½ΠΈΠ΅ ΡΡΡΠΎΠΊΠ° | ΡΡΠ½ΠΊΡΠΈΡ ' data-content
ΠΎΡΡΡΡΡΡΠ²ΡΠ΅Ρ. this
, ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΠΎΠΉ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΊ ΠΊΠΎΡΠΎΡΠΎΠΌΡ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½ΠΎ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ. Π·Π°Π΄Π΅ΡΠΆΠΊΠ° ΠΠΎΠΌΠ΅Ρ | ΠΎΠ±ΡΠ΅ΠΊΡ 0 Π·Π°Π΄Π΅ΡΠΆΠΊΠ°: {"show": 500, "hide": 100}
HTML Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π»ΠΎΠΆΡ ΠΡΡΠ°Π²ΠΈΡΡ HTML Π²ΠΎ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ.ΠΡΠ»ΠΈ false, ΠΌΠ΅ΡΠΎΠ΄ jQuery text
Π±ΡΠ΄Π΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π΄Π»Ρ Π²ΡΡΠ°Π²ΠΊΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Π² DOM. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΠ΅ΠΊΡΡ, Π΅ΡΠ»ΠΈ Π²Π°Ρ Π±Π΅ΡΠΏΠΎΠΊΠΎΡΡ XSS-Π°ΡΠ°ΠΊΠΈ. ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΡΡΡΠΎΠΊΠ° | ΡΡΠ½ΠΊΡΠΈΡ 'ΠΏΡΠ°Π²ΡΠΉ'
ΠΠΎΠ³Π΄Π° ΡΠΊΠ°Π·Π°Π½ΠΎ Β«autoΒ», Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ Π±ΡΠ΄Π΅Ρ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠ΅ΡΠ΅ΠΎΡΠΈΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½ΠΎ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π΅ΡΠ»ΠΈ Π΄Π»Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ Π²ΡΠ±ΡΠ°Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Β«Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π²Π»Π΅Π²ΠΎΒ», Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ ΡΠ»Π΅Π²Π°, ΠΊΠΎΠ³Π΄Π° ΡΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π² ΠΏΡΠΎΡΠΈΠ²Π½ΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ ΠΎΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ ΡΠΏΡΠ°Π²Π°. ΠΈ ΡΡΠΎΡ
ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ Π΄Π»Ρ ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°. ΡΠ΅Π»Π΅ΠΊΡΠΎΡ ΡΡΡΠΎΠΊΠ° Π»ΠΎΠΆΡ ΠΡΠ»ΠΈ ΠΏΡΠ΅Π΄ΡΡΠΌΠΎΡΡΠ΅Π½ ΡΠ΅Π»Π΅ΠΊΡΠΎΡ, Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠ±ΡΠ΅ΠΊΡΡ Π±ΡΠ΄ΡΡ Π΄Π΅Π»Π΅Π³ΠΈΡΠΎΠ²Π°Π½Ρ ΡΠΊΠ°Π·Π°Π½Π½ΡΠΌ ΡΠ΅Π»ΡΠΌ. ΠΠ° ΠΏΡΠ°ΠΊΡΠΈΠΊΠ΅ ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ Π²ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΎΠΊΠΎΠ½ Π² Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠΉ HTML-ΠΊΠΎΠ½ΡΠ΅Π½Ρ.Π‘ΠΌ. ΠΡΠΎΡ ΠΈ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠ²Π½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ. ΡΠ°Π±Π»ΠΎΠ½ ΡΡΡΠΎΠΊΠ° '
Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°
Π±ΡΠ΄Π΅Ρ Π²ΡΡΠ°Π²Π»Π΅Π½ Π² .popover-title
. Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°
Π±ΡΠ΄Π΅Ρ Π²ΡΡΠ°Π²Π»Π΅Π½ΠΎ Π² .ΠΠΎΠΏΠΎΠ²Π΅Ρ-ΠΊΠΎΠ½ΡΠ΅Π½Ρ
. .arrow
ΡΡΠ°Π½Π΅Ρ ΡΡΡΠ΅Π»ΠΊΠΎΠΉ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°. .popover
. Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΡΡΡΠΎΠΊΠ° | ΡΡΠ½ΠΊΡΠΈΡ ' Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ
ΠΎΡΡΡΡΡΡΠ²ΡΠ΅Ρ. this
, ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΠΎΠΉ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΊ ΠΊΠΎΡΠΎΡΠΎΠΌΡ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½ΠΎ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ. ΡΡΠΈΠ³Π³Π΅Ρ ΡΡΡΠΎΠΊΠ° 'Π½Π°ΠΆΠΌΠΈΡΠ΅' ΠΠ°ΠΊ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ - ΡΠ΅Π»ΠΊΠ½ΠΈΡΠ΅ | Π·Π°Π²ΠΈΡΠ°ΡΡ | ΡΠΎΠΊΡΡ | ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²ΠΎ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠ΅ΡΠ΅Π΄Π°ΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΠΈΠ³Π³Π΅ΡΠΎΠ²; ΡΠ°Π·Π΄Π΅Π»ΠΈΡΠ΅ ΠΈΡ
ΠΏΡΠΎΠ±Π΅Π»ΠΎΠΌ. ΡΡΡΠ½ΠΎΠΉ
Π½Π΅Π»ΡΠ·Ρ ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡΠΎΠ²Π°ΡΡ Ρ ΠΊΠ°ΠΊΠΈΠΌ-Π»ΠΈΠ±ΠΎ Π΄ΡΡΠ³ΠΈΠΌ ΡΠΏΡΡΠΊΠΎΠ²ΡΠΌ ΠΊΡΡΡΠΊΠΎΠΌ. ΠΎΠΊΠ½ΠΎ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° ΡΡΡΠΎΠΊΠ° | ΠΎΠ±ΡΠ΅ΠΊΡ | ΡΡΠ½ΠΊΡΠΈΡ {ΡΠ΅Π»Π΅ΠΊΡΠΎΡ: 'ΡΠ΅Π»ΠΎ', ΠΎΡΡΡΡΠΏ: 0} viewport: '#viewport'
ΠΈΠ»ΠΈ {"selector": "#viewport", "padding": 0}
ΠΈ ΡΡΠΎΡ
ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ Π΄Π»Ρ ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°. ΠΏΡΠΎΠ΄Π΅Π·ΠΈΠ½ΡΠΈΡΠΈΡΠΎΠ²Π°ΡΡ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠ°Π²Π΄Π° ΠΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΈΠ»ΠΈ ΠΎΡΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΎΡΠΈΡΡΠΊΠΈ. ΠΡΠ»ΠΈ Π°ΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°Π½ Β«ΡΠ°Π±Π»ΠΎΠ½Β»
, Β«ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅Β»
ΠΈ Β«Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊΒ»
ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ Π±ΡΠ΄ΡΡ ΠΎΡΠΈΡΠ΅Π½Ρ. Π±Π΅Π»ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ ΠΎΠ±ΡΠ΅ΠΊΡ ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΠ±ΡΠ΅ΠΊΡ, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΠΉ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½Π½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΠΈ ΡΠ΅Π³ΠΈ sanitizeFn null | ΡΡΠ½ΠΊΡΠΈΡ null ΠΠ΄Π΅ΡΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΊΠ°Π·Π°ΡΡ ΡΠ²ΠΎΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ ΡΡΠ½ΠΊΡΠΈΡ Π΄Π΅Π·ΠΈΠ½ΡΠ΅ΠΊΡΠΈΠΈ. ΠΡΠΎ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ, Π΅ΡΠ»ΠΈ Π²Ρ ΠΏΡΠ΅Π΄ΠΏΠΎΡΠΈΡΠ°Π΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΡΡ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΡ Π΄Π»Ρ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ ΠΎΡΠΈΡΡΠΊΠΈ. ΠΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
Π΄Π»Ρ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ
Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΎΠΊΠΎΠ½
ΠΠ΅ΡΠΎΠ΄Ρ
$ (). ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ (ΠΎΠΏΡΠΈΠΈ)
.popover ('ΠΏΠΎΠΊΠ°Π·Π°ΡΡ')
shown.bs.popover
). ΠΡΠΎ ΡΡΠΈΡΠ°Π΅ΡΡΡ "ΡΡΡΠ½ΡΠΌ" Π·Π°ΠΏΡΡΠΊΠΎΠΌ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°. ΠΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π°, Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΠΊΠΎΡΠΎΡΡΡ
ΠΈΠΌΠ΅ΡΡ Π½ΡΠ»Π΅Π²ΡΡ Π΄Π»ΠΈΠ½Ρ, Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ.
$ ('# ΡΠ»Π΅ΠΌΠ΅Π½Ρ'). Popover ('ΠΏΠΎΠΊΠ°Π·Π°ΡΡ')
.popover ('ΡΠΊΡΡΡΡ')
hidden.bs.popover
). ΠΡΠΎ ΡΡΠΈΡΠ°Π΅ΡΡΡ "ΡΡΡΠ½ΡΠΌ" Π·Π°ΠΏΡΡΠΊΠΎΠΌ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°.
$ ('# ΡΠ»Π΅ΠΌΠ΅Π½Ρ'). Popover ('ΡΠΊΡΡΡΡ')
.popover ('ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΡ')
shown.bs.popover
ΠΈΠ»ΠΈ hidden.bs.popover
). ΠΡΠΎ ΡΡΠΈΡΠ°Π΅ΡΡΡ "ΡΡΡΠ½ΡΠΌ" Π·Π°ΠΏΡΡΠΊΠΎΠΌ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°.
$ ('# ΡΠ»Π΅ΠΌΠ΅Π½Ρ'). Popover ('ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅')
.popover ('ΡΠ½ΠΈΡΡΠΎΠΆΠΈΡΡ')
), Π½Π΅ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ ΡΠ½ΠΈΡΡΠΎΠΆΠ΅Π½Ρ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΠΎ Π΄Π»Ρ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΡ
ΡΡΠΈΠ³Π³Π΅ΡΠ½ΡΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ².
$ ('# element'). Popover ('destroy')
Π‘ΠΎΠ±ΡΡΠΈΡ
Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ show.bs.popover ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅ ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° show
. ΠΠΎΠΊΠ°Π·Π°Π½ΠΎ .bs.popover ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π²ΠΈΠ΄ΠΈΠΌΡΠΌ Π΄Π»Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (ΠΎΠΆΠΈΠ΄Π°Π΅Ρ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS). hide.bs.popover ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΡΡΠ°Π·Ρ ΠΏΠΎΡΠ»Π΅ Π²ΡΠ·ΠΎΠ²Π° ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° hide
. hidden.bs.popover ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΡΡΠ°Π»ΠΎ Π±ΡΡΡ ΡΠΊΡΡΡΡΠΌ ΠΎΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (Π±ΡΠ΄Π΅Ρ ΠΎΠΆΠΈΠ΄Π°ΡΡ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS). Π²ΡΡΠ°Π²Π»Π΅Π½ΠΎ.bs.popover ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ±ΡΡΠΈΡ show.bs.popover
, ΠΊΠΎΠ³Π΄Π° ΡΠ°Π±Π»ΠΎΠ½ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π° Π±ΡΠ» Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ Π² DOM.
$ ('# myPopover'). On ('hidden.bs.popover', function () {
// ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ-Π½ΠΈΠ±ΡΠ΄Ρβ¦
})
ΠΡΠΈΠΌΠ΅ΡΡ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠΉ
.close
ΠΎΠ½Π° Π΄ΠΎΠ»ΠΆΠ½Π° Π±ΡΡΡ ΠΏΠ΅ΡΠ²ΡΠΌ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ .alert-dishibited
, ΠΈ ΠΏΠ΅ΡΠ΅Π΄ Π½Π΅ΠΉ Π² ΡΠ°Π·ΠΌΠ΅ΡΠΊΠ΅ Π½Π΅ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±ΡΡΡ ΡΠ΅ΠΊΡΡΠΎΠ²ΠΎΠ³ΠΎ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ. ΠΡ
Π΄Π°! Π£ Π²Π°Ρ ΠΎΡΠΈΠ±ΠΊΠ°!
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
data-dismiss = "alert"
ΠΊ ΠΊΠ½ΠΎΠΏΠΊΠ΅ Π·Π°ΠΊΡΡΡΠΈΡ, ΡΡΠΎΠ±Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π²ΠΊΠ»ΡΡΠΈΡΡ ΡΡΠ½ΠΊΡΠΈΡ Π·Π°ΠΊΡΡΡΠΈΡ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΡ.ΠΡΠΈ Π·Π°ΠΊΡΡΡΠΈΠΈ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΡ ΠΎΠ½ΠΎ ΡΠ΄Π°Π»ΡΠ΅ΡΡΡ ΠΈΠ· ΠΌΠΎΠ΄Π΅Π»ΠΈ DOM.
.fade
ΠΈ .in
. ΠΠ΅ΡΠΎΠ΄Ρ
$ (). Alert ()
data-dismiss = "alert"
.(ΠΠ΅ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΠΏΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠΉ ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·Π°ΡΠΈΠΈ data-api.) $ (). Alert ('Π·Π°ΠΊΡΡΡΡ')
.fade
ΠΈ .in
, ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠ΅ ΠΈΡΡΠ΅Π·Π½Π΅Ρ, ββΠΏΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ ΠΎΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΡΠ΄Π°Π»Π΅Π½ΠΎ. Π‘ΠΎΠ±ΡΡΠΈΡ
ΠΠ»Π°Π³ΠΈΠ½ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠΉ Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ Π·Π°ΠΊΡΡΡΡ.bs.alert ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅ ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° close
. closed.bs.alert ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠ΅ Π±ΡΠ»ΠΎ Π·Π°ΠΊΡΡΡΠΎ (Π±ΡΠ΄Π΅Ρ ΠΎΠΆΠΈΠ΄Π°ΡΡ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS).
$ ('# myAlert'). On ('closed.bs.alert', function () {
// ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ-Π½ΠΈΠ±ΡΠ΄Ρβ¦
})
Π‘ΠΎΡΡΠΎΡΠ½ΠΈΠ΅
data-loading-text = "Loading ..."
, ΡΡΠΎΠ±Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ Π·Π°Π³ΡΡΠ·ΠΊΠΈ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΊΠΈ.
<ΡΡΠ΅Π½Π°ΡΠΈΠΉ>
$ ('# myButton'). on ('ΡΠ΅Π»ΡΠΎΠΊ', function () {
var $ btn = $ (ΡΡΠΎ) .button ('Π·Π°Π³ΡΡΠ·ΠΊΠ°')
// Π±ΠΈΠ·Π½Π΅Ρ-Π»ΠΎΠ³ΠΈΠΊΠ°...
$ btn.button ('ΡΠ±ΡΠΎΡΠΈΡΡ')
})
ΠΠ΄ΠΈΠ½ΠΎΡΠ½ΡΠΉ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»Ρ
data-toggle = "button"
, ΡΡΠΎΠ±Ρ Π°ΠΊΡΠΈΠ²ΠΈΡΠΎΠ²Π°ΡΡ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ Π½Π° ΠΎΠ΄Π½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠ΅. ΠΠ»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ Ρ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ΠΌ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ
.active
ΠΈ aria -olved = "true"
.active
ΠΈ Π°ΡΡΠΈΠ±ΡΡ aria -hibited = "true"
ΠΊ ΠΊΠ½ΠΎΠΏΠΊΠ΅
.
Π€Π»Π°ΠΆΠΎΠΊ / Π Π°Π΄ΠΈΠΎ
data-toggle = "buttons"
Π² .btn-group
, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠ°Ρ ΡΠ»Π°ΠΆΠΎΠΊ ΠΈΠ»ΠΈ ΡΠ°Π΄ΠΈΠΎ-Π²Ρ
ΠΎΠ΄Ρ Π΄Π»Ρ Π²ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ Π² ΠΈΡ
ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΡ
ΡΡΠΈΠ»ΡΡ
. Π’ΡΠ΅Π±ΡΡΡΡΡ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π²ΡΠ±ΡΠ°Π½Π½ΡΠ΅ ΠΎΠΏΡΠΈΠΈ
.Π°ΠΊΡΠΈΠ²Π½ΡΠΉ
.active
ΠΊ ΠΌΠ΅ΡΠΊΠ΅ Π²Ρ
ΠΎΠ΄Π°
. Π‘ΠΎΡΡΠΎΡΠ½ΠΈΠ΅ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΠΎΠΉ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΎΠ±Π½ΠΎΠ²Π»ΡΠ΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ
click
Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅ (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ,ΡΠ΅ΡΠ΅Π·
ΠΈΠ»ΠΈ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΠ² ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ checked
Π΄Π»Ρ Π²Ρ
ΠΎΠ΄Π°), Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΡ ΠΊΠ»Π°ΡΡ .active
Π½Π° ΠΌΠ΅ΡΠΊΡ Π²Ρ
ΠΎΠ΄Π°
.
ΠΠ΅ΡΠΎΠ΄Ρ
$ ().ΠΊΠ½ΠΎΠΏΠΊΠ° ('ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅')
$ (). ΠΠ½ΠΎΠΏΠΊΠ° ('ΡΠ±ΡΠΎΡ')
$ (). ΠΠ½ΠΎΠΏΠΊΠ° (ΡΡΡΠΎΠΊΠ°)
<ΡΡΠ΅Π½Π°ΡΠΈΠΉ>
$ ('# myStateButton'). on ('ΡΠ΅Π»ΡΠΎΠΊ', function () {
$ (this) .button ('complete') // ΡΠ΅ΠΊΡΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ Π±ΡΠ΄Π΅Ρ "Π³ΠΎΡΠΎΠ²ΠΎ!"
})
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΡ ΠΏΠ»Π°Π³ΠΈΠ½Π°
ΠΡΠΈΠΌΠ΅Ρ
.ΡΠ²Π΅ΡΠ½ΡΡΡ
ΡΠΊΡΡΠ²Π°Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅. Π‘Π²Π΅ΡΡΡΠ²Π°Π½ΠΈΠ΅
ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π²ΠΎ Π²ΡΠ΅ΠΌΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² .collapse.in
ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ href
ΠΈΠ»ΠΈ ΠΊΠ½ΠΎΠΏΠΊΡ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ data-target
. Π ΠΎΠ±ΠΎΠΈΡ
ΡΠ»ΡΡΠ°ΡΡ
ΡΡΠ΅Π±ΡΠ΅ΡΡΡ data-toggle = "collapse"
.
Π‘ΡΡΠ»ΠΊΠ° Π½Π° href
ΠΡΠΈΠΌΠ΅Ρ "ΠΠ°ΡΠΌΠΎΡΠΊΠ°"
.panel-body
s Π½Π° .list-group
s. Π‘Π΄Π΅Π»Π°ΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΡΠΌΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΡΠ°Π·Π²ΠΎΡΠ°ΡΠΈΠ²Π°Π½ΠΈΠ΅ΠΌ / ΡΠ²Π΅ΡΡΡΠ²Π°Π½ΠΈΠ΅ΠΌ
aria-extended
ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ. ΠΡΠΎΡ Π°ΡΡΠΈΠ±ΡΡ ΡΠ²Π½ΠΎ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠ΅ΠΊΡΡΠ΅Π΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π΄Π»Ρ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌ ΡΡΠ΅Π½ΠΈΡ Ρ ΡΠΊΡΠ°Π½Π° ΠΈ Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΡΡ
Π²ΡΠΏΠΎΠΌΠΎΠ³Π°ΡΠ΅Π»ΡΠ½ΡΡ
ΡΠ΅Ρ
Π½ΠΎΠ»ΠΎΠ³ΠΈΠΉ.ΠΡΠ»ΠΈ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π·Π°ΠΊΡΡΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΠΎΠ½ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΈΠΌΠ΅ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ aria-extended = "false"
. ΠΡΠ»ΠΈ Π²Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΠ»ΠΈ ΠΎΡΠΊΡΡΠ²Π°Π΅ΠΌΡΠΉ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΊΠ»Π°ΡΡΠ° Π² ΠΊΠ»Π°ΡΡΠ΅
, ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΠ΅ Π²ΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ aria-extended = "true"
Π΄Π»Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ. ΠΠ»Π°Π³ΠΈΠ½ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΡΡΠΎΡ Π°ΡΡΠΈΠ±ΡΡ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΠΎΠ³ΠΎ, Π±ΡΠ» Π»ΠΈ ΠΎΡΠΊΡΡΡ ΠΈΠ»ΠΈ Π·Π°ΠΊΡΡΡ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ. data-target
ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π½Π° ΡΠ΅Π»Π΅ΠΊΡΠΎΡ id
- Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ Π°ΡΡΠΈΠ±ΡΡ aria-controls
, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΠΉ id
ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. Π‘ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ ΡΡΠ΅Π½ΠΈΡ Ρ ΡΠΊΡΠ°Π½Π° ΠΈ Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΡΠ΅ Π²ΡΠΏΠΎΠΌΠΎΠ³Π°ΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΠ΅Ρ
Π½ΠΎΠ»ΠΎΠ³ΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ ΡΡΠΎΡ Π°ΡΡΠΈΠ±ΡΡ, ΡΡΠΎΠ±Ρ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²ΠΈΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΠΌ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΡΠ»ΡΠΊΠΈ Π΄Π»Ρ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° Π½Π΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ ΠΊ ΡΠ°ΠΌΠΎΠΌΡ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
.collapse
ΡΠΊΡΡΠ²Π°Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ .collapse.in
ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ .collapsing
Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ Π½Π°ΡΠΈΠ½Π°Π΅ΡΡΡ, ΠΈ ΡΠ΄Π°Π»ΡΠ΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΎΠ½ Π·Π°Π²Π΅ΡΡΠ°Π΅ΡΡΡ component-animations.less
. Π§Π΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
data-toggle = "collapse"
ΠΈ data-target
ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΡΡΠΎΠ±Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π½Π°Π·Π½Π°ΡΠΈΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΊΠ»Π°Π΄Π½ΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ.ΠΡΡΠΈΠ±ΡΡ data-target
ΠΏΡΠΈΠ½ΠΈΠΌΠ°Π΅Ρ ΡΠ΅Π»Π΅ΠΊΡΠΎΡ CSS Π΄Π»Ρ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΊΠΎΠ»Π»Π°ΠΏΡΠ°. ΠΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΠΊ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΊΠ»Π°ΡΡ collapse
. ΠΡΠ»ΠΈ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅, ΡΡΠΎΠ±Ρ ΠΎΠ½ Π±ΡΠ» ΠΎΡΠΊΡΡΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠ»Π°ΡΡ Π²
. data-parent = "# selector"
. ΠΠ±ΡΠ°ΡΠΈΡΠ΅ΡΡ ΠΊ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΈ, ΡΡΠΎΠ±Ρ ΡΠ²ΠΈΠ΄Π΅ΡΡ ΡΡΠΎ Π² Π΄Π΅ΠΉΡΡΠ²ΠΈΠΈ. Π§Π΅ΡΠ΅Π· JavaScript
$ ('.collapse '). collapse ()
ΠΠ°ΡΠ°ΠΌΠ΅ΡΡΡ
data-
, ΠΊΠ°ΠΊ Π² data-parent = ""
. ΠΠΌΡ ΡΠΈΠΏ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΡΠΎΠ΄ΠΈΡΠ΅Π»Ρ ΡΠ΅Π»Π΅ΠΊΡΠΎΡ Π»ΠΎΠΆΡ ΠΡΠ»ΠΈ ΠΏΡΠ΅Π΄ΡΡΠΌΠΎΡΡΠ΅Π½ ΡΠ΅Π»Π΅ΠΊΡΠΎΡ, ΡΠΎ Π²ΡΠ΅ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π² ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΌ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ Π±ΡΠ΄ΡΡ Π·Π°ΠΊΡΡΡΡ ΠΏΡΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ ΡΡΠΎΠ³ΠΎ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.(Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΠΎ ΡΡΠ°Π΄ΠΈΡΠΈΠΎΠ½Π½ΠΎΠΌΡ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΡ Π°ΠΊΠΊΠΎΡΠ΄Π΅ΠΎΠ½Π° - ΡΡΠΎ Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΊΠ»Π°ΡΡΠ°
) ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»Ρ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠ°Π²Π΄Π° ΠΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°Π΅Ρ ΡΠΊΠ»Π°Π΄Π½ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅ ΠΠ΅ΡΠΎΠ΄Ρ
. Π‘Π²Π΅ΡΠ½ΡΡΡ (ΠΎΠΏΡΠΈΠΈ)
, ΠΎΠ±ΡΠ΅ΠΊΡ
.
$ ('# myCollapsible').ΠΊΡΠ°Ρ
({
toggle: false
})
.collapse ('ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅')
shown.bs.collapse
ΠΈΠ»ΠΈ hidden.bs.collapse
). .collapse ('ΠΏΠΎΠΊΠ°Π·Π°ΡΡ')
shown.bs.collapse
). .collapse ('ΡΠΊΡΡΡΡ')
hidden.bs.collapse
). Π‘ΠΎΠ±ΡΡΠΈΡ
Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ.bs.collapse ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅ ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° show
. ΠΠΎΠΊΠ°Π·Π°Π½ΠΎ .bs.collapse ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π½ΠΈΡ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π²ΠΈΠ΄ΠΈΠΌΡΠΌ Π΄Π»Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (Π±ΡΠ΄Π΅Ρ ΠΎΠΆΠΈΠ΄Π°ΡΡ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS). hide.bs.collapse ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΡΡΠ°Π·Ρ ΠΏΠΎΡΠ»Π΅ Π²ΡΠ·ΠΎΠ²Π° ΠΌΠ΅ΡΠΎΠ΄Π° hide
. ΡΠΊΡΡΡΠΎ.bs.collapse ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π½ΠΈΡ Π±ΡΠ» ΡΠΊΡΡΡ ΠΎΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ (Π±ΡΠ΄Π΅Ρ ΠΎΠΆΠΈΠ΄Π°ΡΡ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² CSS).
$ ('# myCollapsible'). On ('hidden.bs.collapse', function () {
// ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ-Π½ΠΈΠ±ΡΠ΄Ρβ¦
})
ΠΡΠΈΠΌΠ΅ΡΡ
ΠΡΠΎΠ±Π»Π΅ΠΌΠ° Π΄ΠΎΡΡΡΠΏΠ½ΠΎΡΡΠΈ
ΠΠ½ΠΈΠΌΠ°ΡΠΈΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π² Internet Explorer 8 ΠΈ 9
Π’ΡΠ΅Π±ΡΠ΅ΡΡΡ Π½Π°ΡΠ°Π»ΡΠ½ΡΠΉ Π°ΠΊΡΠΈΠ²Π½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ
.ΠΠΊΡΠΈΠ²Π½ΡΠΉ ΠΊΠ»Π°ΡΡ
Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π½Π° ΠΎΠ΄ΠΈΠ½ ΠΈΠ· ΡΠ»Π°ΠΉΠ΄ΠΎΠ². Π ΠΏΡΠΎΡΠΈΠ²Π½ΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ ΠΊΠ°ΡΡΡΠ΅Π»Ρ Π½Π΅ Π±ΡΠ΄Π΅Ρ Π²ΠΈΠ΄Π½Π°. ΠΠ»ΠΈΡΠΈΠΊΠΎΠ½Ρ Π½Π΅ Π½ΡΠΆΠ½Ρ
.glyphicon .glyphicon-chevron-left
ΠΈ .glyphicon .glyphicon-chevron-right
Π½Π΅ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ Π½ΡΠΆΠ½Ρ Π΄Π»Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ. Bootstrap ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ .icon-prev
ΠΈ .icon-next
ΠΊΠ°ΠΊ ΠΏΡΠΎΡΡΡΠ΅ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Ρ Unicode. ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΠΏΠΎΠ΄ΠΏΠΈΡΠΈ
.carousel-caption
Π² Π»ΡΠ±ΠΎΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ .item
. ΠΠΎΠΌΠ΅ΡΡΠΈΡΠ΅ ΡΡΠ΄Π° ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π»ΡΠ±ΠΎΠΉ Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΉ HTML, ΠΈ ΠΎΠ½ Π±ΡΠ΄Π΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π²ΡΡΠΎΠ²Π½Π΅Π½ ΠΈ ΠΎΡΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½. ΠΡΠΈΠΊΠ΅ΡΠΊΠ° ΠΏΠ΅ΡΠ²ΠΎΠ³ΠΎ ΡΠ»Π°ΠΉΠ΄Π°
ΠΡΠΈΠΊΠ΅ΡΠΊΠ° Π²ΡΠΎΡΠΎΠ³ΠΎ ΡΠ»Π°ΠΉΠ΄Π°
ΠΡΠΈΠΊΠ΅ΡΠΊΠ° ΡΡΠ΅ΡΡΠ΅Π³ΠΎ ΡΠ»Π°ΠΉΠ΄Π°
...
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
ΠΠ΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΊΠ°ΡΡΡΠ΅Π»Π΅ΠΉ
id
Π½Π° ΡΠ°ΠΌΠΎΠΌ Π²Π½Π΅ΡΠ½Π΅ΠΌ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ΅ (.ΠΊΠ°ΡΡΡΠ΅Π»Ρ
) Π΄Π»Ρ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠΉ ΡΠ°Π±ΠΎΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΠΊΠ°ΡΡΡΠ΅Π»ΡΡ. ΠΡΠΈ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ
ΠΊΠ°ΡΡΡΠ΅Π»Π΅ΠΉ ΠΈΠ»ΠΈ ΠΏΡΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡΠ° ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ
ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ ΠΎΠ±Π½ΠΎΠ²ΠΈΡΠ΅ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ. Π§Π΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
data-slide
ΠΏΡΠΈΠ½ΠΈΠΌΠ°Π΅Ρ ΠΊΠ»ΡΡΠ΅Π²ΡΠ΅ ΡΠ»ΠΎΠ²Π° prev
ΠΈΠ»ΠΈ next
, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡΠ»Π°ΠΉΠ΄Π° ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π΅Π³ΠΎ ΡΠ΅ΠΊΡΡΠ΅Π³ΠΎ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ. Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ data-slide-to
Π΄Π»Ρ ΠΏΠ΅ΡΠ΅Π΄Π°ΡΠΈ Π½Π΅ΠΎΠ±ΡΠ°Π±ΠΎΡΠ°Π½Π½ΠΎΠ³ΠΎ ΠΈΠ½Π΄Π΅ΠΊΡΠ° ΡΠ»Π°ΠΉΠ΄Π° Π² ΠΊΠ°ΡΡΡΠ΅Π»Ρ data-slide-to = "2"
, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΠ΄Π²ΠΈΠ³Π°Π΅Ρ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡΠ»Π°ΠΉΠ΄Π° Π½Π° ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΡΠΉ ΠΈΠ½Π΄Π΅ΠΊΡ, Π½Π°ΡΠΈΠ½Π°Ρ Ρ 0
. data-ride = "carousel"
ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΠΏΠΎΠΌΠ΅ΡΠΊΠΈ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΠΊΠ°ΠΊ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉ, Π½Π°ΡΠΈΠ½Π°Ρ Ρ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΠ³ΠΎ Π½Π΅Π»ΡΠ·Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π² ΡΠΎΡΠ΅ΡΠ°Π½ΠΈΠΈ Ρ (ΠΈΠ·Π±ΡΡΠΎΡΠ½ΠΎΠΉ ΠΈ Π½Π΅Π½ΡΠΆΠ½ΠΎΠΉ) ΡΠ²Π½ΠΎΠΉ ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·Π°ΡΠΈΠ΅ΠΉ JavaScript ΡΠΎΠΉ ΠΆΠ΅ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ. Π§Π΅ΡΠ΅Π· JavaScript
$ ('. Carousel'). Carousel ()
ΠΠΏΡΠΈΠΈ
data-
, ΠΊΠ°ΠΊ Π² data-interval = ""
. ΠΠΌΡ ΡΠΈΠΏ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» Π½ΠΎΠΌΠ΅Ρ 5000 ΠΡΠ΅ΠΌΡ Π·Π°Π΄Π΅ΡΠΆΠΊΠΈ ΠΌΠ΅ΠΆΠ΄Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΌ ΡΠΈΠΊΠ»ΠΈΡΠ΅ΡΠΊΠΈΠΌ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΡΠ»ΠΈ false, ΠΊΠ°ΡΡΡΠ΅Π»Ρ Π½Π΅ Π±ΡΠ΄Π΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠ²ΡΠΎΡΡΡΡΡΡ. ΠΏΠ°ΡΠ·Π° ΡΡΡΠΎΠΊΠ° | null "ΠΏΠ°ΡΠ΅Π½ΠΈΠ΅" ΠΡΠ»ΠΈ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ "hover"
, ΠΏΡΠΈΠΎΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅Ρ ΡΠΈΠΊΠ» ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ Π½Π° mouseenter
ΠΈ Π²ΠΎΠ·ΠΎΠ±Π½ΠΎΠ²Π»ΡΠ΅Ρ ΡΠΈΠΊΠ»ΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π΄Π²ΠΈΠΆΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ Π½Π° mouseleave
.ΠΡΠ»ΠΈ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ null
, ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ° Π½Π° ΠΊΠ°ΡΡΡΠ΅Π»Ρ ΠΎΠ½Π° Π½Π΅ Π±ΡΠ΄Π΅Ρ ΠΏΡΠΈΠΎΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π°. ΠΎΠ±Π΅ΡΡΠΊΠ° Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠ°Π²Π΄Π° ΠΠΎΠ»ΠΆΠ½Π° Π»ΠΈ ΠΊΠ°ΡΡΡΠ΅Π»Ρ Π΄Π²ΠΈΠ³Π°ΡΡΡΡ Π½Π΅ΠΏΡΠ΅ΡΡΠ²Π½ΠΎ ΠΈΠ»ΠΈ ΠΈΠΌΠ΅ΡΡ ΠΆΠ΅ΡΡΠΊΠΈΠ΅ ΠΎΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ. ΠΊΠ»Π°Π²ΠΈΠ°ΡΡΡΠ° Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠ°Π²Π΄Π° ΠΠΎΠ»ΠΆΠ½Π° Π»ΠΈ ΠΊΠ°ΡΡΡΠ΅Π»Ρ ΡΠ΅Π°Π³ΠΈΡΠΎΠ²Π°ΡΡ Π½Π° ΡΠΎΠ±ΡΡΠΈΡ ΠΊΠ»Π°Π²ΠΈΠ°ΡΡΡΡ. ΠΠ΅ΡΠΎΠ΄Ρ
.ΠΊΠ°ΡΡΡΠ΅Π»Ρ (ΠΎΠΏΡΠΈΠΈ)
,
ΠΈ Π½Π°ΡΠΈΠ½Π°Π΅Ρ ΡΠΈΠΊΠ»ΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΏΡΠΎΡΠΌΠΎΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ².
$ ('. Carousel'). Carousel ({
ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»: 2000
})
.carousel ('ΡΠΈΠΊΠ»')
. ΠΠ°ΡΡΡΠ΅Π»Ρ ('ΠΏΠ°ΡΠ·Π°')
.ΠΊΠ°ΡΡΡΠ΅Π»Ρ (Π½ΠΎΠΌΠ΅Ρ)
.carousel ('ΠΏΡΠ΅Π΄.')
.carousel ('next')
Π‘ΠΎΠ±ΡΡΠΈΡ
ΠΠ»Π°ΡΡ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅
: Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅, Π² ΠΊΠΎΡΠΎΡΠΎΠΌ Π΄Π²ΠΈΠΆΠ΅ΡΡΡ ΠΊΠ°ΡΡΡΠ΅Π»Ρ ( Β«Π²Π»Π΅Π²ΠΎΒ»
ΠΈΠ»ΠΈ Β«Π²ΠΏΡΠ°Π²ΠΎΒ»
). relatedTarget
: ΡΠ»Π΅ΠΌΠ΅Π½Ρ DOM, ΠΊΠΎΡΠΎΡΡΠΉ Π²ΡΡΠ°Π²Π»ΡΠ΅ΡΡΡ Π½Π° ΠΌΠ΅ΡΡΠΎ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π°ΠΊΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΡΠ»Π°ΠΉΠ΄.Π±. ΠΊΠ°ΡΡΡΠ΅Π»Ρ ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅ ΠΌΠ΅ΡΠΎΠ΄Π° ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠ° slide
. ΡΠ΄Π²ΠΈΠ½ΡΠ»ΡΡ.bs.carousel ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΊΠ°ΡΡΡΠ΅Π»Ρ Π·Π°Π²Π΅ΡΡΠ°Π΅Ρ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»Π°ΠΉΠ΄Π°ΠΌΠΈ.
$ ('# myCarousel'). On ('slide.bs.carousel', function () {
// ΡΠ΄Π΅Π»Π°ΠΉ ΡΡΠΎ-Π½ΠΈΠ±ΡΠ΄Ρβ¦
})
ΠΡΠΈΠΌΠ΅Ρ
: ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½ΠΎ;
Π²ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ ΠΈ Π²ΡΠΊΠ»ΡΡΠ°Π΅ΡΡΡ, ΠΈΠΌΠΈΡΠΈΡΡΡ ΡΡΡΠ΅ΠΊΡ ΠΎΡ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ : Π»ΠΈΠΏΠΊΠΈΠΉ;
. ΠΠΎΠ΄Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ ΡΠΏΡΠ°Π²Π° - ΡΡΠΎ ΠΆΠΈΠ²Π°Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½Π° affix. ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅
ΠΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΡΠ΅Π· CSS
.affix
, .affix-top
ΠΈ .affix-bottom
.ΠΡ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΠΊΠ°Π·Π°ΡΡ ΡΡΠΈΠ»ΠΈ, Π·Π° ΠΈΡΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ΠΌ position: fixed;
Π½Π° .affix
, ΡΡΠΎΠ±Ρ ΡΡΠΈ ΠΊΠ»Π°ΡΡΡ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ (Π½Π΅Π·Π°Π²ΠΈΡΠΈΠΌΠΎ ΠΎΡ ΡΡΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π°) ΠΎΠ±ΡΠ°Π±Π°ΡΡΠ²Π°Π»ΠΈ ΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ. .affix-top
, ΡΡΠΎΠ±Ρ ΡΠΊΠ°Π·Π°ΡΡ, ΡΡΠΎ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π½Π°Ρ
ΠΎΠ΄ΠΈΡΡΡ Π² ΡΠ°ΠΌΠΎΠΉ Π²Π΅ΡΡ
Π½Π΅ΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ. ΠΠ° ΡΡΠΎΠΌ ΡΡΠ°ΠΏΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ CSS Π½Π΅ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ. .affix
Π·Π°ΠΌΠ΅Π½ΡΠ΅Ρ .affix-top
ΠΈ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅Ρ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ : ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅;
(ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅ΡΡΡ CSS Bootstrap). .affix
Π½Π° .affix-bottom
. ΠΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΡΠ²Π»ΡΡΡΡΡ Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΌΠΈ, Π΄Π»Ρ ΠΈΡ
Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΠΉ CSS. Π ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ position: absolute;
ΠΏΡΠΈ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ. ΠΠ»Π°Π³ΠΈΠ½ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Π°ΡΡΠΈΠ±ΡΡ Π΄Π°Π½Π½ΡΡ
ΠΈΠ»ΠΈ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡ JavaScript, ΡΡΠΎΠ±Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ, Π³Π΄Π΅ ΠΎΡΡΡΠ΄Π° ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ. Π§Π΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π°Π½Π½ΡΡ
data-spy = "affix"
ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, Π·Π° ΠΊΠΎΡΠΎΡΡΠΌ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ ΡΠ»Π΅Π΄ΠΈΡΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΡ, ΡΡΠΎΠ±Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ, ΠΊΠΎΠ³Π΄Π° ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΡ Π·Π°ΠΊΡΠ΅ΠΏΠ»Π΅Π½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.
Π§Π΅ΡΠ΅Π· JavaScript
$ ('# myAffix').affix ({
ΠΊΠΎΠΌΠΏΠ΅Π½ΡΠΈΡΠΎΠ²Π°ΡΡ: {
Π²Π΅ΡΡ
: 100,
bottom: function () {
return (this.bottom = $ ('. footer'). outerHeight (true))
}
}
})
ΠΠΏΡΠΈΠΈ
data-
, ΠΊΠ°ΠΊ Π² data-offset-top = "200"
. ΠΠΌΡ ΡΠΈΠΏ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΠΠΎΠΌΠ΅Ρ | ΡΡΠ½ΠΊΡΠΈΡ | ΠΎΠ±ΡΠ΅ΠΊΡ 10 ΠΠΈΠΊΡΠ΅Π»Π΅ΠΉ Π΄Π»Ρ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΠΎΡ ΡΠΊΡΠ°Π½Π° ΠΏΡΠΈ Π²ΡΡΠΈΡΠ»Π΅Π½ΠΈΠΈ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ.ΠΡΠ»ΠΈ ΡΠΊΠ°Π·Π°Π½ΠΎ ΠΎΠ΄Π½ΠΎ ΡΠΈΡΠ»ΠΎ, ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ Π±ΡΠ΄Π΅Ρ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ ΠΊΠ°ΠΊ Π² Π²Π΅ΡΡ
Π½Π΅ΠΌ, ΡΠ°ΠΊ ΠΈ Π² Π½ΠΈΠΆΠ½Π΅ΠΌ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡΡ
. Π§ΡΠΎΠ±Ρ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΡΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΡΠ½ΠΈΠ·Ρ ΠΈ ΡΠ²Π΅ΡΡ
Ρ, ΠΏΡΠΎΡΡΠΎ ΡΠΊΠ°ΠΆΠΈΡΠ΅ ΠΎΠ±ΡΠ΅ΠΊΡ offset: {top: 10}
ΠΈΠ»ΠΈ offset: {top: 10, bottom: 5}
. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΡΠ½ΠΊΡΠΈΡ, ΠΊΠΎΠ³Π΄Π° Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈ Π²ΡΡΠΈΡΠ»ΠΈΡΡ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅. ΡΠ΅Π»Ρ Π‘Π΅Π»Π΅ΠΊΡΠΎΡ | ΡΠ·Π΅Π» | ΠΠ»Π΅ΠΌΠ΅Π½Ρ jQuery ΠΎΠΊΠ½ΠΎ
ΠΎΠ±ΡΠ΅ΠΊΡ ΠΠ°Π΄Π°Π΅Ρ ΡΠ΅Π»Π΅Π²ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π°ΡΡΠΈΠΊΡΠ°. ΠΠ΅ΡΠΎΠ΄Ρ
. ΠΡΠ΅ΠΏΠ»Π΅Π½ΠΈΠ΅ (ΠΎΠΏΡΠΈΠΈ)
, ΠΎΠ±ΡΠ΅ΠΊΡ
.
$ ('# myAffix'). Affix ({
ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅: 15
})
.affix ('checkPosition')
.affix
, .affix-top
ΠΈ .affix-bottom
ΠΊΠ»Π°ΡΡΡ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡΡΡ ΠΈΠ»ΠΈ ΡΠ΄Π°Π»ΡΡΡΡΡ ΠΈΠ· ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ Π½ΠΎΠ²ΡΠΌ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ΠΌ. ΠΡΠΎΡ ΠΌΠ΅ΡΠΎΠ΄ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ Π²ΡΠ·ΡΠ²Π°ΡΡ Π²ΡΡΠΊΠΈΠΉ ΡΠ°Π·, ΠΊΠΎΠ³Π΄Π° ΠΈΠ·ΠΌΠ΅Π½ΡΡΡΡΡ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΠΈΠ»ΠΈ ΡΠ΅Π»Π΅Π²ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, ΡΡΠΎΠ±Ρ Π³Π°ΡΠ°Π½ΡΠΈΡΠΎΠ²Π°ΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ.
$ ('# myAffix'). Affix ('checkPosition')
Π‘ΠΎΠ±ΡΡΠΈΡ
ΠΠ»Π°Π³ΠΈΠ½ Π°ΡΡΠΈΠΊΡΠΎΠ² Π’ΠΈΠΏ ΡΠΎΠ±ΡΡΠΈΡ ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ Π°ΡΡΠΈΠΊΡ.bs.affix ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ Π½Π΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠ΅ΡΠ΅Π΄ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½ΠΈΠ΅ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΡΠΉ Π°ΡΡΠΈΠΊΡ ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ» ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½. affix-top.bs.affix ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π½Π΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠ΅ΡΠ΅Π΄ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½ΠΈΠ΅ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΡΠ²Π΅ΡΡ
Ρ. ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΡΠΉ Π²Π΅ΡΡ
Π½ΠΈΠΉ Π°ΡΡΠΈΠΊΡ ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ» ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½ ΡΠ²Π΅ΡΡ
Ρ. affix-bottom.bs. Affix ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ Π½Π΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠ΅ΡΠ΅Π΄ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½ΠΈΠ΅ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΡΠ½ΠΈΠ·Ρ. ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΠΎΠ΅ Π΄Π½ΠΎ Π°ΡΡΠΈΠΊΡ ΠΡΠΎ ΡΠΎΠ±ΡΡΠΈΠ΅ Π²ΡΠ·ΡΠ²Π°Π΅ΡΡΡ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ» ΠΏΡΠΈΠΊΡΠ΅ΠΏΠ»Π΅Π½ ΡΠ½ΠΈΠ·Ρ. petk / awesome-jquery: ΡΡΠ°ΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΠ΄ΠΎΠ±ΡΠ°Π½Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ
ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² jQuery, ΡΠ΅ΡΡΡΡΠΎΠ² ΠΈ Π΄ΡΡΠ³ΠΈΡ
Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ
Π²Π΅ΡΠ΅ΠΉ.
awesome- *
Π½Π° GitHub. Π‘ΠΎΠ΄Π΅ΡΠΆΠ°Π½ΠΈΠ΅
Π Π΅ΡΡΡΡΡ
Π£ΡΠ΅Π±Π½ΠΈΠΊΠΈ
ΠΠ½ΠΈΠ³ΠΈ
ΠΠ΅ΡΠΏΠ»Π°ΡΠ½ΡΠ΅ ΠΊΠ½ΠΈΠ³ΠΈ
ΠΠ»Π°ΡΠ½ΡΠ΅ ΠΊΠ½ΠΈΠ³ΠΈ
ΠΠ»ΠΎΠ³ΠΈ
Π Π°Π·Π½ΡΠ΅ ΡΠ΅ΡΡΡΡΡ
ΠΠ»Π°Π³ΠΈΠ½Ρ
ΠΠ½ΠΈΠΌΠ°ΡΠΈΡ
Π Π΅Π΄Π°ΠΊΡΠΎΡΡ
Π€ΠΎΡΠΌΡ
ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΠΊΠ°ΡΡΡ ΠΈ Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌΡ
ΠΠ΅Π½Ρ
ΠΠΎΠ΄Π°Π»ΡΠ½ΡΠ΅ ΠΎΠΊΠ½Π° ΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π°
animate.css
ΠΈΠ»ΠΈ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΡΠ²ΠΎΠΈ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠ΅. Π‘ΡΠΎΠ»Ρ
ΠΡΠ΅ΠΌΡ ΠΈ Π΄Π°ΡΠ°
ΠΠ΅ΡΠ΅Π²ΠΎΠ΄Ρ
ΠΡΠΎΠ²Π΅ΡΠΊΠ°
Π Π°Π·Π½ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ
ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠΉ
UI
Π’Π΅ΡΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅
ΠΠ½ΡΠ΅Π³ΡΠ°ΡΠΈΡ Π½Π° ΡΡΠΎΡΠΎΠ½Π΅ ΡΠ΅ΡΠ²Π΅ΡΠ°
Π‘ΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎ
ΠΠ»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Ρ
ΠΡΠ΅ΡΠ΅ Π΅ΡΠ΅ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΠ΅ ΡΠΏΠΈΡΠΊΠΈ?
Π‘ΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ ΠΈ Π»ΠΈΡΠ΅Π½Π·ΠΈΡ