TextArea Resizer

码农软件 · 软件分类 · jQuery表单及相关 · 2019-12-24 13:28:56

软件介绍

* Added live demo page (url at bottom of page)

This project allows the user to extend the textarea element/area within the web page whenever they feel.

I noticed this functionality when adding a plugin to this website, I guess it's not used that often on other websites.

It is part of the Drupal code, although I haven't much experience with Drupal.

I found it useful and could see an immediate use for it on one of the web applications that I use (Tridion).

Anyway, I decide to spend a few minutes (it was a quick conversion) and turn the functionality in to a jQuery plugin (I couldn't see it in the repository).

To use it you'll need to add the usual jQuery javascript and the plugin to your web page HEAD section:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="jquery.textarearesizer.compressed.js"></script>

 

And then add a little style sheet information:

<style type="text/css">
div.grippie {
background:#EEEEEE url(grippie.png) no-repeat scroll center 2px;
border-color:#DDDDDD;
border-style:solid;
border-width:0pt 1px 1px;
cursor:s-resize;
height:9px;
overflow:hidden;
}
.resizable-textarea textarea {
display:block;
margin-bottom:0pt;
width:95%;
height: 20%;
}
</style>

 

Finally, it's a simple case of activating it against a given element set:

<script type="text/javascript">
/* jQuery textarea resizer plugin usage */
$(document).ready(function() {
$('textarea.resizable:not(.processed)').TextAreaResizer();
});
</script>

 

An example is included in the release.

* Please note that it also uses a tiny 'png' image, although it's entirely optional as this is part of the example style sheet (as seen in the Drupal version).

Enjoy!

My other projects include:
Bounce - http://plugins.jquery.com/project/Bounce
Hover Image Text - http://plugins.jquery.com/project/HoverImageText

本文地址:https://codercto.com/soft/d/21850.html

深入浅出HTML与CSS、XHTML

深入浅出HTML与CSS、XHTML

[美] 弗里曼 Freeman.E. / 东南大学出版社 / 2006-5 / 98.00元

《深入浅出HTML与CSS XHTML》(影印版)能让你避免认为Web-safe颜色还是紧要问题的尴尬,以及不明智地把标记放入你的页面。最大的好处是,你将毫无睡意地学习HTML、XHTML 和CSS。如果你曾经读过深入浅出(Head First)系列图书中的任一本,就会知道书中展现的是什么:一个按人脑思维方式设计的丰富的可视化学习模式。《深入浅出HTML与CSS XHTML》(影印版)的编写采用了......一起来看看 《深入浅出HTML与CSS、XHTML》 这本书的介绍吧!

在线进制转换器
在线进制转换器

各进制数互转换器

RGB HSV 转换
RGB HSV 转换

RGB HSV 互转工具

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具