過了兩天完全沒有電腦,沒有電視,手機(jī)又沒有流量的生活,習(xí)慣了那樣喧囂的節(jié)奏,再回到那么清凈的環(huán)境,不啻于一次洗滌,同時卻有些惶恐,好像自己又什么都不會了,如果脫離了這個文明的社會,甚至可以說,我連基本的生存能力都沒有,如果......
以下是【金聰采編】分享的內(nèi)容全文:
過了兩天完全沒有電腦,沒有電視,手機(jī)又沒有流量的生活,習(xí)慣了那樣喧囂的節(jié)奏,再回到那么清凈的環(huán)境,不啻于一次洗滌,同時卻有些惶恐,好像自己又什么都不會了,如果脫離了這個文明的社會,甚至可以說,我連基本的生存能力都沒有,如果回到過去,我不知道能活多久。
感慨歸感慨,當(dāng)前的工作要完成,記錄一個html5中的input新屬性,range。發(fā)現(xiàn)這個屬性是在一個網(wǎng)站的調(diào)色器中,感覺確實比較形象化,好看,就記錄下了:
<input type="range" min="0" max="255">
<input type="text" id="show">
顯示效果如下:
這里看到了type的兩個屬性 min和max,允許的最小范圍和最大范圍。同時我們還可以對這個range進(jìn)行樣式的設(shè)計
<input type="range" min="0" max="255" style="height:100px;width:400px;background:yellow;" onchange="change()" id="range">
<input type="text" id="show">
顯示效果如下:
這樣我們來寫一個js方法,來改變數(shù)值,調(diào)色器中就這么應(yīng)用的:(至于這個移動鈕樣式如何改變了還不太明白)
<script type="text/javascript">
function change(){
var num=document.getElementById("range");
var location=document.getElementById("show");
location.value=num.value;
}
</script>
這樣就隨著拖動位置的變化就改變了輸入框中的值,放置三個的話就能生成顏色了嘛,這就是調(diào)色器的原理了
這里還要注意的就是range的其他兩個屬性value默認(rèn)值和step改變幅度
調(diào)色器看起來不錯的,回頭要弄個看看,現(xiàn)在先去睡覺。
金聰線報提示:[
html5中的input新屬性range使用記錄 ] 僅為
會員分享,分享目的如下:
1.軟件源碼推廣展示:目的展示軟件相關(guān)功能,接收技術(shù)學(xué)習(xí)者測試、測評;
2.教程課程信息展示:展示課程信息,傳授課程各階段內(nèi)容;
3.設(shè)計素材圖片展示:展示素材設(shè)計理念、思維方式、傳播設(shè)計理念;
4.福利優(yōu)惠信息展示:分享各類最新的福利信息,各種優(yōu)惠信息展示;
以上分享目的僅供學(xué)習(xí)、參考使用,請勿用于其他用途,如果想商業(yè)使用或者代理,請自行聯(lián)系版權(quán)方獲取授權(quán)。任何未獲取授權(quán)的商業(yè)使用與本站無關(guān),請自行承擔(dān)相應(yīng)責(zé)任。
本站不存儲任何資源文件,敬請周知!
此資源僅供個人學(xué)習(xí)、研究使用,禁止非法轉(zhuǎn)播或商業(yè)用途,請在獲取后24小時內(nèi)刪除,如果你覺得滿意,請尋求購買正版或獲取授權(quán)!
如果您認(rèn)為本頁信息內(nèi)容侵犯了您的相關(guān)權(quán)益(包含但不限于:著作權(quán)、首發(fā)權(quán)、隱私權(quán)等權(quán)利),或者您認(rèn)為自己是此信息的權(quán)利人但是此信息不是自己發(fā)布的,可以直接
版權(quán)舉報投訴,我們會根據(jù)網(wǎng)站注冊協(xié)議、資源分享協(xié)議等協(xié)議處理,以保護(hù)您的合法權(quán)益。
免責(zé)申明:本站僅提供學(xué)習(xí)的平臺,所有資料均來自于網(wǎng)絡(luò)分享線索,版權(quán)歸原創(chuàng)者所有!本站不提供任何保證,并不承擔(dān)任何法律責(zé)任,如果對您的版權(quán)或者利益造成損害,請?zhí)峁┫鄳?yīng)的資質(zhì)證明,我們將于3個工作日內(nèi)予以處理。
版權(quán)申訴相關(guān)說明
本網(wǎng)站采用
BY-NC-SA 協(xié)議進(jìn)行授權(quán) 轉(zhuǎn)載請注明原文鏈接:
html5中的input新屬性range使用記錄