एक ऊर्ध्वाधर स्लाइडर HTML तत्व

मैं अपने खुद के HTML तत्व है कि इस तरह दिखता है बनाने के लिए कोशिश कर रहा हूँ बनाना:एक ऊर्ध्वाधर स्लाइडर HTML तत्व

देखो मैं बनाना चाहते हैं: I am trying to create this look मेरे प्रयास: My attempt at replication

विजेट केवल एक के लिए है वेबसाइट & का आईपैड संस्करण दुर्भाग्य से JQuery का उपयोग नहीं कर सकता।

मेरी समस्या: मैं विजेट में एक स्लाइडर/तीर जोड़ने की कोशिश कर रहा हूं लेकिन मुझे नहीं पता कि कैसे? क्या कोई वेबकिट उपस्थिति है जिसमें उस पर एक तीर स्लाइडर है? क्या विजेट पर स्लाइडर तीर होना संभव है?

मेरे कोड:

<div style="background-color: rgb(191, 326, 383); width: 200px;"> 
    <ul style="list-style: none; -webkit-appearance: slider-vertical; width: 200px; height: 300px; margin: 0;"> 
     <li>jddsjh -</li> 
     <li>jddsjh -</li> 
     <li>jddsjh -</li> 
     <li>jddsjh -</li> 
    </ul> 
</div>

स्रोत

2012-01-02 Jake M

आप jQuery का उपयोग क्यों नहीं कर सकते हैं? आपको हैंडल के लिए एक संपत्ति बनाना होगा या सीएसएस के साथ एक प्रस्तुत करना होगा, लेकिन मेरे ज्ञान के लिए इसके लिए वेबकिट-उपस्थिति नहीं है। इसे कार्यात्मक बनाने के लिए आपको अनिवार्य रूप से jQuery UI के ड्रैगगेबल() को फिर से लिखना होगा। निषिद्ध रूप से मुश्किल नहीं है लेकिन कुछ ऐसा नहीं है जिसके बारे में मैं उत्साहित हूं। –

क्या आप इस तरह कुछ ढूंढ रहे हैं: http://jsfiddle.net/XyJWa/ – henryaaron

@ user1090389 सही है, आपको एक उत्तर देना चाहिए ताकि मैं स्वीकार कर सकूं। पता नहीं है कि यह कैसे काम करता है लेकिन इसकी मुझे क्या चाहिए: पी –

input[type="range"] { 
 
    position:absolute; 
 
    -webkit-transform: rotate(90deg); 
 
    top:100px; 
 
    
 
}

<input type="range">

स्रोत

2012-01-02 02:31:13 henryaaron

पर अजीब प्रस्तुत करता है बस आपके उत्तर का पूरक है, आप नियंत्रण भी शैली कर सकते हैं: http://jsfiddle.net/Wv6cU/ – Duopixel

एक ऊर्ध्वाधर स्लाइडर HTML तत्व

उत्तर

संबंधित मुद्दे