试图使用autoResize
问题描述:
我有这个简单的textarea。当它没有被选中时,我希望它看起来像一个完成的产品(即文本的两侧逐渐变细)。我也想让用户改变宽度。我如何使用autoresize插件来做到这一点?试图使用autoResize
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Pathway Builder</title>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<textarea class="text_field_not_selected"></textarea>
<script src="jQuery.js" type="text/javascript"></script>
<script src="selectors.js" type="text/javascript"></script>
</body>
</html>
的JavaScript/jQuery的
$('textarea').bind('focusin blur', function() {
$(this).toggleClass('text_field_not_selected');
});
$('textarea').autoResize();
CSS
body {
display: block;
}
textarea:focus {
outline: none;
text-align: center;
}
.text_field_not_selected {
text-align: center;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-moz-box-shadow: 0px 3px 5px #444;
-webkit-box-shadow: 0px 3px 5px #444;
padding: 5px;
}
答
的第一部分,你可以使用类似
border-style: none;
和第二部分你可以点击并拖动右下角的文本框并调整其大小
我不希望用户能够控制大小。我知道我有点在标题中说的相反,但我真正想要的是将高度:宽度比自动调整为大约2:3。 – mharris7190 2012-03-24 02:29:40