<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>jquery自定义表单控件 - 网页模板</title>
<link rel="stylesheet" type="text/css" href="main.css" />
<link rel="stylesheet" type="text/css" href="jniceit.css" />
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jniceit.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('form.NiceIt').NiceIt();
});
</script>
</head>
<body>
<!-- Page -->
<div id="page">
<h1>jquery自定义表单控件</h1>
<div class="left-column">
<h2>Before</h2>
<form action="#" method="post" class="fm">
<p>
<label for="iemail">Text Input Field: *</label>
<input type="text" id="iemail" name="email" value="sc@moobnn.com" title="sc@moobnn.com" />
</p>
<div class="ctrls-set">
<p>
<input type="radio" name="gender" value="male" id="radio_1" checked="checked" />
<label for="radio_1">Radio Button 1</label>
</p>
<p>
<input type="radio" name="gender" value="female" id="radio_2" />
<label for="radio_2">Radio Button 2</label>
</p>
<p>
<input type="radio" name="gender" value="other" id="radio_3" disabled="disabled" />
<label for="radio_3">Radio Button (disabled)</label>
</p>
<p>
<input type="checkbox" name="remember" value="1" id="cbx_1" />
<label class="align" for="cbx_1">Checkbox</label>
</p>
<p>
<input checked="checked" disabled="disabled" type="checkbox" name="i_like_it" value="1" id="cbx_2" />
<label class="align" for="cbx_2">Checkbox (disabled)</label>
</p>
</div>
<p>
<label for="impr">Textarea (disabled):</label>
<textarea id="impr" name="impressions" cols="5" rows="5" disabled="disabled">The plugin does not use absolute positioning for skinned controls and it is fully compatible with fluid layouts.</textarea>
</p>
<p>
<label for="items">Select box control:</label>
<select name="items" id="items">
<option value="val_1">Value 1</option>
<option value="val_2">Value 2</option>
<option value="val_3">Value 3</option>
<option value="val_4">Value 4</option>
<option value="val_5">Value 5</option>
<option value="val_6">Value 6</option>
<option value="val_7">Value 7</option>
<option value="val_8">Value 8</option>
<option value="val_9">Value 9</option>
<option value="val_10">Value 10</option>
</select>
</p>
<p>
<label for="disabled_inp">Input (disabled):</label>
<input type="text" name="disabled_inp" id="disabled_inp" value="I can't type there" disabled="disabled" />
</p>
<p>
<label for="ia">File upload field (disabled):</label>
<input disabled="disabled" type="file" name="at" title="..." id="ia" />
</p>
<p>
<label for="details">Textarea:</label>
<textarea id="details" name="details" cols="5" rows="5"></textarea>
</p>
<p>
<label for="iattach">File upload field:</label>
<input type="file" name="attachment" title="Choose ..." id="iattach" />
<input type="hidden" name="MAX_FILE_SIZE" value="100000" />
</p>
<p class="buttons">
<button type="submit">Submit</button>
<button type="reset">Reset</button>
<input type="hidden" name="redirect" value="http://www.moobnn.com" />
</p>
<div class="relax"></div>
</form>
<div class="relax"></div>
</div>
<div class="right-column">
<h2>After</h2>
<form action="" method="post" class="fm NiceIt">
<p>
<label for="tiemail">Text Input Field: *</label>
<input type="text" id="tiemail" name="email" value="sc@moobnn.com" title="sc@moobnn.com" />
</p>
<div class="ctrls-set">
<p>
<input type="radio" name="gender" value="male" id="tradio_1" checked="checked" />
<label for="tradio_1">Radio Button 1</label>
</p>
<p>
<input type="radio" name="gender" value="female" id="tradio_2" />
<label for="tradio_2">Radio Button 2</label>
</p>
<p>
<input type="radio" name="gender" value="other" id="tradio_3" disabled="disabled" />
<label for="tradio_3">Radio Button (disabled)</label>
</p>
<p>
<input type="checkbox" name="remember" value="1" id="tcbx_1" />
<label class="align" for="tcbx_1">Checkbox</label>
</p>
<p>
<input checked="checked" disabled="disabled" type="checkbox" name="i_like_it" value="1" id="tcbx_2" />
<label class="align" for="tcbx_2">Checkbox (disabled)</label>
</p>
</div>
<p>
<label for="timpr">Textarea (disabled):</label>
<textarea name="impressions" cols="5" rows="5" id="timpr" disabled="disabled">The plugin does not use absolute positioning for skinned controls and it is fully compatible with fluid layouts.</textarea>
</p>
<p>
<label for="titems">Select Box Control:</label>
<select name="items" id="titems">
<option value="val_1">Value 1</option>
<option value="val_2">Value 2</option>
<option value="val_3">Value 3</option>
<option value="val_4">Value 4</option>
<option value="val_5">Value 5</option>
<option value="val_6">Value 6</option>
<option value="val_7">Value 7</option>
<option value="val_8">Value 8</option>
<option value="val_9">Value 9</option>
<option value="val_10">Value 10</option>
</select>
</p>
<p>
<label for="tdisabled_inp">Input (disabled):</label>
<input type="text" name="disabled_inp" id="tdisabled_inp" value="I can't type there" disabled="disabled" />
</p>
<p>
<label for="tia">File upload field (disabled):</label>
<input disabled="disabled" type="file" name="at" title="..." id="tia" />
</p>
<p>
<label for="tdetails">Textarea:</label>
<textarea id="tdetails" name="details" cols="5" rows="5"></textarea>
</p>
<p>
<label for="tiattach">File upload field:</label>
<input type="file" name="attachment" title="..." id="tiattach" />
<input type="hidden" name="MAX_FILE_SIZE" value="100000" />
</p>
<p class="buttons">
<button type="submit">Submit</button>
<button type="reset">Reset</button>
<input type="hidden" name="redirect" value="http://www.moobnn.com" />
</p>
<div class="relax"></div>
</form>
<div class="relax"></div>
</div>
<div class="relax"></div>
</div>
<div style="text-align:center;clear:both">
<p>适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. </p><br>
<p>来源:<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p>
</div>
</body>
</html>
没有合适的资源?快使用搜索试试~ 我知道了~
jquery自定义表单控件.zip
共33个文件
gif:27个
css:2个
js:2个
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
0 下载量 60 浏览量
2022-11-24
12:30:47
上传
评论
收藏 103KB ZIP 举报
温馨提示
jquery自定义表单控件.zip
资源推荐
资源详情
资源评论
收起资源包目录
jquery自定义表单控件.zip (33个子文件)
jquery自定义表单控件
jiaoben420
images
jniceit
textarea-tl.gif 15KB
textarea-blc.gif 97B
input-box-left-focus.gif 385B
input-box-right-focus.gif 167B
button-left.gif 2KB
input-box-right.gif 170B
checkbox.gif 14KB
select-box-right.gif 352B
button-submit-left.gif 2KB
textarea-br.gif 15KB
textarea-tl-focus.gif 2KB
input-box-right-disabled.gif 167B
file-input-left-focus.gif 385B
select-box-left.gif 447B
input-box-left.gif 382B
select-box-left-focus.gif 447B
file-input-right.gif 338B
file-input-button-hover.gif 93B
radiobutton.gif 14KB
file-input-right-hover.gif 337B
file-input-left-disabled.gif 346B
file-input-button.gif 146B
input-box-left-disabled.gif 346B
file-input-left.gif 382B
textarea-trc.gif 94B
button-right.gif 646B
button-submit-right.gif 659B
jquery-1.3.2.js 56KB
index.html 7KB
jniceit.css 9KB
jniceit.js 15KB
main.css 2KB
jquery自定义表单控件.jpg 57KB
共 33 条
- 1
资源评论
芝麻粒儿
- 粉丝: 5w+
- 资源: 2万+
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功