ड्रॉप डाउन स्वत: पूर्ण बॉक्स

Question

मैं jquerys autocomplete विजेट का उपयोग कर रहा हूं, लेकिन मुझे कुछ समस्याएं हैं जो आप कुछ खोजते समय ड्रॉप डाउन बॉक्स को स्टाइल करने की कोशिश कर रहे हैं।

मैं बॉक्स को थोड़ा सा स्थानांतरित करने और सीमा/बीजी रंग बदलने की कोशिश कर रहा हूं लेकिन कुछ जेएस कुछ एम्बेडेड शैलियों में जोड़ रहा है जो मेरी .css शैलियों को ओवरराइड कर रहे हैं। लेकिन मुझे यह नहीं मिल रहा है।

मैंने this one को बंद कर दिया है।

<ul class="ui-autocomplete ui-menu ui-widget-content" role="listbox" aria-activedescendant="ui-active-menuitem" style="z-index: 11; display: block; width: 139px; top: 44px; left: 1101px; "><li class="ui-menu-item" role="menuitem"> 

Answer 1

!important का उपयोग करने से बचने के लिए आप अपनी शैलियों को jQuery के साथ जोड़ सकते हैं और उन्हें इस तरह ओवरराइड कर सकते हैं।

$('ul.ui-autocomplete').css({ 
    color: 'red' 
}); 

एक और समाधान उल से शैली विशेषता को हटाने के लिए होगा। क्योंकि यह पाठ क्षेत्र में यह से निकला है के संबंध में गणना की जाती है अपने सीएसएस

top और left मूल्य ओवरराइड में margin-top और margin-left जोड़ने के लिए

$('ul.ui-autocomplete').removeAttr('style'); 

Answer 2

अपने सीएसएस शैलियों को देखने, या आपको .css फ़ाइलें लोड कर रहे हैं, तो आप Firebug का उपयोग कर निरीक्षण करने के लिए जो कक्षाओं से लागू होते हैं, और अपने मुख्य सीएसएस शैलियों को !important; जोड़कर शैलियों रद्द कर सकते थे बिना।

पूर्व।

ul.ui-autocomplete { 
color: red !important; 
} 

सबसे अच्छा तरीका है कि आप इस का मुकाबला कर सकते हैं ठीक से नीचे ट्रैक करने के लिए अगर आपके jQuery प्लगइन कोई पैरामीटर आपकी मदद कर, या जे एस खुद पट्टी और अपने खुद के सीएसएस शैलियों को जोड़ने के लिए है।

उपरोक्त! महत्वपूर्ण; नियम एक दुःस्वप्न हो सकता है, यह एक हैक में एक हैक है - लेकिन यह आपके लिए काम कर सकता है।

Answer 3

प्रयास करें, कोई अच्छा है।

Answer 4

मैं वास्तव में jQuery में एक समर्थक नहीं हूँ, लेकिन मैं उदाहरण के द्वारा भेजे जाने के चारों ओर एक नज़र रखना और मेनू की शैली सभी एक मेनू शैली पत्रक (jquery.ui.menu.css) द्वारा givent है। नीचे दिए गए लिंक को देखें और कुछ जानकारी है जो आपको सोचने में मदद कर सकती है।

http://docs.jquery.com/UI/Menu#theming

आप देखो और इन वर्ग में अपने लटकती के स्वरूप को कस्टमाइज़ करने के लिए सक्षम हो जाएगा।

jQuery वेबसाइट से «अनुकूलन के एक गहरे स्तर की जरूरत है, वहाँ। jquery.ui.menu.css स्टाइलशीट कि संशोधित किया जा सकता भीतर संदर्भित विजेट विशिष्ट वर्ग हैं»।

Answer 5

स्थिति का उपयोग करने का प्रयास करें या विकल्प में संलग्न करें ... आप यहां देख सकते हैं ...

http://jqueryui.com/demos/autocomplete/#option-position

Answer 6

बाहर की जाँच करें फ़ाइल jquery.ui.theme.css,

वर्ग .ui-widget-content शीर्ष के निकट स्वत: पूर्ण खोज परिणाम बॉक्स पर एक पृष्ठभूमि रंग डाल करने के लिए इस्तेमाल किया जा सकता, सीमाओं और स्थिति भी इस वर्ग के माध्यम से बदलाव किया जा सकता है ।