ꯃꯤꯑꯣꯏ ꯑꯃꯃꯃꯒꯤ ꯑꯣꯏꯅꯥ ꯅꯠꯠꯔꯒꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯕꯥ꯫

ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯑꯁꯤ ꯃꯤꯑꯣꯏ ꯑꯃꯃꯃꯒꯤ ꯑꯣꯏꯅꯥ (ꯈꯔꯅꯥ ꯗꯤꯄꯦꯟꯗꯦꯟꯁꯁꯤꯡ ꯃꯊꯧ ꯇꯥꯔꯕꯁꯨ), ꯅꯠꯠꯔꯒꯥ ꯄꯨꯝꯅꯃꯛ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯌꯥꯑꯣꯍꯅꯕꯥ ꯌꯥꯏ꯫ bootstrap.js ꯑꯃꯁꯨꯡ bootstrap.min.js ꯑꯅꯤꯃꯛꯇꯥ ꯐꯥꯏꯜ ꯑꯃꯈꯛꯇꯗꯥ ꯄ꯭ꯂꯒꯏꯟ ꯄꯨꯝꯅꯃꯛ ꯌꯥꯑꯣꯏ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ꯫

ꯅꯍꯥꯛꯅꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯂꯥꯏꯟ ꯑꯃꯠꯇꯥ ꯏꯗꯅꯥ ꯃꯥꯔꯀꯑꯥꯞ APIꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯃꯄꯨꯡꯐꯥꯅꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯄ꯭ꯂꯒꯏꯟ ꯄꯨꯝꯅꯃꯛ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯒꯅꯤ꯫ ꯃꯁꯤ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯑꯍꯥꯅꯕꯥ ꯀ꯭ꯂꯥꯁ APIꯅꯤ ꯑꯃꯁꯨꯡ ꯄ꯭ꯂꯒꯏꯟ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯕꯗꯥ ꯅꯍꯥꯛꯀꯤ ꯑꯍꯥꯅꯕꯥ ꯋꯥꯈꯜꯂꯣꯟ ꯑꯣꯏꯒꯗꯕꯅꯤ꯫

ꯍꯥꯌꯕꯗꯤ, ꯐꯤꯚꯝ ꯈꯔꯗꯥ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯑꯁꯤ ꯑꯣꯐ ꯇꯧꯕꯥ ꯑꯁꯤ ꯄꯥꯝꯅꯔꯀꯄꯥ ꯌꯥꯏ꯫ ꯃꯔꯝ ꯑꯗꯨꯅꯥ, ꯑꯩꯈꯣꯌꯅꯥ `'ꯗꯦꯇꯥ-ꯑꯦꯄꯤ'`ꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯕꯣꯗꯤ ꯅꯦꯃꯁ꯭ꯄꯦꯁ ꯇꯧꯕꯥ ꯌꯥꯕꯥ ꯊꯧꯗꯣꯛ ꯄꯨꯝꯅꯃꯛ ꯑꯅꯕꯥꯏꯟ ꯇꯧꯗꯨꯅꯥ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯦ.ꯄꯤ.ꯑꯥꯏ. ꯃꯁꯤ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯁꯤꯒꯨꯝꯅꯥ ꯎꯕꯥ ꯐꯪꯏ:

$ ( 'ꯍꯀꯆꯥꯡ' ). ꯑꯣꯐ ( '.ꯗꯥꯇꯥ-ꯑꯦꯄꯤ' ) .

ꯅꯠꯠꯔꯒꯥ, ꯑꯀꯛꯅꯕꯥ ꯄ꯭ꯂꯒꯏꯟ ꯑꯃꯗꯥ ꯇꯥꯔꯒꯦꯠ ꯇꯧꯅꯕꯥ, ꯄ꯭ꯂꯒꯏꯟ ꯑꯗꯨꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ ꯅꯦꯃꯁ꯭ꯄꯦꯁ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯗꯦꯇꯥ-ꯑꯦꯄꯤꯑꯥꯏ ꯅꯦꯃꯁ꯭ꯄꯦꯁ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯁꯤꯒꯨꯝꯅꯥ ꯌꯥꯑꯣꯍꯅꯒꯗꯕꯅꯤ:

$ ( 'ꯍꯀꯆꯥꯡ' ). ꯑꯣꯐ ( '.ꯑꯦꯂꯔꯠ.ꯗꯥꯇꯥ-ꯑꯦꯄꯤ' )

ꯄ꯭ꯔꯣꯒ꯭ꯔꯥꯃꯦꯇꯤꯛ ꯑꯦ.ꯄꯤ.ꯑꯥꯏ

ꯑꯩꯈꯣꯌꯅꯥ ꯃꯁꯤꯃꯁꯨ ꯊꯥꯖꯩ ꯃꯗꯨꯗꯤ ꯑꯗꯣꯝꯅꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯄ꯭ꯂꯒꯏꯟ ꯄꯨꯝꯅꯃꯛ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯦ.ꯄꯤ.ꯑꯥꯏ.ꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯒꯗꯕꯅꯤ꯫ ꯄꯕ꯭ꯂꯤꯛ ꯑꯦ.ꯄꯤ.ꯑꯥꯏ.ꯁꯤꯡ ꯄꯨꯝꯅꯃꯛ ꯑꯁꯤ ꯁꯤꯉ꯭ꯒꯜ, ꯆꯦꯟ ꯇꯧꯕꯥ ꯌꯥꯕꯥ ꯃꯦꯊꯗꯁꯤꯡꯅꯤ, ꯑꯃꯁꯨꯡ ꯑꯦꯛꯇꯤꯕ ꯑꯣꯏꯕꯥ ꯈꯣꯃꯖꯤꯅꯕꯥ ꯑꯗꯨ ꯍꯜꯂꯀꯏ꯫

$ ( ".btn.ꯈꯨꯗꯣꯡꯊꯤꯕꯥ" ). ꯕꯇꯟ ( "ꯇꯣꯒꯜ ꯇꯧꯕꯥ" ). addClass ( "ꯐꯦꯠ" ) ꯑꯁꯤ ꯌꯥꯑꯣꯔꯤ꯫

ꯃꯦꯊꯗ ꯄꯨꯝꯅꯃꯛꯅꯥ ꯑꯣꯄꯁꯅꯦꯜ ꯑꯣꯄꯁꯅꯁꯤꯡꯒꯤ ꯑꯣꯕꯖꯦꯛꯇ ꯑꯃꯥ, ꯑꯀꯛꯅꯕꯥ ꯃꯦꯊꯗ ꯑꯃꯗꯥ ꯇꯥꯔꯒꯦꯠ ꯇꯧꯕꯥ ꯁ꯭ꯠꯔꯤꯡ ꯑꯃꯥ, ꯅꯠꯠꯔꯒꯥ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯑꯃꯠꯇꯥ (ꯗꯤꯐꯣꯜꯇ ꯕꯤꯍꯦꯕꯤꯌꯔꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯄ꯭ꯂꯒꯏꯟ ꯑꯃꯥ ꯍꯧꯗꯣꯀꯄꯥ) ꯌꯥꯕꯥ ꯇꯥꯏ:

$ ( "#ꯑꯩꯒꯤ ꯃꯣꯗꯜ" ). modal () // ꯗꯤꯐꯣꯜꯇꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯕꯥ꯫                       
$ ( "#ꯑꯩꯒꯤ ꯃꯣꯗꯜ" ). modal ({ keyboard : false }) // ꯀꯤꯕꯣꯔꯗ ꯑꯃꯠꯇꯥ ꯂꯩꯇꯅꯥ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯕꯥ꯫     
$ ( "#ꯑꯩꯒꯤ ꯃꯣꯗꯜ" ). modal ( 'show' ) // ꯈꯨꯗꯛꯇꯥ ꯎꯠꯄꯥ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯏ ꯑꯃꯁꯨꯡ ꯏꯅꯚꯣꯛ ꯇꯧꯏ꯫                

ꯄ꯭ꯂꯒꯏꯟ ꯈꯨꯗꯤꯡꯃꯛꯅꯥ ꯃꯈꯣꯌꯒꯤ ꯔꯣ ꯀꯟꯁꯠꯔꯛꯁꯟ ꯑꯗꯨꯁꯨ `ꯀꯟꯁꯠꯔꯛꯁꯟ` ꯄ꯭ꯔꯣꯄꯔꯇꯤ ꯑꯃꯗꯥ ꯑꯦꯛꯁꯄꯣꯖ ꯇꯧꯏ: $.fn.popover.Constructor. ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯑꯀꯛꯅꯕꯥ ꯄ꯭ꯂꯒꯏꯟ ꯏꯟꯁꯇꯦꯟꯁ ꯑꯃꯥ ꯐꯪꯅꯤꯡꯂꯕꯗꯤ, ꯃꯗꯨ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯗꯒꯤ ꯍꯀꯊꯦꯡꯅꯅꯥ ꯂꯧꯊꯣꯀꯎ: $('[rel=popover]').data('popover').

ꯀꯟꯐ꯭ꯂꯤꯛꯇ ꯑꯃꯠꯇꯥ ꯂꯩꯇꯦ꯫

ꯀꯔꯤꯒꯨꯝꯕꯥ ꯃꯇꯃꯗꯥ ꯑꯇꯣꯞꯄꯥ UI ꯐ꯭ꯔꯦꯃꯋꯥꯔꯀꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯏ꯫ ꯑꯁꯤꯒꯨꯝꯕꯥ ꯐꯤꯚꯃꯁꯤꯡ ꯑꯁꯤꯗꯥ, ꯅꯦꯃꯁ꯭ꯄꯦꯁ ꯀꯣꯂꯤꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯃꯇꯝ ꯃꯇꯃꯒꯤ ꯑꯣꯏꯅꯥ ꯊꯣꯀꯄꯥ ꯌꯥꯏ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯃꯁꯤ ꯑꯣꯏꯔꯕꯗꯤ, ꯅꯍꯥꯛꯅꯥ .noConflictꯚꯦꯜꯌꯨ ꯑꯗꯨ ꯔꯤꯚꯔꯠ ꯇꯧꯕꯥ ꯄꯥꯝꯂꯤꯕꯥ ꯄ꯭ꯂꯒꯏꯟ ꯑꯗꯨꯗꯥ ꯀꯜ ꯇꯧꯕꯥ ꯌꯥꯏ꯫

var ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯕꯇꯟ = $ . ꯑꯦꯐ ꯑꯦꯟ . ꯕꯇꯟ ꯑꯗꯨ . noConflict () // ꯃꯃꯥꯡꯗꯥ ꯑꯦꯁꯥꯏꯟ ꯇꯧꯔꯕꯥ ꯚꯦꯜꯌꯨꯗꯥ $.fn.button ꯔꯤꯇꯔꯟ ꯇꯧꯔꯣ 
$ . ꯑꯦꯐ ꯑꯦꯟ . bootstrapBtn = bootstrapButton             // ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯑꯗꯨ $().bootstrapBtn ꯄꯤꯌꯨ

