這邊告訴你怎麼做
Bootstrap官網範例
首先在css的地方要先設置
input,textarea
{
border:1px solid;
border-color:rgb(200,200,200);
border-radius:5px;
color:rgb(85,85,85);
letter-spacing:1px;
outline: none;
padding:3px;
}
input
{
line-height:23px;
height:25px;
}
textarea
{
resize: none; /*選擇性要不要用*/
}
接著你需要以下兩個js檔案,放在
<head>
的tag裡面
然後寫一段script,可以放在
</body>
這個tag之前
<script>
$(document).ready(function(){
$("input, textarea").stop().focus(function(){
$(this).stop().animate({
borderTopColor:"rgb(116,185,239)",
borderLeftColor:"rgb(116,185,239)",
borderRightColor:"rgb(116,185,239)",
borderBottomColor:"rgb(116,185,239)",
boxShadow:"0 0 4px rgba(116,185,239,0.5)"
},"fast");
});
$("input, textarea").blur(function(){
$(this).stop().animate({
borderTopColor:"rgb(210,210,210)",
borderLeftColor:"rgb(210,210,210)",
borderRightColor:"rgb(210,210,210)",
borderBottomColor:"rgb(210,210,210)",
boxShadow:"none"
},"fast");
});
});
</script>
將將!完成了跟bootstrap一樣的美妙輸入框摟