*Addedlivedemopage(urlatbottomofpage)
Thisprojectallowstheusertoextendthetextareaelement/areawithinthewebpagewhenevertheyfeel.
Inoticedthisfunctionalitywhenaddingaplugintothiswebsite,Iguessit'snotusedthatoftenonotherwebsites.
ItispartoftheDrupalcode,althoughIhaven'tmuchexperiencewithDrupal.
IfounditusefulandcouldseeanimmediateuseforitononeofthewebapplicationsthatIuse(Tridion).
Anyway,Idecidetospendafewminutes(itwasaquickconversion)andturnthefunctionalityintoajQueryplugin(Icouldn'tseeitintherepository).
Touseityou'llneedtoaddtheusualjQueryjavascriptandtheplugintoyourwebpageHEADsection:
<scripttype="text/javascript"src="https://code.jquery.com/jquery-latest.js"></script><scripttype="text/javascript"src="jquery.textarearesizer.compressed.js"></script>
Andthenaddalittlestylesheetinformation:
<styletype="text/css">div.grippie{background:#EEEEEEurl(grippie.png)no-repeatscrollcenter2px;border-color:#DDDDDD;border-style:solid;border-width:0pt1px1px;cursor:s-resize;height:9px;overflow:hidden;}.resizable-textareatextarea{display:block;margin-bottom:0pt;width:95%;height:20%;}</style>
Finally,it'sasimplecaseofactivatingitagainstagivenelementset:
<scripttype="text/javascript">/*jQuerytextarearesizerpluginusage*/$(document).ready(function(){$('textarea.resizable:not(.processed)').TextAreaResizer();});</script>
Anexampleisincludedintherelease.
*Pleasenotethatitalsousesatiny'png'image,althoughit'sentirelyoptionalasthisispartoftheexamplestylesheet(asseenintheDrupalversion).
Enjoy!
Myotherprojectsinclude:Bounce-https://plugins.jquery.com/project/BounceHoverImageText-https://plugins.jquery.com/project/HoverImageText
评论