ꯊꯧꯔꯃꯁꯤꯡ꯫

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯅꯥ ꯑꯌꯥꯝꯕꯥ ꯄ꯭ꯂꯒꯏꯅꯒꯤ ꯑꯈꯟꯅꯕꯥ ꯑꯦꯛꯁꯅꯁꯤꯡꯒꯤꯗꯃꯛ ꯀꯁ꯭ꯇꯝ ꯏꯚꯦꯟꯇꯁꯤꯡ ꯄꯤꯔꯤ꯫ ꯃꯍꯧꯁꯥꯅꯥ, ꯍꯥꯌꯔꯤꯕꯁꯤꯡ ꯑꯁꯤ ꯏꯅꯐꯤꯅꯤꯇꯤꯕ ꯑꯃꯁꯨꯡ ꯄꯥꯁ꯭ꯠ ꯄꯥꯔꯇꯤꯁꯤꯄꯦꯜ ꯃꯑꯣꯡ ꯑꯃꯗꯥ ꯂꯥꯀꯏ - ꯃꯐꯝ ꯑꯗꯨꯗꯥ ꯏꯅꯐꯤꯅꯤꯇꯤꯕ (ex. show) ꯑꯁꯤ ꯊꯧꯗꯣꯛ ꯑꯃꯥ ꯍꯧꯕꯗꯥ ꯇ꯭ꯔꯤꯒꯔ ꯇꯧꯏ, ꯑꯃꯁꯨꯡ ꯃꯁꯤꯒꯤ ꯄꯥꯁ꯭ꯠ ꯄꯥꯔꯇꯤꯁꯤꯄꯦꯜ ꯃꯑꯣꯡ (ex. shown) ꯑꯁꯤ ꯑꯦꯛꯁꯟ ꯑꯃꯥ ꯂꯣꯏꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ ꯇ꯭ꯔꯤꯒꯔ ꯇꯧꯏ꯫

ꯏꯅꯐꯤꯅꯤꯇꯤꯕ ꯏꯚꯦꯟꯇ ꯄꯨꯝꯅꯃꯛꯅꯥ preventDefault ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯄꯤꯔꯤ꯫ ꯃꯁꯤꯅꯥ ꯑꯦꯛꯁꯟ ꯑꯃꯥ ꯍꯧꯗ꯭ꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ ꯑꯦꯛꯁꯦꯁꯤꯕꯜ ꯑꯣꯏꯕꯥ ꯊꯤꯡꯕꯒꯤ ꯇꯧꯕꯥ ꯉꯝꯕꯗꯨ ꯄꯤ꯫

