.&1|?" {}:+dq8mQk?y@&*[3Tʧ39} j̉ w=>FVE'*^wA|FƝ6)AvRT2>{xRO@N Va+$0fcJEUę!\+(E _"Il̚74qf' _ ndVluC:E0 <;ѭv40MF̖C *1AM:!h2EnT GWR"ZY_c#"-vʮ])0F2 w)*iSv TRRw'cAzOr3سi;Ɉ$ I%Nёy@} $waYv$qɜ? ɰ3~_rpp(J);,BEX÷̓Wr@K +'kшEUo|8:!Uiz!lHIH z^q1iE=~Ô.l~^(θ.Id8td@sXׁ".rcp|R@$@(9Լ)fY PdeP;Nو*LuX.a y7 |_2nd؜>4e'd7 N^ZҢ<>);<>t%Z\ 9ɉfTyi{5K0%Nat헆/kT_cXAjU06Q>7R#~߼DQP^NΆ* h45= _bpڌ I/ʁiN#~ $86eu lj X@jژ 3d8<RJ7Rk vyUXoЧ"$*G_L Q#M&6ib$:Tr]Sv.r hqYB ZR_RE)W҈]>WIqZgN !V$_"P[vFbaBXׁ".rcp|R]k2_j®"-{47%{﬩!kwzqݜp ZȞMnv@G((ߎ2h`|+,ZW> MWIQW'>oa%S Eu ,n.3OkՃ hlt !$h"M +Q-J#S( :vJnې -&&Ti=Ɔ*myJ@B8ؠ:Ћf<۾)VC+/*i*qeؖrl" ZHCTA1:)C$Ιɇ-`Iqi]Z5wF 657+ڡ ;:@^'4 .TC%\|ow3?(=YS'^ֶ/,'KV:-| xAub+O8R8ʡzDDF=T}jom$NF!3d? hqYB `(Zkb>/]etspeO\9go𧻓ː5Ieh-#HfkŒ#8)`ӊ(z+Q +Nb!(E rܸ-LWF=GJ<[3[,ϳX ǠnRR=pVLJg9QGKZ~rDQP^NΆ* h4c>Ы&X{+Nyvc~o i hqYB ZR_RE)WOr3سi;Ɉ汗zLƙ=[/Sy;ɨ"-cFCĶլݥނ7wC$T"-cFCĶ9f5`K"q'{~I}"ꄏBV+oI-B=FS|z Nh.2»kQ֊,9Bi@Prj~e3[uVsƃz} "\ůȺxɃWIqCQ,Պ:Vacx/Rw 0xcd$PhmQQE=J13')dFp!|+RGγa#)!gH9eGF=p3~_rp+@M6>&]g9yӟG0e·AM43ʆ&]g9yӟG0ei@rɶtPysbX %ns &Ti=Ɔ6[ܛ1G5;F$T!%b 3d,Čt 6r鴅+2At[F#(U-ua'(nh woH6LSRelSvυn!JфPyGa.B6tk?SyCz<_&3>{h4ht>)! Y\UrGRpeO\9go^TzA B5G_ Mo*e`jIsb7p@^'4 .TC%\dc64V˴*ϫ{\; +_ o fjJ_/|_j(XBѫ]P7{xTF0?)gBd.m(44):ܙl -}^ QT@ KS ~VN(X4R̭;yca58; box-shadow: 0 0 1px 1px #fff inset; background: #fde38a; background: linear-gradient(#fdeeb3, #fde38a, #fdefbb); } .jqx-button-demoTheme:active { border-color: #c2963d; background: #fff37f; background: linear-gradient(#ffe575, #fff37f); } .jqx-fill-state-hover-demoTheme, .jqx-fill-state-pressed-demoTheme { border-color: #c2963d; background: #fff37f; background: linear-gradient(#ffe575, #fff37f); } #fileItemButton { background: transparent; border: none; color: #fff; } .icon { background: url('../../../images/ribbon-icons.png') no-repeat top left; width: 16px; height: 16px; display: inline-block; margin-right: 1px; vertical-align: middle; } .icon.closed_door { background-position: 0 0; } .icon.change-case-16 { background-position: -26px 0; } .icon.ClearFormattingImage { background-position: -52px 0; width: 17px; } .icon.close { background-position: -78px 0; } .icon.cut { background-position: -104px 0; } .icon.cut_red { background-position: -130px 0; } .icon.cut-icon-16 { background-position: -156px 0; } .icon.CutImage { background-position: -182px 0; } .icon.folder { background-position: -208px 0; } .icon.FontDialogImage { background-position: -234px 0; } .icon.fontsizedecrease16 { background-position: -260px 0; } .icon.fontsizeincrease16 { background-position: -286px 0; } .icon.FormatPainterImage { background-position: -312px 0; } .icon.page_copy { background-position: -338px 0; } .icon.page_paste { background-position: -364px 0; } .icon.page_white_paste { background-position: -390px 0; } .icon.paintcan { background-position: -416px 0; } .icon.paste_plain { background-position: -442px 0; } .icon.paste_word { background-position: -468px 0; } .icon.paste-24 { background-position: -494px 0; width: 24px; height: 24px; } .icon.paste-48 { background-position: -528px 0; width: 48px; height: 48px; } .icon.PasteImage { background-position: -586px 0; } .icon.PasteImageLarge { background-position: -612px 0; width: 32px; height: 32px; } .icon.PasteSpecialImage { background-position: -654px 0; } .icon.pencil { background-position: -680px 0; } .icon.SaveImage { background-position: -706px 0; } .icon.SaveSelectionImage { background-position: -732px 0; } .icon.ShowParagraphMarksImage { background-position: -758px 0; } .icon.SortHS { background-position: -784px 0; } .icon.spellcheck { background-position: -810px 0; } .icon.text_align_center { background-position: -836px 0; } .icon.text_align_justify { background-position: -862px 0; } .icon.text_align_left { background-position: -888px 0; } .icon.text_align_right { background-position: -914px 0; } .icon.text_bold { background-position: -940px 0; } .icon.text_indent { background-position: -966px 0; } .icon.text_indent_remove { background-position: -992px 0; } .icon.text_italic { background-position: -1018px 0; } .icon.text_linespacing { background-position: -1044px 0; } .icon.text_list_bullets { background-position: -1070px 0; } .icon.text_list_numbers { background-position: -1096px 0; } .icon.text_strikethrough { background-position: -1122px 0; } .icon.text_subscript { background-position: -1148px 0; } .icon.text_superscript { background-position: -1174px 0; } .icon.text_underline { background-position: -1200px 0; }
This demo showcases an Office-like ribbon. TypeScript example.
    • Save
    • Save As
    • Open
    • Close
  • Home
  • Help
Paste
Cut
Copy
Format Painter
Clipboard
Font
Alignment
Help
About
Update