如何使输入类型的文本自动扩展并设置特定的宽度扩展。
问题描述:
我有一个不像我想要的那样对齐的字段
这是代码
I have a search field which doesn't align like i want to Here is the code
#menu_search{
position: absolute;
width: 100%;
max-width: 1280px;
display: inline;
float: right;
right: 0px;
z-index: 99;
}
所以我希望搜索位于屏幕的右侧,但仅最多1280像素,否则保持对齐至1280像素(屏幕中心)
So i want the search to be in the right part of the screen but only for max 1280 px, otherwise to maintain the alignment to 1280px (center of screen)
------------------ -------------- 1480px -----------------------------
--------------------------------1480px-----------------------------
XXXXXX ---------------------- 1280px ---------- [search] XXXXXX
XXXXXX----------------------1280px----------[search]XXXXXX
答
检查您的 jsFiddle
HTML
check your jsFiddle
HTML
<input id="menu_search" type="text" size="20" placeholder="search here..." />
CSS
CSS
#menu_search{
position: absolute;
width: auto;
max-width: 1280px;
display: inline;
float: right;
right: 0px;
z-index: 99;
}
j-Query(库1.7.2)
j-Query (library 1.7.2)
$(function(){
$('#menu_search').keyup(function(){
var size = parseInt($(this).attr('size'));
var chars = $(this).val().length;
if(chars >= size) $(this).attr('size', chars);
});
});