$ ( '#ꯑꯩꯒꯤ ꯃꯣꯗꯜ' ). on ( 'ꯌꯦꯡꯎ' , ꯐꯉ꯭ꯀꯁꯟ ( ꯏ ) {   
    ꯀꯔꯤꯒꯨꯝꯕꯥ (! ꯗꯦꯇꯥ ) ꯔꯤꯇꯔꯟ ꯇꯧꯕꯥ ꯏ . preventDefault () // ꯃꯣꯗꯜ ꯑꯗꯨ ꯎꯠꯄꯥ ꯊꯤꯡꯏ꯫   
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

ꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯁꯤꯡꯒꯤ ꯃꯇꯥꯡꯗꯥ꯫

ꯏꯆꯝ ꯆꯝꯕꯥ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯏꯐꯦꯛꯇꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ, ꯑꯇꯣꯞꯄꯥ JS ꯐꯥꯏꯂꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ bootstrap-transition.js ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯌꯥꯑꯣꯍꯅꯒꯗꯕꯅꯤ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ (ꯅꯠꯠꯔꯒꯥ ꯃꯤꯅꯤꯐꯥꯏꯗ) bootstrap.js ꯁꯤꯖꯤꯟꯅꯔꯕꯗꯤ , ꯃꯁꯤ ꯌꯥꯑꯣꯍꯅꯕꯒꯤ ꯃꯊꯧ ꯇꯥꯗꯦ—ꯃꯁꯤ ꯍꯥꯟꯅꯅꯥ ꯂꯩꯔꯦ꯫

ꯀꯦꯁꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯧ꯫

ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯄ꯭ꯂꯒꯏꯅꯒꯤ ꯈꯨꯗꯝ ꯈꯔꯥ:

• ꯃꯣꯗꯂꯁꯤꯡꯗꯥ ꯁ꯭ꯂꯥꯏꯗ ꯇꯧꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯐꯦꯗ ꯇꯧꯕꯥ꯫
• ꯐꯦꯗꯤꯡ ꯑꯥꯎꯠ ꯇꯦꯕꯁꯤꯡ꯫
• ꯐꯦꯗꯤꯡ ꯑꯥꯎꯠ ꯑꯦꯂꯔꯇꯁꯤꯡ꯫
• ꯁ꯭ꯂꯥꯏꯗ ꯇꯧꯕꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯄꯦꯅꯁꯤꯡ꯫

ꯈꯨꯗꯃꯁꯤꯡ꯫

ꯃꯣꯗꯦꯂꯁꯤꯡ ꯑꯁꯤ ꯁ꯭ꯠꯔꯤꯃꯂꯥꯏꯟ ꯇꯧꯏ, ꯑꯗꯨꯕꯨ ꯐ꯭ꯂꯦꯛꯁꯤꯕꯜ ꯑꯣꯏꯕꯥ, ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯅꯦꯝꯕꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯑꯃꯁꯨꯡ ꯁ꯭ꯃꯥꯔꯠ ꯗꯤꯐꯣꯜꯇꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯗꯥꯏꯂꯣꯒ ꯄ꯭ꯔꯣꯃꯞꯇꯁꯤꯡꯅꯤ꯫

ꯁ꯭ꯇꯦꯇꯤꯛ ꯑꯣꯏꯕꯥ ꯈꯨꯗꯝ꯫

ꯐꯨꯇꯔꯗꯥ ꯍꯦꯗ, ꯕꯣꯗꯤ, ꯑꯃꯁꯨꯡ ꯑꯦꯛꯁꯅꯁꯤꯡꯒꯤ ꯁꯦꯠ ꯌꯥꯑꯣꯕꯥ ꯔꯦꯟꯗꯔ ꯇꯧꯔꯕꯥ ꯃꯣꯗꯜ ꯑꯃꯥ꯫

<div class = "ꯃꯣꯗꯜ ꯍꯥꯏꯗ ꯐꯦꯗ" > 
  <div ꯀ꯭ꯂꯥꯁ = "ꯃꯣꯗꯜ-ꯍꯦꯗꯔ" > 
    <ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "ꯀ꯭ꯂꯣꯖ" data-dismiss = "ꯃꯣꯗꯜ" aria-hidden = "ꯑꯆꯨꯝꯕꯥ" > × </ꯕꯇꯟ>ꯗꯥ ꯊꯝꯃꯨ꯫    
    <h3> ꯃꯣꯗꯜ ꯍꯦꯗ </h3>
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <div ꯀ꯭ꯂꯥꯁ = "ꯃꯣꯗꯜ-ꯕꯣꯗꯤ" > 
    <p> ꯐꯖꯔꯕꯥ ꯍꯀꯆꯥꯡ ꯑꯃꯥ... </p>꯫
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <div class = "ꯃꯣꯗꯜ-ꯐꯨꯇꯔ" > 
    <a href = "#" class = "btn" > ꯊꯤꯡꯖꯤꯜꯂꯨ </a>  
    <a href = "#" class = "btn btn-primary" > ꯑꯍꯣꯡꯕꯁꯤꯡ ꯁꯦꯚ ꯇꯧꯕꯥ </a>  
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

ꯂꯥꯏꯚ ꯗꯦꯃꯣ꯫

ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯕꯇꯟ ꯑꯗꯨ ꯀ꯭ꯂꯤꯛ ꯇꯧꯗꯨꯅꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯃꯣꯗꯜ ꯑꯃꯥ ꯇꯣꯒꯜ ꯇꯧ꯫ ꯃꯁꯤ ꯃꯈꯥꯗꯥ ꯁ꯭ꯂꯥꯏꯗ ꯇꯧꯒꯅꯤ ꯑꯃꯁꯨꯡ ꯄꯦꯖꯒꯤ ꯃꯊꯛꯇꯒꯤ ꯐꯤꯗ ꯏꯟ ꯇꯧꯒꯅꯤ꯫

<!-- ꯃꯣꯗꯦꯜ ꯇ꯭ꯔꯤꯒꯔ ꯇꯧꯅꯕꯥ ꯕꯇꯟ -->
<a href = "#myModal" role = "button" class = "btn" data-toggle = "ꯃꯣꯗꯜ" > ꯗꯦꯃꯣ ꯃꯣꯗꯦꯜ ꯍꯧꯗꯣꯀꯎ </a>    
 
<!-- ꯃꯣꯗꯜ --> ꯍꯥꯌꯅꯥ ꯀꯧꯏ꯫
<div id = "myModal" class = "ꯃꯣꯗꯜ ꯂꯣꯠꯄꯥ ꯐꯦꯗ" tabindex = "-1" ꯊꯧꯗꯥꯡ = "ꯗꯥꯏꯂꯣꯒ" aria- labelledby = "myModalLabel" aria-hidden = "ꯑꯆꯨꯝꯕꯥ" >      
  <div ꯀ꯭ꯂꯥꯁ = "ꯃꯣꯗꯜ-ꯍꯦꯗꯔ" > 
    <ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "ꯀ꯭ꯂꯣꯖ" ꯗꯦꯇꯥ-ꯗꯤꯁꯃꯤꯁ = "ꯃꯣꯗꯜ" aria-hidden = "ꯑꯆꯨꯝꯕꯥ" > × </ꯕꯇꯟ>    
    <h3 id = "myModalLabel" > ꯃꯣꯗꯦꯜ ꯍꯦꯗ </h3> 
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <div ꯀ꯭ꯂꯥꯁ = "ꯃꯣꯗꯜ-ꯕꯣꯗꯤ" > 
    <p> ꯐꯖꯔꯕꯥ ꯍꯀꯆꯥꯡ ꯑꯃꯥ... </p>꯫
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <div class = "ꯃꯣꯗꯜ-ꯐꯨꯇꯔ" > 
    <button class = "btn" data-dismiss = "ꯃꯣꯗꯜ" aria-hidden = "ꯑꯆꯨꯝꯕꯥ" > ꯊꯤꯡꯖꯤꯜꯂꯨ </button>   
    <button class = "btn btn-primary" > ꯑꯍꯣꯡꯕꯁꯤꯡ ꯁꯦꯚ ꯇꯧꯕꯥ </button> 
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯏꯕꯥ ꯌꯥꯗꯅꯥ ꯃꯣꯗꯜ ꯑꯃꯥ ꯑꯦꯛꯇꯤꯕ ꯇꯧꯔꯣ꯫ data-toggle="modal"ꯀꯟꯠꯔꯣꯂꯔ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯗꯥ, ꯕꯇꯟ ꯑꯃꯒꯨꯝꯅꯥ, ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ data-target="#foo"ꯅꯠꯠꯔꯒꯥ href="#foo"ꯇꯣꯒꯜ ꯇꯧꯅꯕꯥ ꯑꯀꯛꯅꯕꯥ ꯃꯣꯗꯦꯜ ꯑꯃꯥ ꯇꯥꯔꯒꯦꯠ ꯇꯧꯅꯕꯥ ꯁꯦꯠ ꯇꯧ꯫

<button type = "button" data-toggle = "ꯃꯣꯗꯜ" ꯗꯦꯇꯥ-ꯇꯥꯔꯒꯦꯠ = "#myModal" > ꯃꯣꯗꯦꯜ ꯍꯧꯗꯣꯀꯎ </button>   

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

myModalꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯂꯥꯏꯟ ꯑꯃꯈꯛꯇꯒꯥ ꯂꯣꯌꯅꯅꯥ id ꯂꯩꯕꯥ ꯃꯣꯗꯜ ꯑꯃꯥ ꯀꯧꯕꯤꯌꯨ :

$ ( '#ꯑꯩꯒꯤ ꯃꯣꯗꯜ' ). ꯃꯣꯗꯜ ( ꯑꯣꯄꯁꯅꯁꯤꯡ ) .

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-backdrop="".

<a data-toggle="modal" href="remote.html" data-target="#modal">click me</a>

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

.ꯃꯣꯗꯜ(ꯑꯣꯄꯁꯅꯁꯤꯡ) ꯌꯥꯑꯣꯔꯤ꯫

ꯅꯍꯥꯛꯀꯤ ꯀꯟꯇꯦꯟꯇ ꯑꯗꯨ ꯃꯣꯗꯦꯜ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯑꯦꯛꯇꯤꯕ ꯇꯧꯏ꯫ ꯑꯣꯄꯁꯅꯦꯜ ꯑꯣꯄꯁꯟ ꯑꯃꯥ ꯌꯥꯔꯦ object.

$ ( '#ꯑꯩꯒꯤ ꯃꯣꯗꯜ' ). ꯃꯣꯗꯜ ({
  ꯀꯤꯕꯣꯔꯗ : ꯑꯔꯥꯅꯕꯥ꯫ 
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

.ꯃꯣꯗꯜ('ꯇꯣꯒꯜ') ꯇꯧꯕꯥ ꯌꯥꯏ꯫

ꯃꯣꯗꯜ ꯑꯃꯥ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯇꯣꯒꯜ ꯇꯧꯏ꯫

$ ( '#ꯑꯩꯒꯤ ꯃꯣꯗꯜ' ). ꯃꯣꯗꯜ ( 'ꯇꯣꯒꯜ' ꯇꯧꯕꯥ )

.ꯃꯣꯗꯜ('ꯌꯦꯡꯎ') .

ꯃꯣꯗꯜ ꯑꯃꯥ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯍꯥꯡꯗꯣꯀꯏ꯫

$ ( '#ꯑꯩꯒꯤ ꯃꯣꯗꯜ' ). ꯃꯣꯗꯜ ( 'ꯌꯦꯡꯎ' ) .

.ꯃꯣꯗꯜ('ꯂꯨꯀꯄꯥ')

ꯃꯣꯗꯜ ꯑꯃꯥ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯂꯣꯠꯁꯤꯜꯂꯤ꯫

$ ( '#ꯑꯩꯒꯤ ꯃꯣꯗꯜ' ). ꯃꯣꯗꯜ ( 'ꯂꯨꯀꯄꯥ' ) .

ꯊꯧꯔꯃꯁꯤꯡ꯫

ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯃꯣꯗꯦꯜ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤꯅꯥ ꯃꯣꯗꯦꯜ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤꯗꯥ ꯍꯨꯛ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯊꯧꯗꯣꯛ ꯈꯔꯥ ꯑꯦꯛꯁꯄꯣꯖ ꯇꯧꯏ꯫

$ ( '#ꯑꯩꯒꯤ ꯃꯣꯗꯜ' ). on ( 'ꯂꯣꯠꯁꯤꯜꯂꯕꯥ' , ꯐꯉ꯭ꯀꯁꯟ () {   
  // ꯀꯔꯤꯒꯨꯝꯕꯥ ꯈꯔꯥ ꯇꯧꯕꯥ...
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

ꯈꯨꯗꯃꯁꯤꯡ꯫

ꯅꯦꯚꯕꯥꯔ, ꯇꯦꯕꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯄꯤꯂꯁꯤꯡ ꯌꯥꯑꯣꯅꯥ ꯏꯆꯝ ꯆꯝꯕꯥ ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯆꯥꯎꯔꯥꯛꯅꯥ ꯄꯣꯠ ꯑꯃꯗꯥ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯃꯦꯅꯨꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

ꯅꯕꯕꯔ ꯑꯃꯒꯤ ꯃꯅꯨꯡꯗꯥ꯫

ꯇꯦꯕꯁꯤꯡꯒꯤ ꯃꯅꯨꯡꯗꯥ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

data-toggle="dropdown"ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯑꯃꯥ ꯇꯣꯒꯜ ꯇꯧꯅꯕꯥ ꯂꯤꯉ꯭ꯛ ꯅꯠꯠꯔꯒꯥ ꯕꯇꯟ ꯑꯃꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

<div class = "ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ" > 
  <a class = "ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ-ꯇꯣꯒꯜ" data-toggle = "ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ" href = "#" > ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯇ꯭ꯔꯤꯒꯔ </a>   
  <ul ꯀ꯭ꯂꯥꯁ = "ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ-ꯃꯦꯅꯨ" ꯊꯧꯗꯥꯡ = "ꯃꯦꯅꯨ" aria- labelledby = "dLabel" >   
    ...
  </ul> ꯍꯥꯌꯅꯥ ꯃꯤꯡꯊꯣꯅꯕꯥ꯫
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

URLꯁꯤꯡ ꯑꯗꯨ ꯂꯦꯡꯗꯅꯥ ꯊꯝꯅꯕꯒꯤꯗꯃꯛ, data-targetꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨ href="#".

<div class = "ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ" > 
  <a class = "ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ-ꯇꯣꯒꯜ" id = "dLabel" ꯔꯣꯜ = "ꯕꯇꯟ" ꯗꯦꯇꯥ-ꯇꯣꯒꯜ = "ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ" ꯗꯦꯇꯥ-ꯇꯥꯔꯒꯦꯠ = "#" href = "/ꯄꯦꯖ.html" >      
    ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯇꯧꯕꯥ꯫
    <b ꯀ꯭ꯂꯥꯁ = "ꯀꯦꯔꯦꯠ" </b> 
  </a> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <ul ꯀ꯭ꯂꯥꯁ = "ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ-ꯃꯦꯅꯨ" ꯊꯧꯗꯥꯡ = "ꯃꯦꯅꯨ" aria- labelledby = "dLabel" >   
    ...
  </ul> ꯍꯥꯌꯅꯥ ꯃꯤꯡꯊꯣꯅꯕꯥ꯫
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯁꯤꯡ ꯀꯜ ꯇꯧꯕꯤꯌꯨ:

$ ( '.ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ-ꯇꯣꯒꯜ' ). ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ()

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯃꯠꯇ ꯅꯠꯇꯦ

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

$().ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ('ꯇꯣꯒꯜ')

ꯑꯄꯤꯕꯥ ꯅꯦꯚꯕꯥꯔ ꯅꯠꯠꯔꯒꯥ ꯇꯦꯕꯜ ꯅꯦꯚꯤꯒꯦꯁꯟ ꯑꯃꯒꯤꯗꯃꯛ ꯃꯦꯅꯨꯁꯤꯡ ꯇꯣꯒꯜ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯄ꯭ꯔꯣꯒ꯭ꯔꯥꯃꯦꯇꯤꯛ ꯑꯦꯄꯤ.ꯑꯥꯏ.

ꯅꯕꯕꯥꯔꯗꯥ ꯈꯨꯗꯝ꯫

ꯁ꯭ꯛꯔꯣꯂꯁ꯭ꯄꯥꯏ ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤ ꯁ꯭ꯛꯔꯣꯜ ꯄꯣꯖꯤꯁꯅꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯅꯦꯚ ꯇꯥꯔꯒꯦꯇꯁꯤꯡ ꯑꯣꯇꯣꯃꯦꯇꯦꯗ ꯑꯣꯏꯅꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯅꯕꯒꯤꯗꯃꯛꯇꯅꯤ꯫ ꯅꯦꯚꯕꯥꯔꯒꯤ ꯃꯈꯥꯗꯥ ꯂꯩꯕꯥ ꯃꯐꯝ ꯑꯗꯨ ꯁ꯭ꯛꯔꯣꯜ ꯇꯧ ꯑꯃꯁꯨꯡ ꯑꯦꯛꯇꯤꯕ ꯀ꯭ꯂꯥꯁ ꯍꯣꯡꯂꯀꯄꯥ ꯑꯗꯨ ꯌꯦꯡꯎ꯫ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯁꯕ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯁꯨ ꯍꯥꯏꯂꯥꯏꯠ ꯇꯧꯒꯅꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯅꯍꯥꯛꯀꯤ ꯇꯣꯄꯕꯥꯔ ꯅꯦꯚꯤꯒꯦꯁꯟꯗꯥ ꯁ꯭ꯛꯔꯣꯂꯁꯄꯤ ꯕꯤꯍꯦꯕꯤꯌꯔ ꯐꯖꯅꯥ ꯍꯥꯄꯆꯤꯟꯅꯕꯥ, data-spy="scroll"ꯅꯍꯥꯛꯅꯥ ꯁ꯭ꯄꯥꯏ ꯇꯧꯕꯥ ꯄꯥꯝꯂꯤꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ (ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯃꯍꯧꯁꯥꯅꯥ ꯃꯁꯤ ꯍꯀꯆꯥꯡ ꯑꯣꯏꯒꯅꯤ) ꯑꯃꯁꯨꯡ data-target=".navbar"ꯀꯔꯝꯕꯥ ꯅꯦꯚ ꯁꯤꯖꯤꯟꯅꯒꯗꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯈꯜꯂꯨ꯫ .navꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯁ꯭ꯛꯔꯣꯂꯁꯄꯤ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯄꯥꯝꯂꯒꯅꯤ꯫

<body data-spy = "ꯁ꯭ꯛꯔꯣꯜ" ꯗꯦꯇꯥ-ꯇꯥꯔꯒꯦꯠ = ".ꯅꯥꯚꯕꯥꯔ" > ... </body>  

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯁ꯭ꯛꯔꯣꯂꯁ꯭ꯄꯤꯗꯥ ꯀꯜ ꯇꯧꯕꯤꯌꯨ:

$ ( '#ꯅꯥꯚꯕꯥꯔ' )꯫ ꯁ꯭ꯛꯔꯣꯂꯁ꯭ꯄꯤ () ꯑꯁꯤꯅꯤ꯫

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

.scrollspy('ꯔꯤꯐ꯭ꯔꯦꯁ') ꯇꯧꯕꯥ ꯌꯥꯏ꯫

DOM ꯗꯒꯤ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯍꯥꯄꯆꯤꯅꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯂꯧꯊꯣꯀꯄꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯁ꯭ꯛꯔꯣꯂꯁ꯭ꯄꯤ ꯁꯤꯖꯤꯟꯅꯔꯀꯄꯥ ꯃꯇꯃꯗꯥ, ꯅꯍꯥꯛꯅꯥ ꯔꯤꯐ꯭ꯔꯦꯁ ꯃꯦꯊꯗ ꯑꯗꯨ ꯑꯁꯨꯝꯅꯥ ꯀꯧꯕꯥ ꯃꯊꯧ ꯇꯥꯏ:

$ ( '[ꯗꯦꯇꯥ-ꯁ꯭ꯄꯥꯏ="ꯁ꯭ꯛꯔꯣꯜ"]' ). ꯈꯨꯗꯤꯡꯃꯛ ( ꯐꯉ꯭ꯀꯁꯟ () { .  
  var $spy = $ ( ꯃꯁꯤ )꯫ scrollspy ( 'ꯔꯤꯐ꯭ꯔꯦꯁ ꯇꯧꯕꯥ' ) .
});

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-offset="".

ꯊꯧꯔꯃꯁꯤꯡ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯕꯥ ꯇꯦꯕꯁꯤꯡ꯫

ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯃꯦꯅꯨꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯁꯨ, ꯂꯣꯀꯦꯜ ꯀꯟꯇꯦꯟꯇꯀꯤ ꯄꯦꯅꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯇꯧꯕꯗꯥ ꯊꯨꯅꯥ, ꯗꯥꯏꯅꯥꯃꯤꯛ ꯇꯦꯕ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯇꯦꯕꯜ ꯇꯧꯕꯥ ꯌꯥꯕꯥ ꯇꯦꯕꯁꯤꯡ ꯏꯅꯦꯕꯜ ꯇꯧꯕꯥ (ꯇꯦꯕ ꯈꯨꯗꯤꯡꯃꯛ ꯑꯃꯃꯃꯗꯥ ꯑꯦꯛꯇꯤꯕ ꯑꯣꯏꯕꯥ ꯃꯊꯧ ꯇꯥꯏ):

$ ( '#ꯃꯥꯏꯇꯦꯕ ꯑꯃꯥ' ). ꯀ꯭ꯂꯤꯛ ꯇꯧꯔꯣ ( ꯐꯉ꯭ꯀꯁꯟ ( ꯏ ) { .  
  ꯏ . ꯄ꯭ꯔꯤꯚꯦꯟꯇꯗꯤꯐꯣꯜꯇ ();
  $ ( ꯃꯁꯤ ) . tab ( 'ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯎꯠꯄꯥ' );
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

ꯅꯍꯥꯛꯅꯥ ꯃꯤꯑꯣꯏ ꯑꯃꯃꯃꯒꯤ ꯇꯦꯕꯁꯤꯡ ꯑꯁꯤ ꯃꯑꯣꯡ ꯀꯌꯥꯗꯥ ꯑꯦꯛꯇꯤꯚ ꯇꯧꯕꯥ ꯌꯥꯏ:

$ ( '#ꯃꯥꯏꯇꯦꯕ ꯑꯃꯥ[href="#ꯄ꯭ꯔꯣꯐꯥꯏꯜ"]' ). tab ( 'ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯎꯠꯄꯥ' ); // ꯃꯃꯤꯡꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯇꯦꯕ ꯑꯃꯥ ꯈꯜꯂꯨ꯫ 
$ ( '#ꯃꯥꯏꯇꯦꯕ ꯑꯃꯥ:ꯑꯍꯥꯅꯕꯥ' ). tab ( 'ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯎꯠꯄꯥ' ); // ꯑꯍꯥꯅꯕꯥ ꯇꯦꯕ ꯑꯗꯨ ꯈꯜꯂꯨ꯫ 
$ ( '#ꯃꯥꯏꯇꯦꯕ ꯑꯃꯥ:ꯑꯔꯣꯏꯕꯥ' ). tab ( 'ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯎꯠꯄꯥ' ); // ꯑꯔꯣꯏꯕꯥ ꯇꯦꯕ ꯑꯗꯨ ꯈꯜꯂꯨ꯫ 
$ ( '#ꯃꯥꯏꯇꯦꯕ ꯂꯤ:ꯏꯛꯌꯨ(꯲) ꯑꯦ' ). tab ( 'ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯎꯠꯄꯥ' ); // ꯑꯍꯨꯃꯁꯨꯕꯥ ꯇꯦꯕ ꯈꯅꯕꯤꯌꯨ (꯰-ꯏꯟꯗꯦꯛꯁ ꯇꯧꯔꯕꯥ) 

ꯃꯥꯔꯀꯑꯥꯞ ꯇꯧꯕꯥ꯫

data-toggle="tab"ꯅꯍꯥꯛꯅꯥ ꯁꯨꯞꯅꯒꯤ ꯁ꯭ꯄꯦꯁꯤꯐꯥꯏ ꯇꯧꯗꯨꯅꯥ ꯅꯠꯠꯔꯒꯥ data-toggle="pill"ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯗꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯃꯠꯇꯥ ꯏꯗꯅꯥ ꯇꯦꯕ ꯅꯠꯠꯔꯒꯥ ꯄꯤꯜ ꯅꯦꯚꯤꯒꯦꯁꯟ ꯑꯃꯥ ꯑꯦꯛꯇꯤꯚ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ navꯇꯦꯕ ꯑꯗꯨꯗꯥ ꯑꯃꯁꯨꯡ nav-tabsꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯍꯥꯄꯆꯤꯅꯕꯅꯥ ulꯕꯨꯠꯁ꯭ꯠꯔꯞ ꯇꯦꯕ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯑꯗꯨ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯒꯅꯤ꯫

<ul class = "ꯅꯥꯚ ꯅꯦꯚ-ꯇꯦꯕꯁꯤꯡ" > 
  <li><a href = "#ꯍꯣꯝ" ꯗꯦꯇꯥ-ꯇꯣꯒꯜ = "ꯇꯦꯕ" > ꯍꯣꯝ </a></li>  
  <li><a href = "#ꯄ꯭ꯔꯣꯐꯥꯏꯜ" ꯗꯦꯇꯥ-ꯇꯣꯒꯜ = "ꯇꯦꯕ" > ꯄ꯭ꯔꯣꯐꯥꯏꯜ </a></li>  
  <li><a href = "#messages" data-toggle = "ꯇꯦꯕ" > ꯄꯥꯎꯖꯦꯂꯁꯤꯡ </a></li>  
  <li><a href = "#ꯁꯦꯇꯤꯡꯁꯤꯡ" data-toggle = "ꯇꯦꯕ" > ꯁꯦꯇꯤꯡꯁꯤꯡ </a></li>  
</ul> ꯍꯥꯌꯅꯥ ꯃꯤꯡꯊꯣꯅꯕꯥ꯫

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

$().ꯇꯦꯕ ꯇꯧꯕꯥ꯫

ꯇꯦꯕ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯑꯃꯁꯨꯡ ꯀꯟꯇꯦꯟꯇ ꯀꯟꯇꯦꯅꯔ ꯑꯃꯥ ꯑꯦꯛꯇꯤꯕ ꯇꯧꯏ꯫ ꯇꯦꯕ ꯑꯗꯨꯗꯥ DOMꯗꯥ ꯀꯟꯇꯦꯅꯔ ꯅꯣꯗ ꯑꯃꯥ ꯇꯥꯔꯒꯦꯠ ꯇꯧꯕꯥ ꯑꯃꯥ data-targetꯅꯠꯠꯔꯒꯥ ꯑꯃꯥ ꯂꯩꯒꯗꯕꯅꯤ꯫href

<ul class = "ꯅꯥꯚ ꯅꯦꯚ-ꯇꯦꯕꯁꯤꯡ" id = "ꯑꯩꯒꯤ ꯇꯦꯕꯜ" >  
  <li class = "ꯑꯦꯛꯇꯤꯕ" ><a href = "#ꯍꯣꯝ" > ꯍꯣꯝ </a></li>  
  <li><a href = "#ꯄ꯭ꯔꯣꯐꯥꯏꯜ" > ꯄ꯭ꯔꯣꯐꯥꯏꯜ </a></li> 
  <li><a href = "#messages" > ꯄꯥꯎꯖꯦꯂꯁꯤꯡ </a></li> 
  <li><a href = "#ꯁꯦꯇꯤꯡꯁꯤꯡ" > ꯁꯦꯇꯤꯡꯁꯤꯡ </a></li> 
</ul> ꯍꯥꯌꯅꯥ ꯃꯤꯡꯊꯣꯅꯕꯥ꯫
 
<div class = "ꯇꯦꯕ-ꯀꯟꯇꯦꯟꯇ" > 
  <div class = "ꯇꯦꯕ-ꯄꯦꯟ ꯑꯦꯛꯇꯤꯕ" id = "ꯍꯣꯝ" > ... </div>  
  <div class = "ꯇꯦꯕ-ꯄꯦꯟ" id = "ꯄ꯭ꯔꯣꯐꯥꯏꯜ" > ... </div>  
  <div class = "ꯇꯦꯕ-ꯄꯦꯟ" id = "ꯃꯦꯁꯦꯖꯁꯤꯡ" > ... </div>  
  <div class = "ꯇꯦꯕ-ꯄꯦꯟ" id = "ꯁꯦꯇꯤꯡꯁꯤꯡ" > ... </div>  
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
 
<ꯁ꯭ꯛꯔꯤꯞꯇ> ꯍꯥꯌꯕꯁꯤꯅꯤ꯫
  $ ( ꯐꯉ꯭ꯀꯁꯟ () { .  
    $ ( '#ꯃꯥꯏꯇꯦꯕ ꯑꯃꯥ:ꯑꯔꯣꯏꯕꯥ' ). tab ( 'ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯎꯠꯄꯥ' );
  }) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.
</script>ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯈꯤ꯫

ꯊꯧꯔꯃꯁꯤꯡ꯫

$ ( 'a[ꯗꯦꯇꯥ-ꯇꯣꯒꯜ="ꯇꯦꯕ"]' ). on ( 'ꯌꯦꯡꯁꯤꯜꯂꯦ' , ꯐꯉ꯭ꯀꯁꯟ ( ꯏ ) {   
  ꯏ . ꯇꯥꯔꯒꯦꯠ // ꯑꯦꯛꯇꯤꯕ ꯑꯣꯏꯕꯥ ꯇꯦꯕ꯫
  ꯏ . relatedTarget // ꯃꯃꯥꯡꯒꯤ ꯇꯦꯕ꯫
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

ꯈꯨꯗꯃꯁꯤꯡ꯫

ꯖꯦꯁꯟ ꯐ꯭ꯔꯦꯃꯅꯥ ꯏꯕꯥ ꯑꯐꯕꯥ jQuery.tipsy ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤꯅꯥ ꯏꯊꯤꯜ ꯄꯤꯕꯥ; ꯇꯨꯂꯇꯤꯄꯁꯤꯡ ꯑꯁꯤ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯕꯥ ꯚꯔꯖꯟ ꯑꯃꯅꯤ, ꯃꯁꯤꯅꯥ ꯏꯃꯦꯖꯁꯤꯡꯗꯥ ꯊꯥꯖꯕꯥ ꯊꯃꯗꯦ, ꯑꯦꯅꯤꯃꯦꯁꯅꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ CSS3 ꯁꯤꯖꯤꯟꯅꯩ, ꯑꯃꯁꯨꯡ ꯂꯣꯀꯦꯜ ꯇꯥꯏꯇꯜ ꯁ꯭ꯇꯣꯔꯦꯖꯒꯤꯗꯃꯛꯇꯥ ꯗꯦꯇꯥ-ꯑꯦꯠꯔꯤꯕ꯭ꯌꯨꯠꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯩ꯫

ꯄꯔꯐꯣꯃꯦꯟꯁꯀꯤ ꯃꯔꯃꯁꯤꯡꯅꯥ, ꯇꯨꯂꯇꯤꯞ ꯑꯃꯁꯨꯡ ꯄꯣꯄꯣꯚꯔ ꯗꯦꯇꯥ-ꯑꯦꯄꯤꯁ ꯑꯁꯤ ꯑꯣꯄꯁꯟ ꯇꯧꯏ, ꯃꯁꯤꯅꯥ ꯇꯥꯀꯄꯗꯤ ꯅꯍꯥꯛꯅꯥ ꯃꯈꯣꯌ ꯃꯁꯥꯅꯥ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯒꯗꯕꯅꯤ .

ꯇꯨꯂꯇꯤꯄꯁꯤꯡ ꯌꯦꯡꯅꯕꯒꯤꯗꯃꯛ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯂꯤꯉ꯭ꯀꯁꯤꯡ ꯑꯁꯤꯒꯤ ꯃꯊꯛꯇꯥ ꯍꯣꯚꯔ ꯇꯧꯕꯤꯌꯨ:

ꯃꯥꯏꯀꯩ ꯃꯔꯤ꯫

ꯏꯅꯄꯨꯠ ꯒ꯭ꯔꯨꯄꯁꯤꯡꯗꯥ ꯇꯨꯂꯇꯤꯄꯁꯤꯡ꯫

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯏꯅꯄꯨꯠ ꯒ꯭ꯔꯨꯄꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯇꯨꯂꯇꯤꯄꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯄꯣꯄꯣꯚꯔꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯗꯥ, ꯅꯍꯥꯛꯅꯥ containerꯑꯄꯥꯝꯕꯥ ꯁꯥꯏꯗ ꯏꯐꯦꯛꯇꯁꯤꯡ ꯊꯤꯡꯅꯕꯥ (ꯃꯈꯥꯗꯥ ꯗꯣꯛꯌꯨꯃꯦꯟꯇ ꯇꯧꯔꯤꯕꯥ) ꯑꯣꯄꯁꯟ ꯑꯗꯨ ꯁꯦꯠ ꯇꯧꯒꯗꯕꯅꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯇꯨꯂꯇꯤꯞ ꯑꯁꯤ ꯇ꯭ꯔꯤꯒꯔ ꯇꯧꯕꯤꯌꯨ:

$ ( '#ꯈꯨꯗꯝ' ). ꯇꯨꯂꯇꯤꯞ ( ꯑꯣꯄꯁꯅꯁꯤꯡ ) .

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-animation="".

ꯃꯥꯔꯀꯑꯥꯞ ꯇꯧꯕꯥ꯫

<a href = "#" data-toggle = "ꯇꯨꯂꯇꯤꯞ" title = "ꯑꯍꯥꯅꯕꯥ ꯇꯨꯂꯇꯤꯞ" > ꯑꯩꯒꯤ ꯃꯊꯛꯇꯥ ꯍꯣꯚꯔ ꯇꯧꯕꯤꯌꯨ </a>   

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

$().ꯇꯨꯂꯇꯤꯞ(ꯑꯣꯄꯁꯅꯁꯤꯡ)

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯀꯂꯦꯛꯁꯟ ꯑꯃꯗꯥ ꯇꯨꯂꯇꯤꯞ ꯍꯦꯟꯗꯂꯔ ꯑꯃꯥ ꯑꯦꯇꯦꯆ ꯇꯧꯏ꯫

.ꯇꯨꯂꯇꯤꯞ('ꯌꯦꯡꯎ')

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯇꯨꯂꯇꯤꯞ ꯑꯃꯥ ꯐꯣꯡꯗꯣꯀꯏ꯫

$ ( '#ꯏꯂꯤꯃꯦꯟꯇ' )꯫ ꯇꯨꯂꯇꯤꯞ ( 'ꯌꯦꯡꯎ' ) .

.ꯇꯨꯂꯇꯤꯞ('ꯂꯨꯠꯄꯥ')

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯇꯨꯂꯇꯤꯞ ꯑꯃꯥ ꯂꯣꯠꯁꯤꯜꯂꯤ꯫

$ ( '#ꯏꯂꯤꯃꯦꯟꯇ' )꯫ ꯇꯨꯂꯇꯤꯞ ( 'ꯂꯨꯠꯄꯥ' ) .

.ꯇꯨꯂꯇꯤꯞ('ꯇꯣꯒꯜ') ꯇꯧꯕꯥ ꯌꯥꯏ꯫

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯇꯨꯂꯇꯤꯞ ꯇꯣꯒꯜ ꯇꯧꯏ꯫

$ ( '#ꯏꯂꯤꯃꯦꯟꯇ' )꯫ ꯇꯨꯂꯇꯤꯞ ( 'ꯇꯣꯒꯜ' ꯇꯧꯕꯥ ) .

.tooltip('ꯃꯥꯡꯗꯣꯀꯄꯥ')

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯇꯨꯂꯇꯤꯞ ꯑꯃꯥ ꯂꯣꯠꯁꯤꯜꯂꯤ ꯑꯃꯁꯨꯡ ꯃꯥꯡꯍꯜꯂꯤ꯫

$ ( '#ꯏꯂꯤꯃꯦꯟꯇ' )꯫ ꯇꯨꯂꯇꯤꯞ ( 'ꯃꯥꯡꯗꯣꯀꯄꯥ' ) .

ꯈꯨꯗꯃꯁꯤꯡ꯫

ꯁꯦꯀꯦꯟꯗꯔꯤ ꯏꯅꯐꯣꯔꯃꯦꯁꯟ ꯍꯥꯎꯖꯤꯡ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯏꯂꯤꯃꯦꯟꯇ ꯑꯃꯍꯦꯛꯇꯗꯥ ꯑꯥꯏꯄꯦꯗꯇꯥ ꯂꯩꯕꯒꯨꯝꯅꯥ ꯀꯟꯇꯦꯟꯇꯀꯤ ꯑꯄꯤꯀꯄꯥ ꯑꯣꯚꯔꯂꯦꯏꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯄꯣꯄꯣꯚꯔ ꯑꯗꯨ ꯇ꯭ꯔꯤꯒꯔ ꯇꯧꯅꯕꯥ ꯕꯇꯟ ꯑꯗꯨꯒꯤ ꯃꯊꯛꯇꯥ ꯍꯣꯚꯔ ꯇꯧ꯫ ꯇꯨꯂꯇꯤꯞ ꯌꯥꯑꯣꯍꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯏ꯫

ꯁ꯭ꯇꯦꯇꯤꯛ ꯄꯣꯄꯑꯣꯚꯔ꯫

ꯑꯣꯄꯁꯟ ꯃꯔꯤ ꯂꯩ: ꯃꯊꯛ, ꯑꯔꯣꯏꯕꯥ, ꯃꯈꯥꯗꯥ, ꯑꯃꯁꯨꯡ ꯂꯦꯞꯇꯅꯥ ꯑꯦꯂꯥꯏꯟ ꯇꯧꯕꯥ꯫

dataꯄꯣꯄꯣꯚꯔꯁꯤꯡ ꯑꯣꯏꯅꯥ ꯎꯠꯂꯤꯕꯥ ꯃꯥꯔꯀꯑꯥꯞ ꯑꯃꯠꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯃꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯂꯩꯕꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯃꯁꯨꯡ ꯀꯟꯇꯦꯟꯇꯇꯒꯤ ꯖꯦꯅꯦꯔꯦꯠ ꯇꯧꯗꯦ꯫

ꯂꯥꯏꯚ ꯗꯦꯃꯣ꯫

ꯃꯥꯏꯀꯩ ꯃꯔꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯣꯄꯑꯣꯚꯔꯁꯤꯡ ꯏꯅꯦꯕꯜ ꯇꯧꯕꯥ:

$ ( '#ꯈꯨꯗꯝ' ). ꯄꯣꯄꯑꯣꯚꯔ ( ꯑꯣꯄꯁꯅꯁꯤꯡ ) .

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-animation="".

ꯃꯥꯔꯀꯑꯥꯞ ꯇꯧꯕꯥ꯫

ꯄꯔꯐꯣꯃꯦꯟꯁꯀꯤ ꯃꯔꯃꯁꯤꯡꯅꯥ, ꯇꯨꯂꯇꯤꯞ ꯑꯃꯁꯨꯡ ꯄꯣꯄꯣꯚꯔ ꯗꯦꯇꯥ-ꯑꯦꯄꯤꯁ ꯑꯁꯤ ꯑꯣꯄꯁꯟ ꯇꯧꯏ, ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯃꯈꯣꯌꯕꯨ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯄꯥꯝꯂꯕꯗꯤ ꯁꯦꯂꯦꯛꯇꯔ ꯑꯣꯄꯁꯟ ꯑꯃꯥ ꯈꯛꯇꯃꯛ ꯇꯥꯀꯄꯤꯌꯨ꯫

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

$().popover(ꯑꯣꯄꯁꯅꯁꯤꯡ) ꯑꯁꯤ ꯌꯥꯑꯣꯔꯤ꯫

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯀꯂꯦꯛꯁꯟ ꯑꯃꯒꯤꯗꯃꯛ ꯄꯣꯄꯣꯚꯔꯁꯤꯡ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯏ꯫

.ꯄꯣꯄꯣꯚꯔ('ꯌꯦꯡꯎ') .

ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯄꯣꯄꯑꯣꯚꯔ ꯑꯃꯥ ꯐꯣꯡꯗꯣꯀꯏ꯫

$ ( '#ꯏꯂꯤꯃꯦꯟꯇ' )꯫ ꯄꯣꯄꯣꯚꯥꯔ ( 'ꯁꯥꯟꯅꯧ' ) .

.ꯄꯣꯄꯣꯚꯔ('ꯂꯨꯀꯄꯥ')

ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯄꯣꯄꯑꯣꯚꯔ ꯑꯃꯥ ꯂꯣꯠꯁꯤꯜꯂꯤ꯫

$ ( '#ꯏꯂꯤꯃꯦꯟꯇ' )꯫ ꯄꯣꯄꯣꯚꯥꯔ ( 'ꯂꯨꯀꯄꯥ' ) .

.popover('ꯇꯣꯒꯜ') ꯇꯧꯕꯥ ꯌꯥꯏ꯫

ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯄꯣꯄꯑꯣꯚꯔ ꯑꯃꯥ ꯇꯣꯒꯜ ꯇꯧꯏ꯫

$ ( '#ꯏꯂꯤꯃꯦꯟꯇ' )꯫ popover ( 'ꯇꯣꯒꯜ' ꯇꯧꯕꯥ ) .

.popover('ꯃꯥꯡꯗꯣꯀꯄꯥ')

ꯏꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯄꯣꯄꯣꯚꯔ ꯑꯃꯥ ꯂꯣꯠꯁꯤꯜꯂꯤ ꯑꯃꯁꯨꯡ ꯃꯥꯡꯍꯜꯂꯤ꯫

$ ( '#ꯏꯂꯤꯃꯦꯟꯇ' )꯫ ꯄꯣꯄꯣꯚꯥꯔ ( ' ꯃꯥꯡꯗꯣꯀꯄꯥ ' ) .

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯑꯦꯂꯔꯇꯁꯤꯡ꯫

ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯑꯦꯂꯔꯠ ꯃꯦꯁꯦꯖ ꯄꯨꯝꯅꯃꯛꯇꯥ ꯗꯤꯁꯃꯤꯁ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯑꯦꯂꯔꯠ ꯑꯃꯥ ꯗꯤꯁꯃꯤꯁ ꯇꯧꯕꯥ ꯏꯅꯦꯕꯜ ꯇꯧꯕꯥ:

$ ( ".ꯑꯦꯂꯔꯠ" ) ꯑꯁꯤꯅꯤ꯫ ꯑꯦꯂꯔꯠ ꯇꯧꯕꯥ ()

ꯃꯥꯔꯀꯑꯥꯞ ꯇꯧꯕꯥ꯫

data-dismiss="alert"ꯑꯦꯂꯔꯠ ꯀ꯭ꯂꯣꯖ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯑꯃꯥ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯄꯤꯅꯕꯥ ꯅꯍꯥꯛꯀꯤ ꯀ꯭ꯂꯣꯖ ꯕꯇꯟ ꯑꯗꯨꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

<a class = "ꯀ꯭ꯂꯣꯖ" data-dismiss = "ꯑꯦꯂꯔꯠ" href = "#" > &ꯇꯥꯏꯃꯁ; </a> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫   

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

$().ꯑꯦꯂꯔꯠ() ꯑꯁꯤꯅꯤ꯫

ꯑꯦꯂꯔꯠ ꯄꯨꯝꯅꯃꯛ ꯀ꯭ꯂꯣꯖ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯔꯦꯞ ꯇꯧꯏ꯫ ꯂꯣꯗ ꯇꯧꯕꯥ ꯃꯇꯃꯗꯥ ꯅꯍꯥꯛꯀꯤ ꯑꯦꯂꯔꯇꯁꯤꯡ ꯑꯗꯨ ꯑꯦꯅꯤꯃꯦꯠ ꯇꯧꯅꯕꯥ, ꯃꯈꯣꯌꯗꯥ ꯍꯥꯟꯅꯅꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯔꯕꯥ .fadeꯑꯃꯁꯨꯡ ꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯁꯣꯌꯗꯅꯥ ꯂꯩꯍꯅꯒꯗꯕꯅꯤ꯫.in

.alert('ꯀ꯭ꯂꯣꯖ') ꯇꯧꯕꯥ ꯌꯥꯏ꯫

ꯑꯦꯂꯔꯠ ꯑꯃꯥ ꯂꯣꯗ ꯇꯧꯏ꯫

$ ( ".ꯑꯦꯂꯔꯠ" ) ꯑꯁꯤꯅꯤ꯫ alert ( 'ꯀ꯭ꯂꯣꯖ' ꯇꯧꯕꯥ ) .

ꯊꯧꯔꯃꯁꯤꯡ꯫

ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯑꯦꯂꯔꯠ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤꯅꯥ ꯑꯦꯂꯔꯠ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤꯗꯥ ꯍꯨꯛ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯊꯧꯗꯣꯛ ꯈꯔꯥ ꯑꯦꯛꯁꯄꯣꯖ ꯇꯧꯏ꯫

$ ( '#ꯑꯩꯒꯤ-ꯑꯦꯂꯔꯠ' ). bind ( 'ꯀ꯭ꯂꯣꯖ ꯇꯧꯕꯥ' , ꯐꯉ꯭ꯀꯁꯟ () {   
  // ꯀꯔꯤꯒꯨꯝꯕꯥ ꯈꯔꯥ ꯇꯧꯕꯥ...
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯁꯤꯖꯤꯟꯅꯔꯤ꯫

ꯕꯇꯅꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯍꯦꯟꯅꯥ ꯇꯧ꯫ ꯀꯟꯠꯔꯣꯜ ꯕꯇꯟ ꯁ꯭ꯇꯦꯠ ꯇꯧꯏ ꯅꯠꯠꯔꯒꯥ ꯇꯨꯂꯕꯥꯔꯒꯨꯝꯕꯥ ꯑꯍꯦꯅꯕꯥ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯒꯤꯗꯃꯛ ꯕꯇꯅꯁꯤꯡꯒꯤ ꯀꯥꯡꯂꯨꯄꯁꯤꯡ ꯁꯦꯝꯃꯤ꯫

ꯔꯥꯖ꯭ꯌꯒꯤ ꯑꯣꯏꯕꯥ꯫

data-loading-text="Loading..."ꯕꯇꯟ ꯑꯃꯗꯥ ꯂꯣꯗꯤꯡ ꯁ꯭ꯇꯦꯠ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

<button type = "button" class = "btn btn-primary" data-loading-text = "ꯂꯣꯗ ꯇꯧꯔꯤ..." > ꯂꯣꯗ ꯇꯧꯔꯤꯕꯥ ꯐꯤꯚꯝ </button>   

ꯁꯤꯉ꯭ꯒꯜ ꯇꯣꯒꯜ ꯇꯧꯕꯥ꯫

data-toggle="button"ꯕꯇꯟ ꯑꯃꯈꯛꯇꯗꯥ ꯇꯣꯒꯂꯤꯡ ꯑꯦꯛꯇꯤꯕ ꯇꯧꯅꯕꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

<ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn btn-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ" data-toggle = "ꯕꯇꯟ" > ꯁꯤꯉ꯭ꯒꯜ ꯇꯣꯒꯜ </button>   

ꯆꯦꯀꯕꯣꯛꯁ ꯑꯃꯥ꯫

data-toggle="buttons-checkbox"btn-ꯒ꯭ꯔꯨꯄꯇꯥ ꯆꯦꯀꯕꯣꯛꯁ ꯁ꯭ꯇꯥꯏꯜ ꯇꯣꯒꯂꯤꯡꯒꯤꯗꯃꯛ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

<div ꯀ꯭ꯂꯥꯁ = "btn-ꯒ꯭ꯔꯨꯞ" ꯗꯦꯇꯥ-ꯇꯣꯒꯜ = "ꯕꯇꯅꯁꯤꯡ-ꯆꯦꯀꯕꯣꯛꯁ" >  
  <ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn btn-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ" > ꯂꯦꯃꯍꯧꯔꯤꯕꯥ </ꯕꯇꯟ>  
  <ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn btn-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ" > ꯃꯔꯛꯇꯥ ꯂꯩꯕꯥ </ꯕꯇꯟ>  
  <ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn btn-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ" > ꯑꯔꯣꯏꯕꯥ </ꯕꯇꯟ>  
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

ꯔꯦꯗꯤꯑꯣꯗꯥ ꯂꯩꯕꯥ꯫

data-toggle="buttons-radio"btn-ꯒ꯭ꯔꯨꯄꯇꯥ ꯔꯦꯗꯤꯑꯣ ꯁ꯭ꯇꯥꯏꯜ ꯇꯣꯒꯂꯤꯡꯒꯤꯗꯃꯛ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

<div ꯀ꯭ꯂꯥꯁ = "btn-ꯒ꯭ꯔꯨꯞ" ꯗꯦꯇꯥ-ꯇꯣꯒꯜ = "ꯕꯇꯅꯁꯤꯡ-ꯔꯦꯗꯤꯑꯣ" >  
  <ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn btn-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ" > ꯂꯦꯃꯍꯧꯔꯤꯕꯥ </ꯕꯇꯟ>  
  <ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn btn-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ" > ꯃꯔꯛꯇꯥ ꯂꯩꯕꯥ </ꯕꯇꯟ>  
  <ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn btn-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ" > ꯑꯔꯣꯏꯕꯥ </ꯕꯇꯟ>  
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯕꯇꯅꯁꯤꯡ ꯏꯅꯦꯕꯜ ꯇꯧꯕꯥ:

$ ( '.ꯅꯦꯚ-ꯇꯦꯕꯁꯤꯡ' ). ꯕꯣꯇꯥꯝ ꯑꯃꯥ () .

ꯃꯥꯔꯀꯑꯥꯞ ꯇꯧꯕꯥ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯑꯁꯤ ꯕꯇꯟ ꯄ꯭ꯂꯒꯏꯅꯒꯤ ꯃꯔꯨꯑꯣꯏꯕꯥ ꯃꯆꯥꯛ ꯑꯃꯅꯤ꯫ ꯇꯣꯉꯥꯟ-ꯇꯣꯉꯥꯅꯕꯥ ꯃꯥꯔꯀꯑꯥꯞ ꯃꯈꯂꯁꯤꯡꯒꯤꯗꯃꯛ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯈꯨꯗꯝ ꯀꯣꯗ ꯑꯁꯤ ꯌꯦꯡꯕꯤꯌꯨ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯃꯠꯇ ꯅꯠꯇꯦ

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

$().ꯕꯇꯟ('ꯇꯣꯒꯜ') ꯇꯧꯕꯥ ꯌꯥꯏ꯫

ꯄꯨꯁ ꯁ꯭ꯇꯦꯠ ꯇꯣꯒꯜ ꯇꯧꯏ꯫ ꯕꯇꯟ ꯑꯗꯨꯗꯥ ꯃꯁꯤ ꯑꯦꯛꯇꯤꯕ ꯑꯣꯏꯔꯦ ꯍꯥꯌꯕꯒꯤ ꯃꯑꯣꯡ ꯑꯗꯨ ꯄꯤꯔꯤ꯫

<ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn" ꯗꯦꯇꯥ-ꯇꯣꯒꯜ = "ꯕꯇꯟ" > ... </ꯕꯇꯟ>    

$().ꯕꯇꯟ('ꯂꯣꯗ ꯇꯧꯕꯥ')

ꯕꯇꯟ ꯁ꯭ꯇꯦꯠ ꯑꯗꯨ ꯂꯣꯗ ꯇꯧꯕꯗꯥ ꯁꯦꯠ ꯇꯧꯏ - ꯕꯇꯟ ꯑꯗꯨ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯏ ꯑꯃꯁꯨꯡ ꯇꯦꯛꯁꯠ ꯑꯗꯨ ꯂꯣꯗ ꯇꯧꯔꯤꯕꯥ ꯇꯦꯛꯁꯇꯇꯥ ꯁ꯭ꯕ꯭ꯌꯥꯞ ꯇꯧꯏ꯫ ꯂꯣꯗ ꯇꯧꯔꯤꯕꯥ ꯇꯦꯛꯁꯠ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯕꯇꯟ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯗꯤꯐꯥꯏꯟ ꯇꯧꯒꯗꯕꯅꯤ data-loading-text.

<button type = "ꯕꯇꯟ" class = "btn" data-loading-text = "ꯁ꯭ꯇꯣꯐ ꯂꯣꯗ ꯇꯧꯔꯤ..." > ... </ꯕꯇꯟ>    

$().ꯕꯇꯟ('ꯔꯤꯁꯦꯠ') ꯇꯧꯕꯥ ꯌꯥꯏ꯫

ꯕꯇꯟ ꯁ꯭ꯇꯦꯠ ꯔꯤꯁꯦꯠ ꯇꯧꯏ - ꯇꯦꯛꯁꯠ ꯑꯗꯨ ꯑꯣꯔꯤꯖꯤꯅꯦꯜ ꯇꯦꯛꯁꯇꯇꯥ ꯁꯣꯞ ꯇꯧꯏ꯫

$().ꯕꯇꯟ(ꯁ꯭ꯠꯔꯤꯡ) ꯑꯁꯤꯅꯤ꯫

ꯕꯇꯟ ꯁ꯭ꯇꯦꯠ ꯔꯤꯁꯦꯠ ꯇꯧꯏ - ꯇꯦꯛꯁꯠ ꯑꯗꯨ ꯗꯦꯇꯥ ꯗꯤꯐꯥꯏꯟ ꯇꯧꯔꯕꯥ ꯇꯦꯛꯁꯠ ꯁ꯭ꯇꯦꯠ ꯑꯃꯍꯦꯛꯇꯗꯥ ꯁ꯭ꯕ꯭ꯌꯥꯞ ꯇꯧꯏ꯫

<ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn" ꯗꯦꯇꯥ-ꯀꯝꯞꯂꯤꯠ-ꯇꯦꯛꯁ = "ꯂꯣꯏꯔꯦ!" > ... </ꯕꯇꯟ>ꯗꯥ ꯊꯝꯃꯨ꯫    
<ꯁ꯭ꯛꯔꯤꯞꯇ> ꯍꯥꯌꯕꯁꯤꯅꯤ꯫
  $ ( '.ꯕꯤ.ꯇꯤ.ꯑꯦꯟ.' )꯫ ꯕꯇꯟ ( 'ꯃꯄꯨꯡ ꯐꯥꯕꯥ' ) .
</script>ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯈꯤ꯫

ꯃꯔꯝꯗꯤ

ꯑꯦꯀꯣꯔꯗꯟ ꯑꯃꯁꯨꯡ ꯅꯦꯚꯤꯒꯦꯁꯅꯒꯨꯝꯕꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯒꯤꯗꯃꯛ ꯕꯦꯖ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯐ꯭ꯂꯦꯛꯁꯤꯕꯜ ꯁꯄꯣꯔꯠ ꯐꯪꯕꯤꯌꯨ꯫

* ꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯁꯤꯡꯒꯤ ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤ ꯌꯥꯑꯣꯍꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯏ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯑꯦꯀꯣꯔꯗꯟ꯫

ꯀꯣꯂꯥꯞꯁ ꯄ꯭ꯂꯒꯏꯟ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯏꯆꯝ ꯆꯝꯕꯥ ꯑꯦꯀꯣꯔꯗꯟ ꯁ꯭ꯇꯥꯏꯜ ꯋꯤꯖꯇꯦꯝ ꯑꯃꯥ ꯁꯦꯃꯈꯤ:

<div class = "ꯑꯦꯀꯣꯔꯗꯟ" id = "ꯑꯦꯀꯣꯔꯗꯟ2" >  
  <div class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯒ꯭ꯔꯨꯞ" > 
    <div class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯍꯦꯗꯤꯡ" > 
      <a class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯇꯣꯒꯜ" data-toggle = "ꯀꯣꯂꯥꯞꯁ" ꯗꯦꯇꯥ-ꯄꯦꯔꯦꯟꯇ = "#ꯑꯦꯀꯣꯔꯗꯟ2" href = "#ꯀꯣꯂꯥꯞꯁꯋꯥꯟ" >    
        ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯒ꯭ꯔꯨꯞ ꯑꯥꯏꯇꯦꯝ #1
      </a> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
    </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
    <div id = "collapseOne" class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯕꯣꯗꯤ ꯀꯣꯂꯥꯞꯁ ꯏꯟ" >  
      <div class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯏꯅꯥꯔ" > 
        ꯑꯅꯤꯝ ꯄꯥꯔꯤꯑꯦꯇꯨꯔ ꯀ꯭ꯂꯤꯆ...
      </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
    </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <div class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯒ꯭ꯔꯨꯞ" > 
    <div class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯍꯦꯗꯤꯡ" > 
      <a class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯇꯣꯒꯜ" data-toggle = "ꯀꯣꯂꯥꯞꯁ" ꯗꯦꯇꯥ-ꯄꯦꯔꯦꯟꯇ = "#ꯑꯦꯀꯣꯔꯗꯟ2" href = "#ꯀꯣꯂꯥꯞꯁꯇꯨ" >    
        ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯒ꯭ꯔꯨꯞ ꯑꯥꯏꯇꯦꯝ #2
      </a> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
    </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
    <div id = "collapseTwo" class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯍꯀꯆꯥꯡ ꯁꯣꯀꯄꯥ" >  
      <div class = "ꯑꯦꯀꯣꯔꯗꯟ-ꯏꯅꯥꯔ" > 
        ꯑꯅꯤꯝ ꯄꯥꯔꯤꯑꯦꯇꯨꯔ ꯀ꯭ꯂꯤꯆ...
      </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
    </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
...

ꯑꯦꯀꯣꯔꯗꯟ ꯃꯥꯔꯀꯑꯥꯞ ꯌꯥꯑꯣꯗꯅꯥ ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤꯁꯨ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯒꯅꯤ꯫ ꯑꯇꯣꯞꯄꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯑꯦꯛꯁꯄꯥꯟꯗꯤꯡ ꯑꯃꯁꯨꯡ ꯀꯣꯂꯥꯞꯄꯤꯡ ꯇꯣꯒꯜ ꯇꯧꯕꯥ ꯕꯇꯟ ꯑꯃꯥ ꯁꯦꯝꯃꯨ꯫

<ꯕꯇꯟ ꯃꯈꯜ = "ꯕꯇꯟ" ꯀ꯭ꯂꯥꯁ = "btn btn-ꯈꯨꯗꯣꯡꯊꯤꯕꯥ" ꯗꯦꯇꯥ-ꯇꯣꯒꯜ = "ꯀꯣꯂꯥꯞꯁ" ꯗꯦꯇꯥ-ꯇꯥꯔꯒꯦꯠ = "#ꯗꯦꯃꯣ" >    
  ꯁꯤꯝꯄꯜ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯣꯏꯕꯥ꯫
</ꯕꯇꯟ>ꯗꯥ ꯊꯝꯃꯨ꯫
 
<div id = "ꯗꯦꯃꯣ" ꯀ꯭ꯂꯥꯁ = "ꯀꯣꯂꯥꯞꯁ ꯏꯟ" > ... </div>  

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯀꯟꯠꯔꯣꯜ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯑꯦꯁꯥꯏꯟ ꯇꯧꯅꯕꯥ ꯁꯨꯞꯅꯒꯤ ꯑꯦꯗ data-toggle="collapse"ꯑꯃꯁꯨꯡ ꯑꯦ data-targetꯇꯨ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯈꯛꯇꯃꯛ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯁꯤꯅꯥ data-targetꯀꯣꯂꯥꯞꯁ ꯑꯗꯨ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯅꯕꯥ css ꯁꯦꯂꯦꯛꯇꯔ ꯑꯃꯥ ꯌꯥꯔꯦ. collapseꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯁꯣꯌꯗꯅꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯃꯁꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯍꯥꯡꯗꯣꯀꯄꯥ ꯄꯥꯝꯂꯕꯗꯤ, ꯑꯍꯦꯅꯕꯥ ꯀ꯭ꯂꯥꯁ ꯍꯥꯄꯆꯤꯜꯂꯨ in.

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯀꯟꯠꯔꯣꯜ ꯑꯃꯗꯥ ꯑꯦꯀꯣꯔꯗꯅꯒꯨꯝꯕꯥ ꯒ꯭ꯔꯨꯞ ꯃꯦꯅꯦꯖꯃꯦꯟꯇ ꯍꯥꯄꯆꯤꯟꯅꯕꯥ, ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯍꯥꯄꯆꯤꯜꯂꯨ data-parent="#selector". ꯃꯁꯤ ꯊꯕꯛ ꯑꯣꯏꯅꯥ ꯎꯅꯕꯒꯤꯗꯃꯛ ꯗꯦꯃꯣ ꯑꯗꯨ ꯌꯦꯡꯕꯤꯌꯨ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯑꯁꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯏꯅꯦꯕꯜ ꯇꯧꯕꯤꯌꯨ:

$ ( ".ꯀꯣꯂꯥꯞꯁ ꯇꯧꯕꯥ" ). ꯀꯣꯂꯥꯞꯁ ꯇꯧꯕꯥ () .

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-parent="".

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

.ꯀꯣꯂꯥꯞꯁ(ꯑꯣꯄꯁꯅꯁꯤꯡ) .

ꯅꯍꯥꯛꯀꯤ ꯀꯟꯇꯦꯟꯇ ꯑꯗꯨ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯑꯦꯛꯇꯤꯚ ꯇꯧꯏ꯫ ꯑꯣꯄꯁꯅꯦꯜ ꯑꯣꯄꯁꯟ ꯑꯃꯥ ꯌꯥꯔꯦ object.

$ ( '#ꯑꯩꯒꯤ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ' ). ꯊꯨꯒꯥꯏꯕꯥ ({
  toggle : ꯑꯔꯥꯅꯕꯥ ꯇꯧꯕꯥ꯫ 
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

.collapse('ꯇꯣꯒꯜ') ꯇꯧꯕꯥ ꯌꯥꯏ꯫

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯎꯠꯄꯥ ꯅꯠꯠꯔꯒꯥ ꯂꯣꯠꯁꯤꯟꯅꯕꯥ ꯇꯣꯒꯜ ꯇꯧꯏ꯫

.collapse('ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯎꯠꯄꯥ')

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯎꯠꯂꯤ꯫

.collapse('ꯂꯨꯀꯄꯥ') .

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯂꯣꯠꯁꯤꯜꯂꯤ꯫

ꯊꯧꯔꯃꯁꯤꯡ꯫

ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯀꯣꯂꯥꯄꯁ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤꯅꯥ ꯀꯣꯂꯥꯄꯁ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤꯗꯥ ꯍꯨꯛ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯊꯧꯗꯣꯛ ꯈꯔꯥ ꯑꯦꯛꯁꯄꯣꯖ ꯇꯧꯏ꯫

$ ( '#ꯑꯩꯒꯤ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ' ). on ( 'ꯂꯣꯠꯁꯤꯜꯂꯕꯥ' , ꯐꯉ꯭ꯀꯁꯟ () {   
  // ꯀꯔꯤꯒꯨꯝꯕꯥ ꯈꯔꯥ ꯇꯧꯕꯥ...
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯀꯦꯔꯣꯁꯤꯜ꯫

ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯁ꯭ꯂꯥꯏꯗꯁꯣ ꯑꯁꯤꯅꯥ ꯀꯦꯔꯣꯁꯦꯂꯒꯨꯝꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯖꯦꯅꯦꯔꯦꯜ ꯄ꯭ꯂꯒꯏꯟ ꯑꯃꯁꯨꯡ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯥ ꯎꯠꯂꯤ꯫

ꯑꯍꯥꯅꯕꯥ ꯊꯝꯕꯤꯕꯥ ꯂꯦꯕꯦꯜ꯫

ꯀ꯭ꯔꯥꯁ ꯖꯁ꯭ꯇꯣ ꯑꯣꯗꯤꯑꯣ, ꯗꯥꯄꯤꯕꯁ ꯑꯦꯁꯤ ꯐꯦꯁꯤꯂꯤꯁꯤꯁ ꯏꯟ, ꯑꯦꯒꯦꯁ꯭ꯇꯥꯁ ꯑꯦꯒꯦꯠ ꯀ꯭ꯕꯥꯝ꯫ ꯗꯣꯅꯦꯛ ꯑꯥꯏꯗꯤ ꯏꯂꯤꯠ ꯅꯟ ꯃꯤ ꯄꯣꯔꯇꯥ ꯒ꯭ꯔꯦꯚꯤꯗꯥ ꯑꯦꯠ ꯑꯦꯒꯦꯠ ꯃꯦꯇꯁ꯫ ꯅꯨꯜꯂꯥꯝ ꯑꯥꯏꯗꯤ ꯗꯣꯂꯣꯔ ꯑꯥꯏꯗꯤ ꯅꯤꯚ ꯎꯜꯠꯔꯤꯁꯤꯁ ꯚꯦꯍꯤꯀꯨꯂꯥ ꯎꯠ ꯑꯥꯏꯗꯤ ꯏꯂꯤꯠ꯫

ꯑꯅꯤꯁꯨꯕꯥ ꯊꯝꯕꯤꯕꯥ ꯂꯦꯕꯦꯜ꯫

ꯀ꯭ꯔꯥꯁ ꯖꯁ꯭ꯇꯣ ꯑꯣꯗꯤꯑꯣ, ꯗꯥꯄꯤꯕꯁ ꯑꯦꯁꯤ ꯐꯦꯁꯤꯂꯤꯁꯤꯁ ꯏꯟ, ꯑꯦꯒꯦꯁ꯭ꯇꯥꯁ ꯑꯦꯒꯦꯠ ꯀ꯭ꯕꯥꯝ꯫ ꯗꯣꯅꯦꯛ ꯑꯥꯏꯗꯤ ꯏꯂꯤꯠ ꯅꯟ ꯃꯤ ꯄꯣꯔꯇꯥ ꯒ꯭ꯔꯦꯚꯤꯗꯥ ꯑꯦꯠ ꯑꯦꯒꯦꯠ ꯃꯦꯇꯁ꯫ ꯅꯨꯜꯂꯥꯝ ꯑꯥꯏꯗꯤ ꯗꯣꯂꯣꯔ ꯑꯥꯏꯗꯤ ꯅꯤꯚ ꯎꯜꯠꯔꯤꯁꯤꯁ ꯚꯦꯍꯤꯀꯨꯂꯥ ꯎꯠ ꯑꯥꯏꯗꯤ ꯏꯂꯤꯠ꯫

ꯑꯍꯨꯃꯁꯨꯕꯥ ꯊꯝꯕꯤꯕꯥ ꯂꯦꯕꯦꯜ꯫

ꯀ꯭ꯔꯥꯁ ꯖꯁ꯭ꯇꯣ ꯑꯣꯗꯤꯑꯣ, ꯗꯥꯄꯤꯕꯁ ꯑꯦꯁꯤ ꯐꯦꯁꯤꯂꯤꯁꯤꯁ ꯏꯟ, ꯑꯦꯒꯦꯁ꯭ꯇꯥꯁ ꯑꯦꯒꯦꯠ ꯀ꯭ꯕꯥꯝ꯫ ꯗꯣꯅꯦꯛ ꯑꯥꯏꯗꯤ ꯏꯂꯤꯠ ꯅꯟ ꯃꯤ ꯄꯣꯔꯇꯥ ꯒ꯭ꯔꯦꯚꯤꯗꯥ ꯑꯦꯠ ꯑꯦꯒꯦꯠ ꯃꯦꯇꯁ꯫ ꯅꯨꯜꯂꯥꯝ ꯑꯥꯏꯗꯤ ꯗꯣꯂꯣꯔ ꯑꯥꯏꯗꯤ ꯅꯤꯚ ꯎꯜꯠꯔꯤꯁꯤꯁ ꯚꯦꯍꯤꯀꯨꯂꯥ ꯎꯠ ꯑꯥꯏꯗꯤ ꯏꯂꯤꯠ꯫

‹ ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ꯫ › .

<div id = "myCarousel" class = "ꯀꯦꯔꯣꯁꯤꯜ ꯁ꯭ꯂꯥꯏꯗ" >  
  <ol class = "ꯀꯦꯔꯣꯁꯤꯜ-ꯏꯟꯗꯤꯀꯦꯇꯔꯁꯤꯡ" > 
    <li data-target = "#myCarousel" data-slide-to = "0" ꯀ꯭ꯂꯥꯁ = "ꯑꯦꯛꯇꯤꯕ" </li>   
    <li data-target = "#myCarousel" ꯗꯦꯇꯥ-ꯁ꯭ꯂꯥꯏꯗ-ꯇꯨ = "1" ></li>  
    <li data-target = "#myCarousel" ꯗꯦꯇꯥ-ꯁ꯭ꯂꯥꯏꯗ-ꯇꯨ = "꯲" ></li>  
  </ol> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <!-- ꯀꯦꯔꯣꯁꯤꯜ ꯑꯥꯏꯇꯦꯃꯁꯤꯡ -->
  <div class = "ꯀꯦꯔꯣꯁꯤꯜ-ꯏꯅꯥꯔ" > 
    <div class = "ꯑꯦꯛꯇꯤꯕ ꯑꯥꯏꯇꯦꯝ" > ... </div> 
    <div ꯀ꯭ꯂꯥꯁ = "ꯑꯥꯏꯇꯦꯝ" > ... </div> 
    <div ꯀ꯭ꯂꯥꯁ = "ꯑꯥꯏꯇꯦꯝ" > ... </div> 
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <!-- ꯀꯦꯔꯣꯁꯤꯜ ꯅꯚ -->꯫
  <a class = "ꯀꯦꯔꯣꯁꯤꯜ-ꯀꯟꯠꯔꯣꯜ ꯂꯦꯞꯇꯅꯥ" href = "#myCarousel" data-slide = "ꯃꯃꯥꯡꯒꯤ" > ‹ </a> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫   
  <a class = "ꯀꯦꯔꯣꯁꯤꯜ-ꯀꯟꯠꯔꯣ��� ꯔꯥꯏꯠ" href = "#myCarousel" data-slide = "ꯃꯊꯪꯒꯤ" > › </a> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫   
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯀꯦꯔꯣꯁꯦꯂꯒꯤ ꯄꯣꯖꯤꯁꯟ ꯑꯗꯨ ꯐꯖꯅꯥ ꯀꯟꯠꯔꯣꯜ ꯇꯧꯅꯕꯥ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯧ꯫ ꯀꯤ-ꯋꯥꯔꯗꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ , data-slideꯑꯁꯤ ꯌꯥꯔꯦ , ꯃꯁꯤꯅꯥ ꯁ꯭ꯂꯥꯏꯗꯀꯤ ꯄꯣꯖꯤꯁꯟ ꯑꯗꯨ ꯃꯁꯤꯒꯤ ꯍꯧꯖꯤꯛ ꯂꯩꯔꯤꯕꯥ ꯄꯣꯖꯤꯁꯟ ꯑꯗꯨꯒꯥ ꯆꯥꯡꯗꯝꯅꯕꯗꯥ ꯍꯣꯡꯗꯣꯀꯏ꯫ ꯅꯠꯔꯒꯥ, ꯀꯦꯔꯣꯁꯦꯂꯗꯥ ꯔꯣ ꯁ꯭ꯂꯥꯏꯗ ꯏꯟꯗꯦꯛꯁ ꯑꯃꯥ ꯄꯥꯁ ꯇꯧꯅꯕꯥ ꯁꯤꯖꯤꯟꯅꯧ , ꯃꯁꯤꯅꯥ ꯖꯝꯄ'ꯁ ꯁ꯭ꯂꯥꯏꯗ ꯄꯣꯖꯤꯁꯟ ꯑꯗꯨ ꯑꯀꯛꯅꯕꯥ ꯏꯟꯗꯦꯛꯁ ꯑꯃꯗꯥ ꯍꯧꯔꯒꯥ .prevnextdata-slide-todata-slide-to="2"0

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯀꯦꯔꯣꯁꯤꯜ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯀꯜ ꯇꯧꯕꯤꯌꯨ:

$ ( '.ꯀꯦꯔꯣꯁꯤꯜ' ) ꯒꯤ ꯃꯇꯥꯡꯗꯥ꯫ ꯀꯦꯔꯣꯁꯤꯜ () ꯑꯁꯤꯅꯤ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-interval="".

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

.ꯀꯦꯔꯣꯁꯤꯜ(ꯑꯣꯄꯁꯅꯁꯤꯡ) .

ꯑꯣꯄꯁꯅꯦꯜ ꯑꯣꯄꯁꯟ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯁꯤ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯏ objectꯑꯃꯁꯨꯡ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯕꯥ ꯍꯧꯏ꯫

$ ( '.ꯀꯦꯔꯣꯁꯤꯜ' ) ꯒꯤ ꯃꯇꯥꯡꯗꯥ꯫ ꯀꯦꯔꯣꯁꯤꯜ ({
  ꯏꯟꯇꯔꯚꯜ : ꯲꯰꯰꯰ ꯑꯣꯏꯈꯤ꯫ 
}) ꯑꯃꯁꯨꯡ ꯑꯦꯟ.

.ꯀꯦꯔꯣꯁꯤꯜ('ꯁꯥꯏꯀꯜ') ꯑꯁꯤ ꯌꯥꯑꯣꯔꯤ꯫

ꯀꯦꯔꯣꯁꯤꯜ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯑꯗꯨꯗꯒꯤ ꯑꯔꯣꯏꯕꯥ ꯐꯥꯑꯣꯕꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯏ꯫

.ꯀꯦꯔꯣꯁꯤꯜ('ꯄꯣꯖ') .

ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯁꯤ ꯁꯥꯏꯀꯜ ꯊꯧꯕꯗꯒꯤ ꯊꯤꯡꯏ꯫

.ꯀꯦꯔꯣꯁꯤꯜ(ꯅꯝꯕꯔ) ꯴.

ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯑꯀꯛꯅꯕꯥ ꯐ꯭ꯔꯦꯝ ꯑꯃꯗꯥ (0ꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯥ, ꯑꯦꯔꯦ ꯑꯃꯒꯥ ꯃꯥꯟꯅꯕꯥ) ꯁꯥꯏꯀꯜ ꯇꯧꯏ꯫

.ꯀꯦꯔꯣꯁꯤꯜ('ꯃꯃꯥꯡꯒꯤ')

ꯃꯃꯥꯡꯒꯤ ꯑꯥꯏꯇꯦꯝ ꯑꯗꯨꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯏ꯫

.ꯀꯦꯔꯣꯁꯤꯜ('ꯃꯊꯪꯒꯤ')

ꯃꯊꯪꯒꯤ ꯑꯥꯏꯇꯦꯝ ꯑꯗꯨꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯏ꯫

ꯊꯧꯔꯃꯁꯤꯡ꯫

ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯀꯦꯔꯣꯁꯤꯜ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤꯅꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤꯗꯥ ꯍꯨꯛ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯊꯧꯗꯣꯛ ꯑꯅꯤ ꯐꯣꯡꯗꯣꯛꯂꯤ꯫

ꯈꯨꯗꯝ

ꯐꯣꯔꯝ ꯇꯦꯛꯁꯠ ꯏꯅꯄꯨꯠ ꯑꯃꯍꯦꯛꯇꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯑꯦꯂꯤꯒꯦꯟꯇ ꯇꯥꯏꯄꯍꯦꯗꯁꯤꯡ ꯊꯨꯅꯥ ꯁꯦꯝꯅꯕꯒꯤꯗꯃꯛ ꯕꯦꯁꯤꯛ, ꯐꯖꯅꯥ ꯁꯥꯡꯗꯣꯀꯄꯥ ꯄ꯭ꯂꯒꯏꯟ ꯑꯃꯅꯤ꯫

<ꯏꯅꯄꯨꯠ ꯃꯈꯜ = "ꯇꯦꯛꯁꯠ" ꯗꯦꯇꯥ-ꯄ꯭ꯔꯣꯚꯥꯏꯗ = "ꯇꯥꯏꯄꯍꯦꯗ" >  

ꯅꯍꯥꯛꯅꯥ autocomplete="off"ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯇꯥꯏꯄꯍꯦꯗ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯒꯤ ꯃꯊꯛꯇꯥ ꯗꯤꯐꯣꯜꯇ ꯕ꯭ꯔꯥꯎꯖꯔ ꯃꯦꯅꯨꯁꯤꯡ ꯂꯥꯀꯄꯥ ꯊꯤꯡꯅꯕꯥ ꯁꯦꯠ ꯇꯧꯕꯥ ꯄꯥꯝꯂꯒꯅꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯃꯊꯛꯀꯤ ꯈꯨꯗꯝ ꯑꯁꯤꯗꯥ ꯎꯠꯂꯤꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯇꯥꯏꯄꯍꯦꯗ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯂꯩꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯔꯦꯖꯤꯁ꯭ꯇꯔ ꯇꯧꯅꯕꯥ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯇꯥꯏꯄꯍꯦꯗ ꯑꯗꯨ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯀꯜ ꯇꯧꯕꯤꯌꯨ:

$ ( '.ꯇꯥꯏꯄꯍꯦꯗ' )꯫ ꯇꯥꯏꯄꯍꯦꯗ () ꯑꯁꯤꯅꯤ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-source="".

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

.ꯇꯥꯏꯄꯍꯦꯗ(ꯑꯣꯄꯁꯅꯁꯤꯡ) .

ꯇꯥꯏꯄꯍꯦꯗ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯏꯅꯄꯨꯠ ꯑꯃꯥ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯏ꯫

ꯈꯨꯗꯝ

ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯁꯕꯅꯦꯚꯤꯒꯦꯁꯟ ꯑꯁꯤ ꯑꯦꯐꯤꯛꯁ ꯄ꯭ꯂꯒꯏꯅꯒꯤ ꯂꯥꯏꯚ ꯗꯦꯃꯣ ꯑꯃꯅꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯍꯦꯛꯇꯗꯥ ꯑꯦꯐꯤꯛꯁ ꯕꯤꯍꯦꯕꯤꯌꯔ ꯐꯖꯅꯥ ꯍꯥꯄꯆꯤꯟꯅꯕꯥ, data-spy="affix"ꯅꯍꯥꯛꯅꯥ ꯁ꯭ꯄꯥꯏ ꯇꯧꯕꯥ ꯄꯥꯝꯂꯤꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯃꯗꯨꯒꯤ ꯃꯇꯨꯡꯗꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯄꯤꯅꯤꯡ ꯑꯗꯨ ꯀꯗꯥꯏꯗꯥ ꯑꯣꯟ ꯑꯃꯁꯨꯡ ꯑꯣꯐ ꯇꯧꯒꯗꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯂꯦꯄꯊꯣꯛꯅꯕꯥ ꯑꯣꯐꯁꯦꯇꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯧ꯫

<div ꯗꯦꯇꯥ-ꯁ꯭ꯄꯥꯏ = "ꯑꯦꯐꯤꯛꯁ" ꯗꯦꯇꯥ-ꯑꯣꯐꯁꯦꯠ-ꯇꯣꯞ = "꯲꯰꯰" > ... </div>  

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯑꯦꯐꯤꯛꯁ ꯄ꯭ꯂꯒꯏꯟ ꯑꯗꯨ ꯀꯜ ꯇꯧꯕꯤꯌꯨ:

$ ( '#ꯅꯥꯚꯕꯥꯔ' )꯫ ꯑꯦꯐꯤꯛꯁ ꯇꯧꯕꯥ ()

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-offset-top="200".