tabs Β» Π‘ΠΊΡΠΈΠΏΡΡ Π΄Π»Ρ ΡΠ°ΠΉΡΠΎΠ²
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ β Responsive Tabs
ΠΠ»Π°Π³ΠΈΠ½ ΠΎΡΠ·ΡΠ²ΡΠΈΠ²ΡΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ. ΠΠΊΠ»Π°Π΄ΠΊΠΈ ΡΡΠ°Π½ΡΡΠΎΡΠΌΠΈΡΡΡΡΡΡ Π² Π°ΠΊΠΊΠΎΡΠ΄ΠΈΠΎΠ½ ΠΏΡΠΈ Π΄ΠΎΡΡΠΈΠΆΠ΅Π½ΠΈΠΈ Π·Π°Π΄Π°Π½Π½ΠΎΠ³ΠΎ CSS breakpoint. ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΡΠΎΠ³ΠΎ ΡΠΊΡΠΈΠΏΡΠ° Π΄Π»Ρ ΡΠ°Π±ΠΎΠ² Π±ΡΠ΄Π΅Ρ ΠΎΡΠ»ΠΈΡΠ½ΠΎ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΠΈ Π½Π° Π΄Π΅ΡΠΊΡΠΎΠΏΠ΅, ΠΈ Π½Π° ΠΏΠ»Π°Π½ΡΠ΅ΡΠ΅ ΠΈ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠΌ ΡΡΡΡΠΎΠΉΡΡΠ²Π΅.
Tabulous β ΠΏΠ»Π°Π³ΠΈΠ½ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ, ΡΠ°Π±ΠΎΠ²
Tabulous — ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ Ρ ΡΠ΅Π±Ρ Π½Π° ΡΠ°ΠΉΡΠ΅ Π±Π»ΠΎΠΊΠ° Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌΠΈ ΡΡΡΠ΅ΠΊΡΠ°ΠΌΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΡΠ°ΠΌΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ.
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π½Π° jQuery
ΠΠ΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΡΠΎΠΊ ΠΊΠΎΠ΄Π° Π½Π° jQuery + ΠΎΠ΄ΠΈΠ½ CSS ΡΠ°ΠΉΠ» ΠΈ ΠΎΡΠ»ΠΈΡΠ½ΡΠ΅ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π³ΠΎΡΠΎΠ²Ρ. ΠΠ½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΡΡΡ ΡΡΠΈΠ»ΡΠΌΠΈ. ΠΡΠΈ ΡΠΌΠ΅Π½ΡΡΠ΅Π½ΠΈΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΠΎΠΊΠ½Π° Π±ΡΠ°ΡΠ·Π΅ΡΠ° Π΄ΠΎ Π·Π°Π΄Π°Π½Π½ΠΎΠ³ΠΎ Π² @media{} Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΠΈΠ· Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΡ ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΡΡΡΡΡ Π² Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ Π°ΠΊΠΊΠΎΡΠ΄ΠΈΠΎΠ½.
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΡΡΡΠΈΠ΅ΡΡ Π² Π°ΠΊΠΊΠΎΡΠ΄ΠΈΠΎΠ½
ΠΠ΅Π³ΠΊΠΈΠΉ jQuery ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΡΠ΅Ρ ΠΎΠ±ΡΡΠ½ΡΠ΅ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΠ΅ ΠΈΠ»ΠΈ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π½Π° ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ Ρ ΠΌΠ΅Π½ΡΡΠΈΠΌ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠΌ ΡΠΊΡΠ°Π½Π° Π² Π°ΠΊΠΊΠΎΡΠ΄ΠΈΠΎΠ½.
DOMTab — Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π½Π° javascript
DOMtab — ΡΡΠΎ jΠ°vascript, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ²ΡΠ·ΡΠ²Π°Π΅Ρ ΡΡΡΠ»ΠΊΠΈ ΠΈΠ· ΡΠΏΠΈΡΠΊΠ° Ρ ΡΠ΅ΠΊΡΠΈΡΠΌΠΈ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° Π² Π²ΠΈΠ΄Π΅ ΡΠ°Π± ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ°. ΠΠ°Π½Π½ΡΠ΅ ΡΠ°Π±Ρ ΠΎΡΠ΅Π½Ρ Ρ ΠΎΡΠΎΡΠΎ ΠΏΠΎΠ΄Π΄Π°ΡΡΡΡ Π²Π½Π΅ΡΠ½Π΅ΠΌΡ ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΠΎΠ²Π°Π½ΠΈΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS ΡΠ²ΠΎΠΉΡΡΠ², ΡΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ Π²ΠΏΠΈΡΠ°ΡΡ ΠΈΡ Π² Π»ΡΠ±ΠΎΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½. ΠΠΈ ΠΊΠ°ΠΊΠΈΡ jQuery ΠΈ Mootools Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ, ΡΠΎΠ»ΡΠΊΠΎ ΡΠΈΡΡΡΠΉ jΠ°vascript.
jTabs — ΠΏΠ»Π°Π³ΠΈΠ½ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ
jTabs — ΠΏΠ»Π°Π³ΠΈΠ½ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΠΈΠΉ jQuery.
Π£Π½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π½Π° jQuery
ΠΡΠΎΡΡΠ°Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΡ ΠΈΠ»ΠΈ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π½Π° jQuery Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΡΡΡΠΎΠΊ ΠΊΠΎΠ΄Π° Π΄Π»Ρ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ.
Ajax Π²ΠΊΠ»Π°Π΄ΠΊΠΈ
Π‘Π΄Π΅Π»Π°Π΅ΠΌ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ (tabs) ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ jQuery ΠΈ ΡΠ΅Ρ Π½ΠΎΠ»ΠΎΠ³ΠΈΡ ajax Π΄Π»Ρ ΠΏΠΎΠ΄Π³ΡΡΠ·ΠΊΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΠΈΠ· ΡΠ°ΠΉΠ»ΠΎΠ² (ΠΈΠ»ΠΈ Π±Π°Π·Ρ Π΄Π°Π½Π½ΡΡ ).
ΠΠΊΠ»Π°Π΄ΠΊΠΈ — tabs
ΠΡΠΎΡΡΠ°Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π½Π° jΠ°vascript Π±Π΅Π· ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΡΡΠΎΡΠΎΠ½Π½ΠΈΡ java Π±ΠΈΠ±Π»ΠΈΠΎΡΠ΅ΠΊ.
ΠΠΈΠ±ΠΊΠΈΠΉ Π°ΠΊΠΊΠΎΡΠ΄Π΅ΠΎΠ½
Π‘ΠΎΠ·Π΄Π°Π΄ΠΈΠΌ ΠΏΡΠΎΡΡΠΎΠΉ Π±ΡΡΡΡΠΎΡΠ΅Π°Π³ΠΈΡΡΡΡΠΈΠΉ Π°ΠΊΠΊΠΎΡΠ΄Π΅ΠΎΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΡΠΈ ΡΠ°ΡΠΊΡΡΡΠΈΠΈ Π±ΡΠ΄Π΅Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ ΠΊ Π²Π΅ΡΡ Π½Π΅ΠΉ ΠΎΠ±Π»Π°ΡΡΠΈ ΠΏΡΠΎΡΠΌΠΎΡΡΠ°. Π’Π°ΠΊΠΆΠ΅ Π±ΡΠ΄Π΅Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΎ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΎΠ² CSS3 Π΄Π»Ρ ΡΡΡΠ΅Π»ΠΊΠΈ. ΠΠΈΠ±ΠΊΠΎΡΡΡ Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠΎΠΌ, ΡΡΠΎ ΡΠΈΡΠΈΠ½Π° Π°ΠΊΠΊΠΎΡΠ΄Π΅ΠΎΠ½Π° Π±ΡΠ΄Π΅Ρ ΠΏΠΎΠ΄ΡΡΡΠ°ΠΈΠ²Π°ΡΡΡΡ ΠΏΠΎΠ΄ ΡΠ°Π·ΠΌΠ΅ΡΡ ΡΠΊΡΠ°Π½Π°.
ΠΠΊΠ»Π°Π΄ΠΊΠΈ ΡΠΎ ΡΠΊΠΎΡΠ΅Π½Π½ΡΠΌΠΈ ΡΠ³Π»Π°ΠΌΠΈ
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΠΎΡΠ΅Π½Ρ Π°ΠΊΡΡΠ°Π»ΡΠ½ΠΎ ΠΏΡΠΈ Π½Π°Π»ΠΈΡΠΈΠΈ Π±ΠΎΠ»ΡΡΠΎΠ³ΠΎ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²Π° ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ Π½Π° ΡΠ°ΠΉΡΠ΅. Π‘Π΅ΠΉΡΠ°Ρ ΠΊΠ°ΠΊ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ ΡΠΆΠ΅ ΠΏΠΎ Π΄Π΅ΡΠΎΠ»ΡΡ ΡΡΠ°ΡΠ°ΡΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΊΡΡΠ³Π»Π΅Π½ΠΈΠ΅ ΡΠ³Π»ΠΎΠ², Π° ΠΌΡ ΠΆΠ΅ ΡΠ΄Π΅Π»Π°Π΅ΠΌ ΡΠΊΠΎΡΠ΅Π½Π½ΡΠ΅ ΡΠ³ΠΎΠ»ΠΊΠΈ Ρ Π½Π°ΡΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ.
ΠΠΎΠΏΡΠ»ΡΡΠ½ΡΠ΅ ΡΡΠ°ΡΡΠΈ
Π Π΅ΠΊΠ»Π°ΠΌΠ°
ΠΠΏΡΠΎΡ
ΠΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ Π»ΠΈ Π²Ρ Π² ΡΠ΅Π°Π»ΡΠ½ΡΡ ΠΏΡΠΎΠ΅ΠΊΡΠ°Ρ CSS Grid Layout ?
ΠΠ°
ΠΠ΅Ρ, ΠΈΠ·-Π·Π° Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡ ΡΡΠ°ΡΡΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΡ
ΠΠ΅Ρ, Ρ Π²Π°ΡΠ°Π΅Ρ flexbox
ΠΠ΅Ρ, Ρ Π²Π°ΡΠ°Π΅Ρ display-table ΠΈ float
Π§ΡΠΎ ΡΡΠΎ Π²ΠΎΠΎΠ±ΡΠ΅ Π·Π° css grid?
ΠΠΎΠ²ΠΎΡΡΠΈ
ΠΠΎΠ΄ΠΏΠΈΡΠΈΡΡ
ΠΡΠΈΡΠΎΠ΅Π΄ΠΈΠ½ΡΠΉΡΡ, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ Π²ΡΠ΅ ΡΠ°ΠΌΠΎΠ΅ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎΠ΅ Π΄Π»ΡΒ frontend ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ° ΠΈΒ Π°Π½ΠΎΠ½ΡΡ ΡΡΠ°ΡΠ΅ΠΉ ΡΒ ΡΠ°ΠΉΡΠ°.
Π Π°Π·Π½ΠΎΠ΅
Π Π΅ΠΊΠ»Π°ΠΌΠ°
Π‘Π²Π΅ΠΆΠΈΠ΅ ΡΡΠ°ΡΡΠΈ
Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ — Teams
- Π‘ΡΠ°ΡΡΡ
ΠΠ°ΠΆΠ½ΠΎ!
ΠΠΊΠ»Π°Π΄ΠΊΠΈ Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠΌΠΈ ΠΊΠ°ΡΡΠΎΡΠΊΠ°ΠΌΠΈ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π»ΠΈΡΠ½ΡΡ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ.
ΠΡΠΈ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΠ°Π΄ΠΈΡΠΈΠΎΠ½Π½ΠΎΠ³ΠΎ ΠΌΠ΅ΡΠΎΠ΄Π° ΠΌΠΎΠ³ΡΡ Π²ΠΎΠ·Π½ΠΈΠΊΠ½ΡΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ.
- ΠΠΎΠΏΡΠΎΡΡ HTML ΠΈ CSS
- ΠΠ»ΠΈΡΠ΅Π»ΡΠ½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ°
- ΠΠ³ΡΠ°Π½ΠΈΡΠ΅Π½ΠΈΡ iFrame
- ΠΠ±ΡΠ»ΡΠΆΠΈΠ²Π°Π½ΠΈΠ΅ ΠΈ Π·Π°ΡΡΠ°ΡΡ ΡΠ΅ΡΠ²Π΅ΡΠ°
ΠΠΊΠ»Π°Π΄ΠΊΠΈ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈΒ β ΡΡΠΎ Π½ΠΎΠ²ΡΠΉ ΡΠΏΠΎΡΠΎΠ± ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π² Teams. ΠΠΌΠ΅ΡΡΠΎ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ Π²Π½Π΅Π΄ΡΡΡΡ Π²Π΅Π±-ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π² iFrame, ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΠΎΠ²Π°ΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΡ. Π ΡΠΎ Π²ΡΠ΅ΠΌΡ ΠΊΠ°ΠΊ Π²Π½Π΅ΡΠ½ΠΈΠΉ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ ΠΎΡΡΠΈΡΠΎΠ²ΡΠ²Π°Π΅ΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ ΠΊΠ°ΡΡΠΎΡΠ΅ΠΊ, ΡΠ΅ΡΠ²Π΅ΡΠ½Π°Ρ ΡΠ°ΡΡΡ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Π±ΠΎΡΠ°. ΠΠΎΡ ΠΎΡΠ²Π΅ΡΠ°Π΅Ρ Π·Π° ΠΏΡΠΈΠ½ΡΡΠΈΠ΅ Π·Π°ΠΏΡΠΎΡΠΎΠ² ΠΈ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΠΉ ΠΎΡΠ²Π΅Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΎΡΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ.
ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π³ΠΎΡΠΎΠ²ΡΡ ΡΠ°Π±ΠΎΡΠΈΡ Π±Π»ΠΎΠΊΠΎΠ² ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ° Π½Π° ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ΅, Π² ΠΠ½ΡΠ΅ΡΠ½Π΅ΡΠ΅ ΠΈ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ . ΠΡΠ° ΡΡΠ°ΡΡΡ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π²Π°ΠΌ ΠΏΠΎΠ½ΡΡΡ, ΠΊΠ°ΠΊΠΈΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ Π²Π½Π΅ΡΡΠΈ Π² ΠΌΠ°Π½ΠΈΡΠ΅ΡΡ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ. Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ ΡΠ°ΠΊΠΆΠ΅ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ, ΠΊΠ°ΠΊ Π²ΡΠ·ΠΎΠ² Π΄Π΅ΠΉΡΡΠ²ΠΈΡ Π·Π°ΠΏΡΠ°ΡΠΈΠ²Π°Π΅Ρ ΠΈ ΠΎΡΠΏΡΠ°Π²Π»ΡΠ΅Ρ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ ΠΊΠ°ΡΡΠΎΡΠ΅ΠΊ, Π° ΡΠ°ΠΊΠΆΠ΅ Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΡΠ°Π±ΠΎΡΠΈΠΉ ΠΏΡΠΎΡΠ΅ΡΡ ΠΌΠΎΠ΄ΡΠ»Ρ Π·Π°Π΄Π°Ρ.
ΠΠ° ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ ΡΠΈΡΡΠ½ΠΊΠ΅ ΠΏΠΎΠΊΠ°Π·Π°Π½Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΡΠ±ΠΎΡΠΊΠΈ Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠΌΠΈ ΠΊΠ°ΡΡΠΎΡΠΊΠ°ΠΌΠΈ Π½Π° Π½Π°ΡΡΠΎΠ»ΡΠ½ΡΡ ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ°Ρ ΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ .
ΠΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΡΠ»ΠΎΠ²ΠΈΡ
ΠΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ ΠΏΡΠΈΡΡΡΠΏΠΈΡΡ ΠΊ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ ΠΊΠ°ΡΡΠΎΡΠ΅ΠΊ, Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π΅.
- ΠΠ·Π½Π°ΠΊΠΎΠΌΡΡΠ΅ΡΡ Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΎΠΉ Π±ΠΎΡΠΎΠ², Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠΌΠΈ ΠΊΠ°ΡΡΠΎΡΠΊΠ°ΠΌΠΈ ΠΈ ΠΌΠΎΠ΄ΡΠ»ΡΠΌΠΈ Π·Π°Π΄Π°Ρ Π² Teams.
- ΠΠ»Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ Π² Teams Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±ΡΡΡ Π·Π°ΠΏΡΡΠ΅Π½ Π±ΠΎΡ.
ΠΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΌΠ°Π½ΠΈΡΠ΅ΡΡΠ° ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ
ΠΠΈΡΠ½ΡΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΡΡΠΈΡΠΎΠ²ΡΠ²Π°ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ, Π΄ΠΎΠ»ΠΆΠ½Ρ Π²ΠΊΠ»ΡΡΠ°ΡΡ ΠΌΠ°ΡΡΠΈΠ² staticTabs
Π² ΠΌΠ°Π½ΠΈΡΠ΅ΡΡ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ. ΠΠΊΠ»Π°Π΄ΠΊΠΈ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ ΠΎΡΡΠΈΡΠΎΠ²ΡΠ²Π°ΡΡΡΡ, ΠΊΠΎΠ³Π΄Π° ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ contentBotId
ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅ΡΡΡ Π² ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΠΈ staticTab
. ΠΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΡ
Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ Π»ΠΈΠ±ΠΎ contentBotId
, ΡΠΊΠ°Π·ΡΠ²Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ, Π»ΠΈΠ±ΠΎ contentUrl
, ΡΠΊΠ°Π·ΡΠ²Π°Ρ ΡΠΈΠΏΠΈΡΠ½ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ Ρ Π²Π΅Π±-ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΡΠΌ.
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅.
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ contentBotId
Π΄ΠΎΡΡΡΠΏΠ½ΠΎ Π² ΠΌΠ°Π½ΠΈΡΠ΅ΡΡΠ΅ Π²Π΅ΡΡΠΈΠΈ 1.9 ΠΈΠ»ΠΈ Π±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ·Π΄Π½Π΅ΠΉ.
ΠΡΠ΅Π΄ΠΎΡΡΠ°Π²ΡΡΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²Ρ botId
, Ρ ΠΊΠΎΡΠΎΡΡΠΌ Π°Π΄Π°ΠΏΡΠΈΠ²Π½Π°Ρ ΠΊΠ°ΡΡΠΎΡΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Π° Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΎΠ²Π°ΡΡ. ΠΠ»Π°ΡΡ entityId
Π½Π°ΡΡΡΠΎΠ΅Π½Π½ΡΠΉ Π΄Π»Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ, ΠΎΡΠΏΡΠ°Π²Π»ΡΠ΅ΡΡΡ Π² ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ΅ tabContext
ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ Π·Π°ΠΏΡΠΎΡΠ° Π½Π° Π²ΡΠ·ΠΎΠ² ΠΈ ΠΌΠΎΠΆΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π΄Π»Ρ ΡΠ°Π·Π»ΠΈΡΠ΅Π½ΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ Π±ΠΎΡΠ°. ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΠ²Π΅Π΄Π΅Π½ΠΈΡ ΠΎ Π΄ΡΡΠ³ΠΈΡ
ΠΏΠΎΠ»ΡΡ
ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΡ
Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΡΠΌ. Π² ΡΡΠ°ΡΡΠ΅ Π‘Ρ
Π΅ΠΌΠ° ΠΌΠ°Π½ΠΈΡΠ΅ΡΡΠ°.
ΠΠΈΠΆΠ΅ ΠΏΡΠΈΠ²ΠΎΠ΄ΠΈΡΡΡ ΠΏΡΠΈΠΌΠ΅Ρ ΠΌΠ°Π½ΠΈΡΠ΅ΡΡΠ° Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ:
{ "$schema": "https://raw.githubusercontent.com/OfficeDev/microsoft-teams-app-schema/preview/DevPreview/MicrosoftTeams.schema.json", "manifestVersion": "1.9", "id": "00000000-0000-0000-0000-000000000000", "version": "0.0.1", "developer": { "name": "Contoso", "websiteUrl": "https://contoso.yourwebsite.com", "privacyUrl": "https://contoso.yourwebsite.com/privacy.html", "termsOfUseUrl": "https://contoso.yourwebsite.com/terms.html" }, "name": { "short": "Contoso", "full": "Contoso Home" }, "description": { "short": "Add short description here", "full": "Add full description here" }, "icons": { "outline": "icon-outline.png", "color": "icon-color.png" }, "accentColor": "#D85028", "configurableTabs": [], "staticTabs": [ { "entityId": "homeTab", "name": "Home", "contentBotId": "00000000-0000-0000-0000-000000000000", "scopes": ["personal"] }, { "entityId": "moreTab", "name": "More", "contentBotId": "00000000-0000-0000-0000-000000000000", "scopes": ["personal"] } ], "connectors": [], "composeExtensions": [], "permissions": ["identity", "messageTeamMembers"], "validDomains": [ "contoso.yourwebsite.com", "token.botframework.com" ] }
ΠΠ°ΠΏΡΡΠΊ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ
Π‘Π²ΡΠ·Ρ ΠΌΠ΅ΠΆΠ΄Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠΎΠΉ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ ΠΈ Π±ΠΎΡΠΎΠΌ ΡΠ΅Π°Π»ΠΈΠ·ΡΠ΅ΡΡΡ ΡΠ΅ΡΠ΅Π· Π΄Π΅ΠΉΡΡΠ²ΠΈΡ β invoke
. ΠΠ°ΠΆΠ΄ΠΎΠ΅ Π΄Π΅ΠΉΡΡΠ²ΠΈΠ΅
ΠΈΠΌΠ΅Π΅Ρ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠ΅Π΅ ΠΈΠΌΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΈΠΌΠ΅Π½Π° ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ Π΄Π»Ρ ΡΠ°Π·Π»ΠΈΡΠ΅Π½ΠΈΡ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ Π·Π°ΠΏΡΠΎΡΠ°. tab/fetch
ΠΈ tab/submit
Β β ΡΡΠΎ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΡ
Π²Π°ΡΡΠ²Π°ΡΡΡΡ Π² ΡΡΠΎΠΌ ΡΠ°Π·Π΄Π΅Π»Π΅.
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅.
- ΠΠΎΡΠ°ΠΌ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΠΎΡΠΏΡΠ°Π²Π»ΡΡΡ Π²ΡΠ΅ ΠΎΡΠ²Π΅ΡΡ Π½Π° URL-Π°Π΄ΡΠ΅Ρ ΡΠ»ΡΠΆΠ±Ρ. URL-Π°Π΄ΡΠ΅Ρ ΡΠ»ΡΠΆΠ±Ρ ΠΏΠΎΠ»ΡΡΠ΅Π½ Π² ΡΠΎΡΡΠ°Π²Π΅ Π²Ρ
ΠΎΠ΄ΡΡΠ΅ΠΉ ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ Π½Π°Π³ΡΡΠ·ΠΊΠΈ
activity
. - Π Π°Π·ΠΌΠ΅Ρ ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ Π½Π°Π³ΡΡΠ·ΠΊΠΈ Π²ΡΠ·ΠΎΠ²Π° ΡΠ²Π΅Π»ΠΈΡΠ΅Π½ Π΄ΠΎ 80Β ΠΠ.
ΠΠ·Π²Π»Π΅ΡΠ΅Π½ΠΈΠ΅ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ Π΄Π»Ρ ΠΎΡΡΠΈΡΠΎΠ²ΠΊΠΈ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ΅
tab/fetch
Β β ΡΡΠΎ ΠΏΠ΅ΡΠ²ΡΠΉ Π·Π°ΠΏΡΠΎΡ Π½Π° Π²ΡΠ·ΠΎΠ², ΠΊΠΎΡΠΎΡΡΠΉ Π²Π°Ρ Π±ΠΎΡ ΠΏΠΎΠ»ΡΡΠ°Π΅Ρ, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΎΡΠΊΡΡΠ²Π°Π΅Ρ Π²ΠΊΠ»Π°Π΄ΠΊΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ. ΠΠΎΠ³Π΄Π° Π±ΠΎΡ ΠΏΠΎΠ»ΡΡΠ°Π΅Ρ Π·Π°ΠΏΡΠΎΡ, ΠΎΠ½ ΠΎΡΠΏΡΠ°Π²Π»ΡΠ΅Ρ ΠΎΡΠ²Π΅Ρ ΠΎ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ΅Π½ΠΈΠΈ ΠΈΠ»ΠΈ Π²ΠΊΠ»Π°Π΄ΠΊΡ Π°ΡΡΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅.
ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΠ²Π΅Π΄Π΅Π½ΠΈΡ ΠΎΠ± ΠΎΡΠ²Π΅ΡΠ΅ auth ΡΠΌ. Π² ΡΠ°Π·Π΄Π΅Π»Π΅ ΠΡΠΎΠ²Π΅ΡΠΊΠ° ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΊΠΎΠ΄ ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΠΏΡΠΈΠΌΠ΅ΡΡ Π·Π°ΠΏΡΠΎΡΠ° tab/fetch
ΠΈ ΠΎΡΠ²Π΅ΡΠ°:
tab/fetch
: Π·Π°ΠΏΡΠΎΡ
// tab/fetch POST request: agents/{botId}/invoke { "name": "tab/fetch", "value: { "tabContext": { "tabEntityId": "{tab_entity_id}" }, "context": { "theme": "default" } }, "conversation": { "id": "{generated_conversation_id}" }, "imdisplayname": "{user_display_name}" }
tab/fetch
: ΠΎΡΠΊΠ»ΠΈΠΊ
// tab/fetch **continue** POST response: { "tab": { "type": "continue", "value": { "cards": [ { "card": adaptiveCard1, }, { "card": adaptiveCard2, }, { "card": adaptiveCard3 } ] }, }, "responseType": "tab" }
ΠΠ±ΡΠ°Π±ΠΎΡΠΊΠ° ΠΎΡΠΏΡΠ°Π²ΠΎΠΊ Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ
ΠΠΎΡΠ»Π΅ ΠΎΡΡΠΈΡΠΎΠ²ΠΊΠΈ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ ΠΎΠ½Π° ΠΌΠΎΠΆΠ΅Ρ ΡΠ΅Π°Π³ΠΈΡΠΎΠ²Π°ΡΡ Π½Π° Π΄Π΅ΠΉΡΡΠ²ΠΈΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ. ΠΡΠΎΡ ΠΎΡΠ²Π΅Ρ ΠΎΠ±ΡΠ°Π±Π°ΡΡΠ²Π°Π΅ΡΡΡ Π·Π°ΠΏΡΠΎΡΠΎΠΌ Π½Π° Π²ΡΠ·ΠΎΠ² tab/submit
.
ΠΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π½Π°ΠΆΠ°Π» ΠΊΠ½ΠΎΠΏΠΊΡ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ, Π·Π°ΠΏΡΠΎΡ tab/submit
Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΠΊ Π±ΠΎΡΡ Ρ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΠΌΠΈ Π΄Π°Π½Π½ΡΠΌΠΈ ΡΠ΅ΡΠ΅Π· ΡΡΠ½ΠΊΡΠΈΡ Action.Submit
Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ. ΠΠ°Π½Π½ΡΠ΅ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ Π΄ΠΎΡΡΡΠΏΠ½Ρ ΡΠ΅ΡΠ΅Π· ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ Π΄Π°Π½Π½ΡΡ
Π·Π°ΠΏΡΠΎΡΠ° tab/submit
. ΠΡ ΠΏΠΎΠ»ΡΡΠΈΡΠ΅ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· ΡΠ»Π΅Π΄ΡΡΡΠΈΡ
ΠΎΡΠ²Π΅ΡΠΎΠ² Π½Π° Π²Π°Ρ Π·Π°ΠΏΡΠΎΡ:
- ΠΠΎΠ΄ ΡΠΎΡΡΠΎΡΠ½ΠΈΡ HTTP
200
Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ ΡΠ΅Π»Π°. ΠΠ²Π΅ ΡΠΎΡΠ½ΠΈ ΠΏΡΡΡΡΡ ΠΎΡΠ²Π΅ΡΠΎΠ² Π½Π΅ ΠΏΡΠΈΠ²ΠΎΠ΄ΠΈΡ ΠΊ Π½ΠΈΠΊΠ°ΠΊΠΈΠΌ Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠΌ ΠΊΠ»ΠΈΠ΅Π½ΡΠ°. - Π‘ΡΠ°Π½Π΄Π°ΡΡΠ½Π°Ρ
200
Π²ΠΊΠ»Π°Π΄ΠΊΠ° continue ΠΎΡΠ²Π΅ΡΠ°ΡΡ, ΠΊΠ°ΠΊ ΠΎΠ±ΡΡΡΠ½Π΅Π½ΠΎ Π² ΡΠ°Π·Π΄Π΅Π»Π΅ ΠΠ΄Π°ΠΏΡΠΈΠ²Π½Π°Ρ ΠΊΠ°ΡΡΠΎΡΠΊΠ°. ΠΡΠΊΠ»ΠΈΠΊ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ continue Π°ΠΊΡΠΈΠ²ΠΈΡΡΠ΅Ρ ΠΊΠ»ΠΈΠ΅Π½ΡΠ°, ΡΡΠΎΠ±Ρ ΠΎΠ±Π½ΠΎΠ²ΠΈΡΡ ΠΎΡΡΠΈΡΠΎΠ²ΠΊΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ ΠΊΠ°ΡΡΠΎΡΠ΅ΠΊ, ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½Π½ΡΡ Π² ΠΌΠ°ΡΡΠΈΠ²Π΅ ΠΊΠ°ΡΡΠΎΡΠ΅ΠΊ ΠΎΡΠΊΠ»ΠΈΠΊΠ° continue.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΊΠΎΠ΄ ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΠΏΡΠΈΠΌΠ΅ΡΡ Π·Π°ΠΏΡΠΎΡΠ° tab/submit
ΠΈ ΠΎΡΠ²Π΅ΡΠ°:
tab/submit
: Π·Π°ΠΏΡΠΎΡ
// tab/submit POST request: agents/{botId}/invoke: { "name": "tab/submit", "value": { "data": { "type": "tab/submit", //. ..<data properties> }, "context": { "theme": "default" }, "tabContext": { "tabEntityId": "{tab_entity_id}" }, }, "conversation": { "id": "{generated_conversation_id}" }, "imdisplayname": "{user_display_name}" }
tab/submit
: ΠΎΡΠΊΠ»ΠΈΠΊ
//tab/fetch **continue** POST response: { "tab": { "type": "continue", "value": { "cards": [ { "card": adaptiveCard1, }, { "card": adaptiveCard2, } ] }, }, "responseType": "tab" }
Π‘Π²Π΅Π΄Π΅Π½ΠΈΡ ΠΎ ΡΠ°Π±ΠΎΡΠ΅ΠΌ ΠΏΡΠΎΡΠ΅ΡΡΠ΅ ΠΌΠΎΠ΄ΡΠ»Ρ Π·Π°Π΄Π°Ρ
ΠΠΎΠ΄ΡΠ»Ρ Π·Π°Π΄Π°Ρ ΡΠ°ΠΊΠΆΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ ΠΊΠ°ΡΡΠΎΡΠΊΡ Π΄Π»Ρ Π²ΡΠ·ΠΎΠ²Π° Π·Π°ΠΏΡΠΎΡΠΎΠ² ΠΈ ΠΎΡΠ²Π΅ΡΠΎΠ² task/fetch
ΠΈ task/submit
. ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ Π² ΡΠ°Π·Π΄Π΅Π»Π΅ ΠΎΠ± ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ Π·Π°Π΄Π°Ρ Π² Π±ΠΎΡΠ°Ρ
Microsoft Teams.
Π‘ ΠΏΠΎΡΠ²Π»Π΅Π½ΠΈΠ΅ΠΌ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ «ΠΠ΄Π°ΠΏΡΠΈΠ²Π½Π°Ρ ΠΊΠ°ΡΡΠΎΡΠΊΠ°» ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ»ΠΎΡΡ ΡΠΎ, ΠΊΠ°ΠΊ Π±ΠΎΡ ΠΎΡΠ²Π΅ΡΠ°Π΅Ρ Π½Π° Π·Π°ΠΏΡΠΎΡ task/submit
. ΠΡΠ»ΠΈ Π²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ, Π±ΠΎΡ ΠΎΡΠ²Π΅ΡΠ°Π΅Ρ Π½Π° Π·Π°ΠΏΡΠΎΡ Π²ΡΠ·ΠΎΠ²Π° task/submit
ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠΎΠΉ continue ΠΈ Π·Π°ΠΊΡΡΠ²Π°Π΅Ρ ΠΌΠΎΠ΄ΡΠ»Ρ Π·Π°Π΄Π°Ρ. ΠΠΊΠ»Π°Π΄ΠΊΠ° «ΠΠ΄Π°ΠΏΡΠΈΠ²Π½Π°Ρ ΠΊΠ°ΡΡΠΎΡΠΊΠ°» ΠΎΠ±Π½ΠΎΠ²Π»ΡΠ΅ΡΡΡ ΠΏΡΡΠ΅ΠΌ ΠΎΡΡΠΈΡΠΎΠ²ΠΊΠΈ Π½ΠΎΠ²ΠΎΠ³ΠΎ ΡΠΏΠΈΡΠΊΠ° ΠΊΠ°ΡΡΠΎΡΠ΅ΠΊ, ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½Π½ΡΡ
Π² ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΉ ΡΠ°ΡΡΠΈ ΠΎΡΠΊΠ»ΠΈΠΊΠ° Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ continue.
ΠΡΠ·ΠΎΠ²
task/fetch
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΊΠΎΠ΄ ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΠΏΡΠΈΠΌΠ΅ΡΡ Π·Π°ΠΏΡΠΎΡΠ° task/fetch
ΠΈ ΠΎΡΠ²Π΅ΡΠ°:
task/fetch
: Π·Π°ΠΏΡΠΎΡ
// task/fetch POST request: agents/{botId}/invoke { "name": "task/fetch", "value": { "data": { "type": "task/fetch" }, "context": { "theme": "default", }, "tabContext": { "tabEntityId": "{tab_entity_id}" } }, "imdisplayname": "{user_display_name}", "conversation": { "id": "{generated_conversation_id}" } }
task/fetch
: ΠΎΡΠΊΠ»ΠΈΠΊ
// task/fetch POST response: agents/{botId}/invoke { "task": { "value": { "title": "Ninja Cat", "height": "small", "width": "small", "card": { "contentType": "application/vnd. microsoft.card.adaptive", "content": adaptiveCard, } }, "type": "continue" }, "responseType": "task" }
ΠΡΠ·ΠΎΠ²
task/submit
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΊΠΎΠ΄ ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΠΏΡΠΈΠΌΠ΅ΡΡ Π·Π°ΠΏΡΠΎΡΠ° task/submit
ΠΈ ΠΎΡΠ²Π΅ΡΠ°:
task/submit
: Π·Π°ΠΏΡΠΎΡ
// task/submit POST request: agent/{botId}/invoke: { "name": "task/submit", "value": { "data": {serialized_data_object}, "context": { "theme": "default" }, "tabContext": { "tabEntityId": "{tab_entity_id}" }, }, "conversation": { "id": "{generated_conversation_id}" }, "imdisplayname": "{user_display_name}", }
task/submit
: ΡΠΈΠΏ ΠΎΡΠ²Π΅ΡΠ° Π²ΠΊΠ»Π°Π΄ΠΊΠΈ
// tab/fetch **continue** POST response: { "task":{ "value": { "tab": { "type": "continue", "value": { "cards": [ { "card": adaptiveCard1 }, { "card": adaptiveCard2 } ] } } }, "type": "continue" }, "responseType": "task" }
ΠΡΠΎΠ²Π΅ΡΠΊΠ° ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ
Π ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠΈΡ ΡΠ°Π·Π΄Π΅Π»Π°Ρ Π²Ρ Π²ΠΈΠ΄Π΅Π»ΠΈ, ΡΡΠΎ Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²ΠΎ ΡΡΡΠ°ΡΠ΅Π³ΠΈΠΉ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°ΡΡΠΈΡΠΈΡΡ ΠΈΠ· Π·Π°ΠΏΡΠΎΡΠΎΠ² ΠΌΠΎΠ΄ΡΠ»Ρ Π·Π°Π΄Π°Ρ ΠΈ ΠΎΡΠ²Π΅ΡΠΎΠ² Π½Π° Π·Π°ΠΏΡΠΎΡΡ ΠΈ ΠΎΡΠ²Π΅ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ. ΠΡΠΈ ΠΎΠ±ΡΠ°Π±ΠΎΡΠΊΠ΅ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ ΡΠ°Π±ΠΎΡΠΈΠΉ ΠΏΡΠΎΡΠ΅ΡΡ Π΄Π»Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΡΠ°Π±Π»ΠΎΠ½Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠΉ Π΄Π»Ρ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠΉ. ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΠ²Π΅Π΄Π΅Π½ΠΈΡ ΡΠΌ. Π² ΡΡΠ°ΡΡΠ΅ ΠΎ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠΈ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ.
ΠΠ°ΠΏΡΠΎΡΡ tab/fetch
ΠΌΠΎΠ³ΡΡ ΠΈΠΌΠ΅ΡΡ ΠΎΡΠ²Π΅Ρ continue ΠΈΠ»ΠΈ auth. ΠΠΎΠ³Π΄Π° Π·Π°ΠΏΡΠΎΡ tab/fetch
Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΠΈ ΠΏΠΎΠ»ΡΡΠ°Π΅Ρ Π² ΠΎΡΠ²Π΅Ρ Π²ΠΊΠ»Π°Π΄ΠΊΡ auth, ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ ΡΡΡΠ°Π½ΠΈΡΠ° Π²Ρ
ΠΎΠ΄Π°.
ΠΠΎΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΊΠΎΠ΄Π° ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ ΡΠ΅ΡΠ΅Π· Π²ΡΠ·ΠΎΠ² tab/fetch
ΠΡΠΊΡΠΎΠΉΡΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅. ΠΠΎΡΠ²ΠΈΡΡΡ ΡΡΡΠ°Π½ΠΈΡΠ° Π²Ρ ΠΎΠ΄Π°.
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅.
ΠΠΎΠ³ΠΎΡΠΈΠΏ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅ΡΡΡ ΡΠ΅ΡΠ΅Π· ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ
icon
, ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ΅ Π² ΠΌΠ°Π½ΠΈΡΠ΅ΡΡΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ. ΠΠ°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΠΎΡΠ»Π΅ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ Π»ΠΎΠ³ΠΎΡΠΈΠΏΠ° Π² ΡΠ²ΠΎΠΉΡΡΠ²Π΅title
, Π²ΠΎΠ·Π²ΡΠ°ΡΠ°Π΅ΠΌΠΎΠΌ Π² ΡΠ΅Π»Π΅ ΠΎΡΠ²Π΅ΡΠ° auth.Π©Π΅Π»ΠΊΠ½ΠΈΡΠ΅ ΡΡΡΠ»ΠΊΡ ΠΠΎΠΉΡΠΈ. ΠΡ Π±ΡΠ΄Π΅ΡΠ΅ ΠΏΠ΅ΡΠ΅Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½Ρ Π½Π° URL-Π°Π΄ΡΠ΅Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ, ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½Π½ΡΠΉ Π² ΡΠ²ΠΎΠΉΡΡΠ²Π΅
value
Π² ΡΠ΅Π»Π΅ ΠΎΡΠ²Π΅ΡΠ° auth.ΠΡΠΊΡΡΠ²Π°Π΅ΡΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ. ΠΡΠΎ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΎ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ URL-Π°Π΄ΡΠ΅ΡΠ° ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ.
ΠΠΎΡΠ»Π΅ Π²Ρ ΠΎΠ΄Π° Π·Π°ΠΊΡΠΎΠΉΡΠ΅ ΠΎΠΊΠ½ΠΎ. ΠΠΎΠ΄ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ ΠΎΡΠΏΡΠ°Π²Π»ΡΠ΅ΡΡΡ Π² ΠΊΠ»ΠΈΠ΅Π½Ρ Teams.
ΠΠ°ΡΠ΅ΠΌ ΠΊΠ»ΠΈΠ΅Π½Ρ Teams ΠΏΠΎΠ²ΡΠΎΡΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π΄Π°Π΅Ρ Π·Π°ΠΏΡΠΎΡ
tab/fetch
ΡΠ»ΡΠΆΠ±Π΅, ΠΊΠΎΡΠΎΡΠ°Ρ Π²ΠΊΠ»ΡΡΠ°Π΅Ρ ΠΊΠΎΠ΄ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ, ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½Π½ΡΠΉ Π²Π°ΡΠ΅ΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ΠΉ.
ΠΠΎΡΠΎΠΊ Π΄Π°Π½Π½ΡΡ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ
tab/fetch
ΠΠ° ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ ΠΎΠ±Π·ΠΎΡ ΡΠ°Π±ΠΎΡΡ ΠΏΠΎΡΠΎΠΊΠ° Π΄Π°Π½Π½ΡΡ
ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ Π΄Π»Ρ Π²ΡΠ·ΠΎΠ²Π° tab/fetch
.
tab/fetch
: ΠΎΡΠ²Π΅Ρ auth
ΠΡΠΎΡ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠ½ΠΎΠ³ΠΎ ΠΊΠΎΠ΄Π° ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ ΠΏΡΠΈΠΌΠ΅Ρ ΠΎΡΠ²Π΅ΡΠ° Π½Π° ΠΏΡΠΎΠ²Π΅ΡΠΊΡ ΠΏΠΎΠ΄Π»ΠΈΠ½Π½ΠΎΡΡΠΈ tab/fetch
:
// tab/auth POST response (openURL) { "tab": { "type": "auth", "suggestedActions":{ "actions":[ { "type": "openUrl", "value": "https://example. com/auth", "title": "Sign in to this app" } ] } } }
ΠΡΠΈΠΌΠ΅Ρ
Π ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ ΠΊΠΎΠ΄Π΅ ΠΏΠΎΠΊΠ°Π·Π°Π½ ΠΏΡΠΈΠΌΠ΅Ρ ΠΏΠΎΠ²ΡΠΎΡΠ½ΠΎΠΉ Π²ΡΠ΄Π°ΡΠΈ Π·Π°ΠΏΡΠΎΡΠ°:
{ "name": "tab/fetch", "type": "invoke", "timestamp": "2021-01-15T00:10:12.253Z", "channelId": "msteams", "serviceUrl": "https://smba.trafficmanager.net/amer/", "from": { "id": "{id}", "name": "John Smith", "aadObjectId": "00000000-0000-0000-0000-000000000000" }, "conversation": { "tenantId": "{tenantId}", "id": "tab:{guid}" }, "recipients": { "id": "28:00000000-0000-0000-0000-000000000000", "name": "ContosoApp" }, "entities": [ { "locale": "en-us", "country": "US", "platform": "Windows", "timezone": "America/Los_Angeles", "type": "clientInfo" } ], "channelData": { "tenant": { "id": "00000000-0000-0000-0000-000000000000" }, "source": { "name": "message" } }, "value": { "tabContext": { "tabEntityId": "homeTab" }, "state": "0. 43195668034524815" }, "locale": "en-US", "localTimeZone": "America/Los_Angeles" }
ΠΡΠΈΠΌΠ΅Ρ ΠΊΠΎΠ΄Π°
ΠΠ°Π·Π²Π°Π½ΠΈΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΠ° | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ | .NET | Node.js | ΠΠ°Π½ΠΈΡΠ΅ΡΡ |
---|---|---|---|---|
ΠΠΎΠΊΠ°Π·ΡΠ²Π°ΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Teams | ΠΠ±ΡΠ°Π·Π΅Ρ ΠΊΠΎΠ΄Π° Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Microsoft Teams, Π² ΠΊΠΎΡΠΎΡΠΎΠΌ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°ΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ ΠΊΠ°ΡΡΠΎΡΠΊΠΈ Π² Teams. | View | ΠΡΠΎΡΠΌΠΎΡΡ | ΠΡΠΎΡΠΌΠΎΡΡ |
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΡΡΠ°ΠΏ
Π Π°Π·Π²Π΅ΡΡΡΠ²Π°Π½ΠΈΠ΅ ΡΡΡΠ»ΠΎΠΊ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΠΈ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ «ΠΠΊΡΠ°Π½»
ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΠ΅ΡΡΡΡΡ
- Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π΄Π»Ρ Teams
- ΠΠΊΠ»Π°Π΄ΠΊΠΈ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ
- ΠΠ°ΡΡΠΎΡΠΊΠΈ
- ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ Π·Π°Π΄Π°Ρ Π²ΠΎ Π²ΠΊΠ»Π°Π΄ΠΊΠ°Ρ
- ΠΡΠ·ΡΠ²Ρ ΠΎ Π·Π°Π²Π΅ΡΡΠ΅Π½ΠΈΠΈ ΡΠΎΡΠΌΡ
37+ ΠΎΡΠ»ΠΈΡΠ½ΡΡ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠΎΠ² Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Ajax, CSS
ΠΠ° ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠ΅ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ Π»Π΅Ρ Π²Π΅Π±-ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΈ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π»ΠΈ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠΎΠ² Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ AJAX ΠΈ CSS, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΡΠ°Π»ΠΈ ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΡ ΠΌΠ΅ΡΠΎΠ΄ΠΎΠ², Π΄Π°ΡΡΠΈΡ Π½Π°ΠΌ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΠΏΠΎΠ»ΡΡΠ΅Π½ΠΈΡ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ Π±Π΅Π· Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ ΠΎΡΠΊΡΡΠ²Π°ΡΡ ΠΈ Π·Π°ΠΊΡΡΠ²Π°ΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΎΠΊΠΎΠ½ ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎ.
ΠΡ ΠΏΠΎΡΡΠ°ΡΠΈΠ»ΠΈ ΡΠ°ΡΡ Π½Π° ΠΏΠΎΠΈΡΠΊ Π»ΡΡΡΠΈΡ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠΎΠ² Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΡΠΎΠ»ΡΠΊΠΎ CSS, CSS/Ajax ΠΈ ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ², ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠΌΠΎΠ³ΡΡ Π²Π°ΠΌ ΡΠΎΠ·Π΄Π°ΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠ΅ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΡ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Ajax ΠΈΠ»ΠΈ CSS.
Pro Tip
ΠΠ°ΡΠ΅Π³ΠΈΡΡΡΠΈΡΡΠΉΡΠ΅ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΡ ΡΡΠ΅ΡΠ½ΡΡ Π·Π°ΠΏΠΈΡΡ Jotform , ΡΡΠΎΠ±Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΌΠΎΡΠ½ΡΠ΅ ΠΎΠ½Π»Π°ΠΉΠ½-ΡΠΎΡΠΌΡ Π·Π° ΡΡΠΈΡΠ°Π½Π½ΡΠ΅ ΠΌΠΈΠ½ΡΡΡ β Π±Π΅Π· Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΡ.
ΠΡ Ρ ΠΎΡΠ΅Π»ΠΈ Π±Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²ΠΈΡΡ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΡ Π½Π°ΡΠ΅Π³ΠΎ ΠΏΠΎΠΈΡΠΊΠ°:
ΠΠ²ΡΠΎΠ·Π°ΠΌΠ΅Π½Π° Π²ΠΊΠ»Π°Π΄ΠΎΠΊ
1) Easy Tabs 1.2 Ρ Π°Π²ΡΠΎΠ·Π°ΠΌΠ΅Π½ΠΎΠΉΠ’Π΅ΠΏΠ΅ΡΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠ΅ΠΆΠΈΠΌ Π°Π²ΡΠΎΠ·Π°ΠΌΠ΅Π½Ρ Π΄Π»Ρ ΠΎΠ΄Π½ΠΎΠΉ ΠΈΠ· Π²Π°ΡΠΈΡ ΠΌΠ΅Π½Ρ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ.
2) ΠΡΠ°ΡΠ°ΡΡΠΈΠ΅ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ jQuery 3) Π‘ΡΠ΅Π½Π°ΡΠΈΠΉ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡ-βΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΡΠ΅ΠΆΠΈΠΌ Β«ΡΠ»Π°ΠΉΠ΄-ΡΠΎΡΒ», Π² ΠΊΠΎΡΠΎΡΠΎΠΌ ΡΡΠ΅Π½Π°ΡΠΈΠΉ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΡΠΈΠΊΠ»ΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠ΅ΡΠ΅Π±ΠΈΡΠ°Π΅Ρ ΠΈ ΠΏΠ΅ΡΠΈΠΎΠ΄ΠΈΡΠ΅ΡΠΊΠΈ Π²ΡΠ±ΠΈΡΠ°Π΅Ρ ΠΊΠ°ΠΆΠ΄ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ, ΠΏΠΎΠΊΠ° Π²ΠΊΠ»Π°Π΄ΠΊΠ° Π½Π΅ Π±ΡΠ΄Π΅Ρ ΡΠ²Π½ΠΎ Π²ΡΠ±ΡΠ°Π½Π°.
Π‘ΠΊΠΎΠ»ΡΠ·ΡΡΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ
4) Π‘ΠΊΠΎΠ»ΡΠ·ΡΡΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈΠ‘ΠΊΠΎΠ»ΡΠ·ΡΡΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ β ΡΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ mootools, ΠΊΠΎΡΠΎΡΡΠΉ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π΄ΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ Π°ΠΊΠΊΡΡΠ°ΡΠ½ΡΠΉ ΡΡΡΠ΅ΠΊΡ. ΠΡΠΎ ΠΊΠ»ΠΎΠ½ ΡΠΎΠ³ΠΎ, ΡΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ²ΠΈΠ΄Π΅ΡΡ Π½Π° ΡΠ°ΠΉΡΠ΅ Coda ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ Panic Software, ΠΊΠΎΡΠΎΡΡΠΉ, Π² ΡΠ²ΠΎΡ ΠΎΡΠ΅ΡΠ΅Π΄Ρ, ΠΎΡΠ΅Π½Ρ ΡΠΈΠ»ΡΠ½ΠΎ Π²Π΄ΠΎΡ Π½ΠΎΠ²Π»Π΅Π½ Π²ΠΈΠ΄ΠΆΠ΅ΡΠΎΠΌ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠΌ Π² iTunes Music Store.
5) Coda-SliderΠ£Π΄ΠΈΠ²ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ jQuery Coda-Slider ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄Π»Ρ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ³ΠΎ ΠΈ ΡΠ΄ΠΎΠ±Π½ΠΎΠ³ΠΎ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°.
6) ΠΠΊΠ»Π°Π΄ΠΊΠΈ Ρ ΠΏΠ΅ΡΡΠΏΠ΅ΠΊΡΠΈΠ²ΠΎΠΉΠ Π°Π½ΡΡΠ΅ Π² Sliding Tabs ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π»ΠΈΡΡ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΡ mootools, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ Π±ΠΎΠ»ΡΡΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π½Π° Π½Π΅Π±ΠΎΠ»ΡΡΠΎΠΌ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²Π΅.
Π‘ΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Ajax
7) Π‘ΡΠ΅Π½Π°ΡΠΈΠΉ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ AjaxΠΡΠΎ ΡΠ½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΡΠΉ ΡΡΠ΅Π½Π°ΡΠΈΠΉ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Ajax, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅, ΠΈΠ·Π²Π»Π΅ΡΠ΅Π½Π½ΠΎΠ΅ ΠΈΠ· Π²Π½Π΅ΡΠ½ΠΈΡ ΡΠ°ΠΉΠ»ΠΎΠ² Π²Π½ΡΡΡΠΈ DIV ΠΈ ΡΠΏΠΎΡΡΠ΄ΠΎΡΠ΅Π½Π½ΠΎΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ CSS.
ΠΠ°ΠΊΡΡΠ²Π°ΡΡΠΈΠ΅ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ
8) ΠΠ°Π½Π΅Π»ΠΈ Π²ΠΊΠ»Π°Π΄ΠΎΠΊΠΠ²Π΅ Π²Π΅ΡΡΠΈΠΈ Ρ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡΡ Π·Π°ΠΊΡΡΡΠΈΡ ΠΈ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΠΏΠ°Π½Π΅Π»Π΅ΠΉ.
9) ΠΠΎΠ΄ΡΠ»Ρ Β«ΠΠ°ΠΊΡΡΠ²Π°Π΅ΠΌΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈΒ»ΠΠΈΠ΄ΠΆΠ΅Ρ Β«ΠΠ°ΠΊΡΡΠ²Π°Π΅ΠΌΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈΒ» ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠ΄Π°Π»ΡΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ.
ΠΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΡΠΌΠΎΡΡΠΈΡΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΡ
10) FabtabulousΠΡΠΎΡΡΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Prototype
11) Π’Π΅ΠΌΠ° JQuery TabContainerΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Π΅ΡΡΡ ΠΌΠ΅ΠΆΠ΄Ρ Π²ΡΠ±ΡΠ°Π½Π½ΡΠΌΠΈ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ
13) MooTabsMooTabs β ΡΡΠΎ ΠΊΡΠΎΡΠ΅ΡΠ½ΡΠΉ (3 ΠΠ) ΠΊΠ»Π°ΡΡ Π΄Π»Ρ MooTools. ΠΠ°ΠΊ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΈΠ· Π½Π°Π·Π²Π°Π½ΠΈΡ, Π΅Π³ΠΎ ΠΎΡΠ½ΠΎΠ²Π½Π°Ρ ΡΠ΅Π»Ρ β ΠΏΠΎΠΌΠΎΡΡ Π² ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ ΠΏΡΠΎΡΡΠΎΠΉ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ ΠΏΠΎ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌ.
14) ΠΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ TabViewΠΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ TabView ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ°ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ, Π½Π° ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ.
15) ΠΡΠΈΡΡΠ΄Π»ΠΈΠ²ΠΎΠ΅ ΡΠΊΠΎΠ»ΡΠ·ΡΡΠ΅Π΅ ΠΌΠ΅Π½Ρ Π²ΠΊΠ»Π°Π΄ΠΎΠΊΠΡΠΎ ΠΊΠ»Π°ΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π½ΠΎ Π² script.aculo.us
16) Control.TabsΠΠ΅Π½Π°Π²ΡΠ·ΡΠΈΠ²ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ CSS Π΄Π»Ρ Prototype.js
17) ΠΠΊΠ»Π°Π΄ΠΊΠΈ Zapatec AjaxΠ ΡΡΠΎΠΉ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΡΠ°Π½ΡΠΏΠΎΡΡΠ½ΡΠΉ ΡΡΠΎΠ²Π΅Π½Ρ Zapatec AJAX Π΄Π»Ρ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΎΠΉ ΠΏΠ΅ΡΠ΅Π΄Π°ΡΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ.
ΠΠ΅Π½Π΅ΡΠ°ΡΠΎΡΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Ajax
18) 15daysofjquery- jQuery TabsΠΡΠΎΡΡΠ°Ρ ΡΠΎΡΠΌΠ°, ΠΊΠΎΡΠΎΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠΈ Π΄Π»Ρ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ.
Π Π°ΡΡΠΈΡΠ΅Π½Π½ΡΠ΅ ΠΌΠ΅ΡΠΎΠ΄Ρ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ
19) Π Π°ΡΡΠΈΡΠ΅Π½Π½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈΠΡΠ° ΠΏΠ°Π½Π΅Π»Ρ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΠΏΠΎΡΡΡΠΎΠ΅Π½Π° Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ JavaScript ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠΈΡΡΠ΅Ρ: Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΠ° Π²ΠΊΠ»Π°Π΄ΠΎΠΊ, ΠΏΡΠΎΠΊΡΡΡΠΊΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ, Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΡΠΎ Π·Π½Π°ΡΠΊΠ°ΠΌΠΈ, ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ (ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ), Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Ρ ΠΏΠΎΠΌΠΎΡΡΡ JS.
20) ΠΠ»Π°Π²Π°ΡΡΠ΅Π΅ ΠΎΠΊΠ½ΠΎ Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈΠΡΠΎΡ ΡΠΊΡΠΈΠΏΡ ΠΎΡΠ½ΠΎΠ²Π°Π½ Π½Π° ΠΏΡΠΎΡΡΡΡ ΠΎΠ±ΡΡΠ½ΡΡ ΡΠ΅Π³Π°Ρ div. ΠΡΠΎ Π΄Π΅Π»Π°Π΅Ρ Π΅Π³ΠΎ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΡΠΌ Π² Π½Π°ΡΡΡΠΎΠΉΠΊΠ΅. ΠΡΡΠ°Π²ΡΡΠ΅ ΡΠ²ΠΎΠΉ HTML-ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΠΈ Π²ΡΠ·ΠΎΠ²ΠΈΡΠ΅ ΡΡΠ½ΠΊΡΠΈΡ javascript Π΄Π»Ρ ΠΈΠ½ΠΈΡΠΈΠ°Π»ΠΈΠ·Π°ΡΠΈΠΈ ΠΎΠΊΠ½Π°.
21) ΠΠΊΠ»Π°Π΄ΠΊΠΈ AJAX (Rails redux)ΠΠΎΠ½ΡΠ΅ΠΏΡΠΈΡ Π·Π΄Π΅ΡΡ Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ Ajax Π΄Π»Ρ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΡ Π½Π΅ Π½ΡΠΆΠ½ΠΎ ΠΈΠ·Π²Π»Π΅ΠΊΠ°ΡΡ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ°Π·, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΈΠ·Π²Π»Π΅ΠΊΠ°Π΅Ρ Π·Π°ΠΏΠΈΡΡ.
22) ΠΠΊΠ»Π°Π΄ΠΊΠΈ Ajax ΠΏΠ΅ΡΠ΅Π·Π°Π³ΡΡΠΆΠ΅Π½ΡΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΌΠΎΠΆΠ΅Ρ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ ΠΈΠ»ΠΈ ΡΠ΄Π°Π»ΡΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ (ΠΈ ΠΊΠΎΠ½ΡΠ΅Π½Ρ) Π±Π΅Π· ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ ΡΡΡΠ°Π½ΠΈΡΡ.
23) ΠΠ»ΠΎΠΆΠ΅Π½Π½Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ° JQueryΠΠΊΠ»Π°Π΄ΠΊΠΈ ΡΠΎΠ»ΡΠΊΠΎ Ρ CSS
24) ΠΡΠΎΡΡ-Π±ΡΠ°ΡΠ·Π΅ΡΠ½ΡΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ ΠΈ Π²ΡΡΡΠΎΠ΅Π½Π½ΡΠΌΠΈ ΡΡΡΠ»ΠΊΠ°ΠΌΠΈ
ΠΠΠ’ javascript β ΡΠΎΠ»ΡΠΊΠΎ CSS β ΠΈ ΠΎΠ½ ΠΏΡΠΎΠ²Π΅ΡΡΠ΅Ρ. ΠΡΠΎΡΡΠΎ Π½Π°Π²Π΅Π΄ΠΈΡΠ΅ ΡΠΊΠ°Π·Π°ΡΠ΅Π»Ρ ΠΌΡΡΠΈ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠΈ, ΡΡΠΎΠ±Ρ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΡΡ ΡΡΡΠ°Π½ΠΈΡΡ ΡΠ΅ΠΊΡΡΠ° Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΈ Π²ΡΡΡΠΎΠ΅Π½Π½ΡΠΌΠΈ ΡΡΡΠ»ΠΊΠ°ΠΌΠΈ. ΠΡΠΈ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ Π΄Π»Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΡΡΡΠ°Π½ΠΈΡΡ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΡΡΡ ΡΠ°Π±ΠΎΡΠ°Ρ ΠΏΠΎΠ»ΠΎΡΠ° ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ.
25) ΠΠΊΠ»Π°Π΄ΠΊΠΈ CSSΠ¦Π΅Π»Ρ ΡΠΎΡΡΠΎΡΠ»Π° Π² ΡΠΎΠΌ, ΡΡΠΎΠ±Ρ ΡΠΎΠ·Π΄Π°ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ CSS Π±Π΅Π· ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΊΠ°ΠΊΠΈΡ -Π»ΠΈΠ±ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΈΠ»ΠΈ Ρ Π°ΠΊΠΎΠ² ΠΈ Ρ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΡΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ CSS.
26) ΠΠΊΠ»Π°Π΄ΠΊΠΈ, ΡΠΏΡΠ°Π²Π»ΡΠ΅ΠΌΡΠ΅ CSS 27) ΠΠΊΠ»Π°Π΄ΠΊΠΈ, ΡΠΏΡΠ°Π²Π»ΡΠ΅ΠΌΡΠ΅ CSS 28) ΠΠΊΠ»Π°Π΄ΠΊΠΈ CSSΠΠ° ΠΎΡΠ½ΠΎΠ²Π΅ Π²Π΅ΡΡΠΈΠΈ ΠΠΆΠΎΡΡΠ° ΠΠ°ΡΡΠΌΠ°Π½Π°
29) ΠΠ΅Π½Ρ ΡΠΊΡΡΡΡΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊΠΡΠΎΡΡΠΎΠ΅ ΠΌΠ΅Π½Ρ ΡΠΊΡΡΡΡΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΠΊΠΎΡΠΎΡΡΠΉ ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΡ.
30) ΠΠ΅ΡΠ΅Π²Π΅ΡΠ½ΡΡΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Π΄Π»Ρ ΡΠ°Π·Π΄Π²ΠΈΠΆΠ½ΡΡ Π΄Π²Π΅ΡΠ΅ΠΉΠΠ΅ΡΠ΅Π²Π΅ΡΠ½ΡΡΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ ΠΎΠ·Π½Π°ΡΠ°ΡΡ, ΡΡΠΎ ΠΎΠ½ΠΈ Π²ΡΡΠΎΠ²Π½Π΅Π½Ρ ΠΏΠΎ Π½ΠΈΠΆΠ½Π΅ΠΌΡ ΠΊΡΠ°Ρ, ΠΈ ΠΏΠΎ ΠΌΠ΅ΡΠ΅ ΡΠ²Π΅Π»ΠΈΡΠ΅Π½ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΡΠ΅ΠΊΡΡΠ° Π²ΡΠ΅ Π±ΠΎΠ»ΡΡΠ΅ ΠΈ Π±ΠΎΠ»ΡΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ ΡΠ²Π΅ΡΡ Ρ Π²Π½ΠΈΠ·, Π° Π½Π΅ ΡΠ½ΠΈΠ·Ρ Π²Π²Π΅ΡΡ , ΠΊΠ°ΠΊ Π² ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»ΡΠ½Π°Ρ ΡΠ΅Ρ Π½ΠΈΠΊΠ° ΡΠ°Π·Π΄Π²ΠΈΠΆΠ½ΡΡ Π΄Π²Π΅ΡΠ΅ΠΉ.
31) ΠΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ ΠΏΡΠΎΡΡΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ CSSΠΠΊΠ»Π°Π΄ΠΊΠΈ CSS Ρ Π²Π»ΠΎΠΆΠ΅Π½Π½ΡΠΌ ΠΌΠ΅Π½Ρ.
32) ΠΠΊΠ»Π°Π΄ΠΊΠΈ CSS Ρ ΠΏΠΎΠ΄ΠΌΠ΅Π½ΡΠΡΠΎ ΡΠΏΠΎΡΠΎΠ± Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ ΠΈ ΠΏΠΎΠ΄Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΡΠΎΠ»ΡΠΊΠΎ CSS ΠΈ Π²Π»ΠΎΠΆΠ΅Π½Π½ΡΡ Π½Π΅ΡΠΏΠΎΡΡΠ΄ΠΎΡΠ΅Π½Π½ΡΡ ΡΠΏΠΈΡΠΊΠΎΠ².
33) Π£ΠΏΡΠΎΡΠ΅Π½Π½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ CSS 34) ΠΠΊΠ»Π°Π΄ΠΊΠΈΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ CSS Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ. Π’ΠΎΡ, Π³Π΄Π΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΌΠΎΠΆΠ΅Ρ Π½Π°ΠΆΠΈΠΌΠ°ΡΡ Π½Π° ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ, ΡΡΠΎΠ±Ρ ΠΏΡΠΎΡΠΌΠ°ΡΡΠΈΠ²Π°ΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΈ ΡΠΎΠΌ ΠΆΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²Π΅.
Π£ΡΠ΅Π±Π½ΠΈΠΊΠΈ ΠΏΠΎ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌ Ajax
35) ΠΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Ajax Π² 20 ΡΡΡΠΎΠΊΠ°ΡΠΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Ajax Π²ΡΠ΅Π³ΠΎ Π² 17 ΡΡΡΠΎΠΊΠ°Ρ ΠΊΠΎΠ΄Π° Π±Π»Π°Π³ΠΎΠ΄Π°ΡΡ ΠΊΠ°ΡΠΊΠ°ΡΡ Prototype Javascript.
36) Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈΠΠ° ΡΡΠΎΠΌ ΡΠ΅ΠΌΠΈΠ½Π°ΡΠ΅ ΠΌΡ Π±ΡΠ΄Π΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π±ΡΠ°ΡΠ·Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ Π½Π° Π±Π°Π·Π΅ Ajax. ΠΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΡΠ΅Π»ΠΊΠ½Π΅Ρ Π²ΠΊΠ»Π°Π΄ΠΊΡ, Ajax ΡΠ²ΡΠΆΠ΅ΡΡΡ Ρ ΡΠ΅ΡΠ²Π΅ΡΠΎΠΌ ΠΈ ΠΎΡΠΏΡΠ°Π²ΠΈΡ ΠΎΠ±ΡΠ°ΡΠ½ΠΎ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΠ΅ Π΄Π°Π½Π½ΡΠ΅ Π΄Π»Ρ ΡΡΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ.
37) ΠΠΊΠ»Π°Π΄ΠΊΠΈ CSSΠΡΠ»ΠΈΡΠ½ΡΠΉ ΡΡΠ΅Π±Π½ΠΈΠΊ, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π°ΡΡΠΈΡ Π½Π°Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ CSS.
ΠΡΠ° ΡΡΠ°ΡΡΡ Π±ΡΠ»Π° ΠΏΠ΅ΡΠ²ΠΎΠ½Π°ΡΠ°Π»ΡΠ½ΠΎ ΠΎΠΏΡΠ±Π»ΠΈΠΊΠΎΠ²Π°Π½Π° 21 ΡΠ΅Π²ΡΠ°Π»Ρ 2008 Π³. ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Π° ββ24 ΡΠ½Π²Π°ΡΡ 2023 Π³.
Π£ΡΠΈΡΠ΅ΡΡ ΠΆΠΈΡΡ ΠΈ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΡΠΌΠ½Π΅Π΅, Π° Π½Π΅ ΡΡΠ΅ΡΠ΄Π½Π΅Π΅!
ΠΠΎΠ»ΡΡΠ°ΠΉΡΠ΅ Π½Π°ΡΠΈ Π»ΡΡΡΠΈΠ΅ ΡΡΠ°ΡΡΠΈ ΠΊΠ°ΠΆΠ΄ΡΡ Π½Π΅Π΄Π΅Π»Ρ ΠΏΡΡΠΌΠΎ Π² ΡΠ²ΠΎΠΉ ΠΏΠΎΡΡΠΎΠ²ΡΠΉ ΡΡΠΈΠΊ.
ΠΠ²Π΅Π΄ΠΈΡΠ΅ Π²Π°Ρ Π°Π΄ΡΠ΅Ρ ΡΠ»Π΅ΠΊΡΡΠΎΠ½Π½ΠΎΠΉ ΠΏΠΎΡΡΡ
ΠΠΊΠ»Π°Π΄ΠΊΠΈ β Spectrum CSS
ΠΠ°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅
ΠΠ΅ΡΡΠΈΡ Vars
Π‘ΡΠ°ΡΡΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ° | ΠΠΊΠ»Π°Π΄ |
---|---|
ΠΠΎΡΠ»Π΅Π΄Π½ΠΈΠΉ Π²ΡΠΏΡΡΠΊ | 26 Π°ΠΏΡΠ΅Π»Ρ 2023 Π³. |
Π’Π΅ΠΊΡΡΠ°Ρ Π²Π΅ΡΡΠΈΡ | @spectrum-css/[email protected] |
ΠΠ΅Π±-ΡΠ°ΠΉΡ Spectrum
GitHub
Π Π°Π·ΠΌΠ΅Ρ
ΠΠΊΠ»Π°Π΄
S
ΠΠΊΠ»Π°Π΄ΠΊΠ° 1
ΠΠΊΠ»Π°Π΄ΠΊΠ° 2
ΠΠΊΠ»Π°Π΄ΠΊΠ° 3
90 002 ΠΠΊΠ»Π°Π΄ΠΊΠ° 4M (ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ)
ΠΠ°ΠΊΠ»Π°Π΄ΠΊΠ° 1
ΠΠ°ΠΊΠ»Π°Π΄ΠΊΠ° 2
ΠΠ°ΠΊΠ»Π°Π΄ΠΊΠ° 3
ΠΠ°ΠΊΠ»Π°Π΄ΠΊΠ° 4
L
ΠΠ°ΠΊΠ»Π°Π΄ΠΊΠ° 1
ΠΠ°ΠΊΠ»Π°Π΄ΠΊΠ° 2
ΠΠ°ΠΊΠ»Π°Π΄ΠΊΠ° 3 9000 3
Π―Π·ΡΡΠΎΠΊ 4
XL
Π―Π·ΡΡΠΎΠΊ 1
Π―Π·ΡΡΠΎΠΊ 2
Π―Π·ΡΡΠΎΠΊ 3
ΠΠΊΠ»Π°Π΄ΠΊΠ° 4
ΠΠΎΠΊΠ°Π·Π°ΡΡ ΡΠ°Π·ΠΌΠ΅ΡΠΊΡ
S
<Π΄Π΅Π»>