javascript - 尝试使用自动调整大小

标签 javascript jquery html css

我有这个简单的文本区域。当它没有被选中时,我希望它看起来像一个成品(即侧面逐渐变细到文本)。我也想让用户改变宽度。我怎样才能使用 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;

对于第二部分,您只需单击并拖动文本框的右下角并调整其大小

关于javascript - 尝试使用自动调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9848301/

相关文章:

javascript - jQuery 获取元素中的文本但忽略样式标签

javascript - javascript中的多个函数调用,即combine(foo)(bar)

javascript - 跟踪模式内 HTML 表单的更改

javascript - 根据 ids 设置特定类的所有 div 的背景图像值

jquery - 创建临时 HTML 代码

javascript - 单击 if 语句不起作用

javascript - 如何在 JavaScript 中迭代键控数组?

jquery - 垂直 Accordion 内容 slider 理想 jQuery

javascript - 如何在 CSS 和 Jquery 上设置 float 位置弹出消息

html - 移动 View 上的 Bootstrap 3 div 顺序更改