Playground and DEMO space
This is a playground and demo space for ConfiForms and ConfiDoc addons developed and supported by Vertuna LLC
Most pages provide a storage format for the demo, so you can use the free add-on from Atlassian Confluence Source Editor to import this configuration into your Confluence and see it in action
To import examples from the storage format on Confluence Cloud please see this page
Please note, all the examples here are provided without any obligation and may or may not be incomplete or may have bugs, and we provide NO SUPPORT for these examples and demos.
So, this demo shows how you can add a feature to show/hide more text on the field with JavaScript
Showing the contents
Huge textarea field |
---|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
123 |
Test |
dfasdfasdfasdfasdf |
56465a4sfd65a4f65a4sf54asf56a4as565a6546 |
aafdasfdasfdasdfasfdasfdasfda5sfd4a5 5asd4f5a64 54 5asdf4 as5df4a5sd4 asd5f4 asd5f43a5sd14 sa5d f4as5d fa65sdf4a6s5d 4fa6s5d as65 d4as d4f5as65d 4asd fs565as6d asdf |
sfsdsdfsdfsdfsdfddddddddddddddddddddddddddddddddddddddddfsdfsdfsfsdfsfsdsdfsdfsdfsdfddddddddddddddddddddddddddddddddddddddddfsdfsdfsfsdfsfsdsdfsdfsdfsdfddddddddddddddddddddddddddddddddddddddddfsdfsdfsfsdfsfsdsdfsdfsdfsdfddddddddddddddddddddddddddddddddddddddddfsdfsdfsfsdfsfsdsdfsdfsdfsdfddddddddddddddddddddddddddddddddddddddddfsdfsdfsfsdfsfsdsdfsdfsdfsdfddddddddddddddddddddddddddddddddddddddddfsdfsdfsfsdf |
test text |
djkhk.sdjfn |
sdfsdfsdfsdfsdf |
asd |
ddddd |
hello good morning. |
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
123456789012345689012345678901234568901234567890123456890123456789012345689012345678901234568901234567890123456890 |
55555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555 |
aga |
niko |
nikooooooooooooooooooooooooooooo |
111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 |
xcvxcvcxvxc |
dfjdjdfj |
this is a string |
Testing ` 1 2 3 4 5 6 fadsafdsadas DSds dasd dD afdsadf afdasdf asffadsf |
hgjb;;;;;;;;;lkkkkkkjmml; pjk;j |
Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test |
fdsafdsafdsafdsafdsa |
qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq |
jbjkbjkhjkhjnjhljkh |
ewrwe |
vvvv |
vcxvzxcvzxvzcx |
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
test |
guyigyhiuhghjhsdjfhlsdjkfsjdfnjnfjkshfuhfnjkdfns sdfjbrfgbdrg rfgkdnfklndfgnal;kf asdferjkntgjeruoginfvkldrg adfjgnaornjfgdrgjkr |
Vader: There is no escape. Don't make me destroy you. Luke, you do not yet realize your importance. You've only begun to discover your power. Join me, and I will complete your training. With our combined strength, we can end this destructive conflict, and bring order to the galaxy! Luke: [wincing] I'll NEVER join you! Vader: If only you knew the power of the dark side. Obi-Wan never told you what happened to your father. Luke: He told me enough. He told me you killed him. Vader: No. I am your father. Luke: [shocked] No. No. That's not true! That's impossible! Vader: Search your feelings, you know it to be true. Luke: NOOOOOOO!!! NOOOOOOOO!!! |
asdfsdfds |
uihkjjo joikokl |
сасал |
now is the time |
jhj |
toto is alive toto is alive toto is alive toto is alive toto is alive toto is alive toto is alive toto is alive |
fdsfdsf |
gngngngnhgngngngnghnhnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn |
rythn |
sdfsdfsdfdsf |
ññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññññllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkjjjjjjjjjjjjjkkkkkkkkkkkjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj |
asdsdasd |
test |
Friday Afternoon Test |
abcsd |
test |
dsddd |
test |
hgfytfytvy yfy gy |
fgdfgd |
jhbjhb |
HelloWord |
qwasdfghj |
mkkl;l'lk;l';lkl;kl |
fffff |
xcxzczxcz |
fgbhcvxb |
ggggggg |
zazaz |
123ABC |
dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj dsdjsdsajdkadjaskdj |
asdasd |
dasd |
dfdfdfd |
Hallo Welt |
test |
testing |
vccvcx |
hihi |
testse |
123 |
test |
test |
bhkjlbiygjvh,.bhjbhkb.b |
ssssssssssssssssssssssssssssssssssssss |
jhkjk |
test |
dsffds |
sdfsfdsdfsdfsdfsfsdfsdfsssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss |
Lulululululululululululululu Lililololoooolilililillilillliollioooi |
Iihciioycooooooyvoopppp0 |
zadddazdaz |
sdfsdsdfsdsffdsfsdf dsf d fs dfs df sdf sd f sd fdds fsdsd f dsf dsfs |
fff |
qweqwe |
Test |
testing |
hhhhhhhhhhhh |
SSsasASA |
a |
asdasd |
ASFSDFSFF SDFSDF SDF S FSD FS DF SD FS DF SF SDF SDFSDF |
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa |
test |
yyyyyyyppppppppppppp |
Yvhh |
dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg dyfbydfgydfgfdgdfgdfg |
dfhdfghdfghdfghdf |
tybto |
test |
tony |
aga |
Lorem ipsum dolor sit amet, consectetur adipiscing... |
(/) |
hello |
vcvc |
bn,;b;,b,v; |
asdffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff |
zxcxc |
dsgsdbcvxhnfjyg |
l,;;l,;,;l,l;, |
judzfjgb |
;mdv;mfl;ma'admgam |
Most pages provide a storage format for the demo, so you can use the free add-on from Atlassian Confluence Source Editor to import this configuration into your Confluence and see it in action Please note, all the examples here are provided without any obligation and may or may not be incomplete or may have bugs, and we provide NO SUPPORT for these examples and demos. |
asd |
nn |
The vendor, CSP, identified a problem with their queue and as of 17:11CT, they communicated they bounced the ports at 17:01 CT. Validation was successful. |
fgfffgfg |
koioi |
111111111 |
kkkkkkkk |
lkjlkjlkj |
test |
jkjk ii |
89 |
eeeeeeeeeeeeeefffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff |
ttttt |
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
fdrdfgdfgdfgd |
test asdfxsdgDSFgnd r yrsdf ymhdu tyuhftvh |
gfdsgfdsgfds |
ffghgfhgfh |
Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime mollitia, molestiae quas vel sint commodi repudiandae consequuntur voluptatum laborum numquam blanditiis harum quisquam eius sed odit fugiat iusto fuga praesentium optio, eaque rerum! Provident similique accusantium nemo autem. Veritatis obcaecati tenetur iure eius earum ut molestias architecto voluptate aliquam nihil, eveniet aliquid culpa officia aut! Impedit sit sunt quaerat, odit, tenetur error, harum nesciunt ipsum debitis quas aliquid. Reprehenderit, quia. Quo neque error repudiandae fuga? Ipsa laudantium molestias eos sapiente officiis modi at sunt excepturi expedita sint? Sed quibusdam recusandae alias error harum maxime adipisci amet laborum. Perspiciatis minima nesciunt dolorem! Officiis iure rerum voluptates a cumque velit quibusdam sed amet tempora. Sit laborum ab, eius fugit |
testing 1 2 3... |
ggg |
123123123123 |
twefgfgdfgdfgdfgdf |
fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj fghjklçkjhgf jk kj kj f |
zxcxczxczxc |
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
esrteryry |
123456789 |
hjghjhj |
123456789456123 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 |
dfsfsfsf |
What do we want here |
111 |
' ' jkk |
hello |
Tessyttt |
kek |
dfssdf sd dsf d d d d d |
this is a test |
This is a test |
гореп |
wwwww |
resr |
sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss |
23 |
test |
Hola como están inútiles |
62465546 |
sf sf s s dfs df |
mn |
Der erste Absatz besteht in einer gängigen Form aus folgenden Wörtern: “Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.” |
x |
test |
hola hola hello hello are you there? |
gkjgj |
dxfcgdgf |
6666632313 |
lk;l;l,;l, |
Storage format
<ac:structured-macro ac:macro-id="d69a709c-8d46-4a80-bc3f-451e22d98df5" ac:name="confiform" ac:schema-version="1"> <ac:parameter ac:name="formName">myform1</ac:parameter> <ac:rich-text-body> <ac:structured-macro ac:macro-id="5fb1c0d1-5c36-489d-a94c-2833a50c70e2" ac:name="confiform-entry-register" ac:schema-version="1"> <ac:parameter ac:name="embedded">true</ac:parameter> <ac:parameter ac:name="atlassian-macro-output-type">INLINE</ac:parameter> <ac:rich-text-body> <p> <br/> </p> </ac:rich-text-body> </ac:structured-macro> <p> <ac:structured-macro ac:macro-id="39f92f63-7dc1-4c3e-9276-bfd5c053440c" ac:name="confiform-field-definition" ac:schema-version="1"> <ac:parameter ac:name="fieldName">hugeta</ac:parameter> <ac:parameter ac:name="fieldLabel">Huge textarea field</ac:parameter> <ac:parameter ac:name="fieldDescription">max 1000 symbols</ac:parameter> <ac:parameter ac:name="type">textarea</ac:parameter> </ac:structured-macro> </p> <p> <ac:structured-macro ac:macro-id="03b90e65-9ad8-40e3-a8c7-58597024451f" ac:name="confiform-field-definition-rules" ac:schema-version="1"> <ac:parameter ac:name="condition">hugeta.asCount:>1000</ac:parameter> <ac:parameter ac:name="fieldName">We accept only 1000 symbols here</ac:parameter> <ac:parameter ac:name="action">Validation rule</ac:parameter> </ac:structured-macro> </p> <p> <br/> </p> </ac:rich-text-body> </ac:structured-macro> <p>Showing the contents</p> <ac:structured-macro ac:macro-id="377bb64c-95db-421d-b853-b0cd05767345" ac:name="confiform-table" ac:schema-version="1"> <ac:parameter ac:name="formName">myform1</ac:parameter> <ac:rich-text-body> <p> <ac:structured-macro ac:macro-id="6354e4b6-2358-403e-9296-f21319ad343d" ac:name="confiform-field" ac:schema-version="1"> <ac:parameter ac:name="fieldName">hugeta</ac:parameter> </ac:structured-macro> </p> </ac:rich-text-body> </ac:structured-macro> <ac:structured-macro ac:macro-id="3d4d8dd2-0381-45e2-ac3f-d48ffaf4d002" ac:name="html" ac:schema-version="1"> <ac:plain-text-body><![CDATA[<style> .morecontent span { display: none; } .morelink { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; position: relative; margin-top: 20px; font-size: 13px; color: #ececec; } .morelink:after { content: ''; -ms-flex-item-align: start; align-self: flex-start; display: inline-block; width: 5px; height: 5px; margin-top: 6px; margin-left: 10px; border: 1px solid #ececec; border-top: none; border-right: none; background: transparent; transform: rotate(-45deg); transform-origin: bottom; } .morelink.less:after { margin-left: 7px; transform: rotate(135deg); } </style> <script> function showHideText(sSelector, options) { // Def. options var defaults = { charQty : 100, ellipseText : "...", moreText : "Show more", lessText : "Show less" }; var settings = AJS.$.extend( {}, defaults, options ); var s = this; s.container = AJS.$(sSelector); s.containerH = s.container.height(); s.container.each(function() { var content = AJS.$(this).html(); if(content.length > settings.charQty) { var visibleText = content.substr(0, settings.charQty); var hiddenText = content.substr(settings.charQty, content.length - settings.charQty); var html = visibleText + '<span class="moreellipses">' + settings.ellipseText + '</span><span class="morecontent"><span>' + hiddenText + '</span><a href="" class="morelink">' + settings.moreText + '</a></span>'; AJS.$(this).html(html); } }); s.showHide = function(event) { event.preventDefault(); if(AJS.$(this).hasClass("less")) { AJS.$(this).removeClass("less"); AJS.$(this).html(settings.moreText); AJS.$(this).prev().fadeToggle('fast', function() { $(this).parent().prev().fadeIn(); }); } else { AJS.$(this).addClass("less"); AJS.$(this).html(settings.lessText); AJS.$(this).parent().prev().hide(); AJS.$(this).prev().fadeToggle('fast'); } } AJS.$(".morelink").bind('click', s.showHide); } /*------------------------------------------*/ AJS.toInit(function() { new showHideText('span[cf-field^="hugeta"]', { charQty : 50 }); }); </script>]]></ac:plain-text-body> </ac:structured-macro>