js實作input輸入框點選變大縮小
- 小云云原創
- 2018-03-07 17:07:564356瀏覽
本文主要跟大家分享js實作input輸入框點選變大縮小的實例程式碼，希望能幫助大家。
一、input輸入框點選變大縮小的js程式碼
html中
<style type="text/css">
input[type='text'] {
width: 100px;
height: 30px;
border-radius: 5px;
}
</style>
</head>
<body>
<p>
标题:<input class="InputTitle" value="" type="text" />
</p>
<!-- js响应"内容"输入框变大事件:src="/js/article/change_input.js" -->
<p>
内容:<input class="InputContent" value="" type="text_content" />
</p>js程式碼中
$(document).ready(function() {
$("input[type='text_content']").focus(function() {
$(this).animate({
"width" : "400px",
"height" : "70px"
})
}).blur(function() {
$(this).animate({
"width" : "100px",
"height" : "30px"
})
});
});相關推薦：
JS實作點選下拉選單把選擇的內容同步到input輸入框內的實例
#以上是js實作input輸入框點選變大縮小的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
上一篇：Hibernate的配置下一篇：Hibernate的配置