jQuery Sticky Menu Plugin
ΠΠ»Ρ ΡΠ΅Π³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½?
- ΠΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΡΡΠΎΡΠ½Π½ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅Ρ Π½Π° ΡΠΊΡΠ°Π½Π΅ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ, Π΅Π³ΠΎ ΠΈΠ½Π°ΡΠ΅ Π½Π°Π·ΡΠ²Π°ΡΡ "ΠΠΈΠΏΠΊΠΈΠΌ ΠΌΠ΅Π½Ρ".
Dependencies
- jQuery - Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠ°Ρ Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊΠ° Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ ΠΌΠΎΠ΄ΡΠ»Ρ
Bower installation
$> bower install jquery-stickymenu --save
ΠΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ° ΠΏΠ»Π°Π³ΠΈΠ½Π°. Π ΡΠ΅ΠΊΡΡΠ΅ΠΌ ΠΏΠ°ΠΊΠ΅ΡΠ΅ Π΅ΡΡΡ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΡ jQuery. ΠΡΠ»ΠΈ jQuery Π½Π΅ Π±ΡΠ»ΠΈ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Ρ ΡΠ΅ΡΠ΅Π· bower, ΠΎΠ½ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π²ΠΌΠ΅ΡΡΠ΅ Ρ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ ScrollToTop.
ΠΠ°ΠΊ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠΈΡΡ ΠΏΠ»Π°Π³ΠΈΠ½
ΠΠΎΠ΄ΠΊΠ»ΡΡΠΈΡΠ΅ ΡΠ°ΠΉΠ»Ρ Π² HTML ΠΏΡΠΎΠ΅ΠΊΡ:
// jQuery common library <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script> // Sticky Menu Plugin <script src="url-to-module/jquery-stickymenu/dist/jquery.stickymenu.min.js"></script>
ΠΠ°ΠΊ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½
ΠΠ΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ HTML ΠΊΠΎΠ΄ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅:
<div style="position: relative;"> <div id="stickymenu"> ... </div> </div>
ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ²
$.stickymenu({params});
Π’ΠΈΠΏ Π²Ρ ΠΎΠ΄ΡΡΠΈΡ Π΄Π°Π½Π½ΡΡ : JSON:
ΠΠ°ΡΠ°ΠΌΠ΅ΡΡ | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ | ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ |
---|---|---|
object_id | ID ΠΎΠ±ΡΠ΅ΠΊΡΠ° ΠΏΠ»Π°Π²Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ | stickymenu |
standoff | ΠΡΡΡΡΠΏ ΠΏΠ»Π°Π²Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ ΠΎΡ Π²Π΅ΡΡ Π½Π΅ΠΉ Π³ΡΠ°Π½ΠΈΡΡ ΡΠΊΡΠ°Π½Π° | 0 |
standoff_object_id | ΠΡΡΡΡΠΏ ΠΏΠ»Π°Π²Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ°ΠΊΠΎΠ³ΠΎ ΠΆΠ΅ ΠΏΠ»Π°Π²Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ | d |