亚洲视频二区_亚洲欧洲日本天天堂在线观看_日韩一区二区在线观看_中文字幕不卡一区

表單的一些元素是很難或不能設(shè)置樣式的，如單下拉框（select）、選框（radio）和復(fù)選框（checkbox）等等，它們會根據(jù)不同的系統(tǒng)、不同的主題而不同，所以有些時候它們的默認(rèn)樣式可能會與你的設(shè)計格格不入，這時候也許美化插件是個不錯的選擇。

Select-or-Die 就是一款基于 jQuery 的下拉框美化插件，你不用修改你原來的下拉框，它能夠完全無縫的對你原來的下拉框進行美化，它甚至還支持添加前綴、HTML data 屬性、鍵盤循環(huán)控制、設(shè)置高度、跳轉(zhuǎn)到鏈接以及回調(diào)函數(shù)等等。除了默認(rèn)的樣式外，Select-or-Die 還另外提供了 3 套皮膚，相信有了 Select-or-Die，你的設(shè)計會更加統(tǒng)一、美觀。

兼容

瀏覽器兼容：兼容 IE8 及以上 IE 瀏覽器和其他主流現(xiàn)代瀏覽器。

jQuery 兼容：兼容 1.7 及以上版本。

使用方法

1、引入文件

<link rel="stylesheet" href="css/selectordie.css">
<script src="js/jquery.min.js"></script>
<script src="js/selectordie.min.js"></script>

2、HTML

HTML 只需一個簡單的 select 即可，以下是演示中的代碼。

<select class="myselect">
    <option value="交互設(shè)計">交互設(shè)計</option>
    <option value="視覺設(shè)計">視覺設(shè)計</option>
    <optgroup label="開發(fā)">
        <option value="前端開發(fā)">前端開發(fā)</option>
        <option value="后端開發(fā)">后端開發(fā)</option>
    </optgroup>
    <option value="用戶研究">用戶研究</option>
    <option value="產(chǎn)品經(jīng)理">產(chǎn)品經(jīng)理</option>
</select>

或者可以使用 HTML data 自定義屬性，Select-or-Die 有如下 data 自定義屬性：

data-custom-id – 綁定 id

data-custom-class – 綁定 class

data-placeholder – 占位符

data-prefix – 添加前綴

data-cycle – 鍵盤控制是否循環(huán)

data-links – 跳轉(zhuǎn)到鏈接

data-size – 跳轉(zhuǎn)到外部鏈接

data-tabindex – 設(shè)置 tabindex

3、JavaScript

$(function(){
    $('select').selectOrDie();
});

配置