如何替换select2默认微调器？

Question

如何替换select2 spinner.gif？

我尝试过下一个css：

.select2-container-multi .select2-choices .select2-search-field input.select2-active {
   background: #fff url('custom-spinner.gif') no-repeat 100% !important;
   background: #fff url('custom-spinner.gif') no-repeat 100% !important;
 }

这是截图：

我没有用select2-spinner.gif

替换默认的spinner1-gif

这是css https://github.com/ivaynberg/select2/blob/master/select2.css

Answer 1

这是select2.css版本3.3.1中'spinner.gif'的每个实例。复制它，更改文件路径的每个实例，并将其放在 select2.css之后加载的样式表中。

.select2-search input.select2-active {
    background: #fff url('select2-spinner.gif') no-repeat 100%;
    background: url('select2-spinner.gif') no-repeat 100%, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee));
    background: url('select2-spinner.gif') no-repeat 100%, -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%);
    background: url('select2-spinner.gif') no-repeat 100%, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%);
    background: url('select2-spinner.gif') no-repeat 100%, -o-linear-gradient(bottom, white 85%, #eeeeee 99%);
    background: url('select2-spinner.gif') no-repeat 100%, -ms-linear-gradient(top, #ffffff 85%, #eeeeee 99%);
    background: url('select2-spinner.gif') no-repeat 100%, linear-gradient(top, #ffffff 85%, #eeeeee 99%);
}

.select2-more-results.select2-active {
    background: #f4f4f4 url('select2-spinner.gif') no-repeat 100%;
}

.select2-container-multi .select2-choices .select2-search-field input.select2-active {
    background: #fff url('select2-spinner.gif') no-repeat 100% !important;
}