JQueryUI kaydırıcısını özelleştirmek istedim, ancak kaydırma çubuğu tutamaçlarını değiştirmenin herhangi bir yolunu bulamıyorum. JQuery Themeroller ayrıca, sap görüntülerinin değiştirilmesine izin vermiyor gibi görünüyor. Birisi bunu nasıl yapacağını biliyor mu? jQuery UI docs itibarenDeğişen Sürgü kolu resmi
:
jQuery UI Slider eklentisi renk ve arka plan dokular dahil olmak üzere, göz stil ve hissetmek jQuery UI CSS Framework kullanır. oluşturmak için ThemeRoller aracını kullanarak 'u öneririz ve 'un kurulumu ve bakımı kolay olan özel temaları indirin. özelleştirme daha derin bir düzeyde gerekli ise
, modifiye olabilir ui.slider.css stil sayfası içindeki başvurulan Widget özgü sınıflar vardır. Bu sınıflar, aşağıda kalın harflerle vurgulanmış numaralı broşürlerdir. Bu özel durumda
, sen classname
ui-slider-handle ile eleman bakmak istiyorum.
varsayılan kaydırıcı kolu elemanı aşağıdaki classnames uygulanmış etti:
Bu sınıf isimlerine karşılık gelen CSS'ye bir göz atın ve muhtemelen ihtiyacınız olan her şeyi düzenleyebileceksiniz.
Ayrıca, Firebug'u yüklemenizi öneririm. Bu Firefox eklentisi, bu gibi görevleri sizin için çok daha kolay hale getirecektir. işte örnek css kodu için yorum bölümüne sorulan
#demo-frame > div.demo {
padding: 10px !important;
float: left;
}
.contentContainer {
float: left;
width: 400px;
height: 500px;
overflow: hidden;
}
.ui-slider-vertical .ui-state-default {
border: none;
width: 28px;
height: 82px;
background: transparent url(volume_bar/shattle.png) no-repeat 0 0;
}
.ui-slider-vertical .ui-slider-handle {
left: 0;
margin-bottom: -41px;
margin-left: 0;
}
.ui-slider-range, .ui-widget-header, .ui-slider-range-min {
background: none;
}
#slider-vertical, .ui-slider {
border: none;
width: 50px;
height: 50px;
background: transparent url(volume_bar/track-bg.png) repeat-y 0 0;
}
birisi benim kendi gümrük png görüntü dosyaları için kolu ve kaydırma çubuğu arka plan görüntüsünü değiştirmek için kullanılan biri. Başlık kısmındaki jquery ui css öğesinden SONRA CSS'yi taktığınızdan emin olun.
Kaydırıcı tutamacı için bir görüntüye başvuru bulamıyorum. Daha da kötüsü,/image klasöründeki tanıtıcı imajını bile bulamıyorum! - Şu anda tutamaçların nereden geldiğine dair hiçbir ipucu yok! –
tamam, son olarak mevcut tutamaçları oluşturan genişlik/uzunluk/köşe özelliklerini buldu. Ayrıca arka plan resmini de değiştirebilirim. Bence şimdi çalışmalı. –
@Crimson - Eğer zamanınız varsa, bu sorunun cevabında tutamak görüntüsünü değiştirmek için kullandığınız CSS'yi yerleştirirseniz harika olur. Aynı sorunu yaşıyorum ama çalışan herhangi bir CSS alamıyorum. – Tom