jQuery UI तत्व बहुत बड़ी

यहाँ विचाराधीन पृष्ठ है: http://bit.ly/m5cyjx jQuery UI तत्व बहुत बड़ी

शायद ही कोई कोड या स्टाइल नहीं है। ऐसा लगता है कि jQuery यूआई तत्व (इस मामले में - मेनू & बटन का चयन करें) बहुत अधिक हैं। डिफ़ॉल्ट रूप से वे बहुत कम होना चाहिए, इस वाक्य की अधिकतम ऊंचाई से कहीं ज्यादा नहीं।

मैंने अपनी वेबसाइट से सीधे jQuery UI सीएसएस लिया है, और मैंने इसी तरह से प्रोजेक्ट निर्माता की वेबसाइट से jQuery चयन मेनू सीएसएस लिया है। डिफ़ॉल्ट कोड के साथ भी, समस्या में कोई बदलाव नहीं है।

कोई मदद?

संपादित करें इसके अलावा, चयन मेनू के दाईं ओर कोई तीर नहीं है, क्योंकि डिफ़ॉल्ट रूप से होना चाहिए। परियोजना पृष्ठ पर एक नज़र डालें: आकार को नियंत्रित करने http://www.filamentgroup.com/lab/jquery_ui_selectmenu_an_aria_accessible_plugin_for_styling_a_html_select/

स्रोत

2011-06-13 AKor

आप किस ब्राउज़र का उपयोग कर रहे हैं:

यह अंत में चाल किया था? यह फ़ायरफ़ॉक्स में मुझे ठीक लग रहा है 4. –

आपको एक सीएसएस रीसेट जोड़ना चाहिए ताकि आकार ब्राउज़र डिफ़ॉल्ट पर निर्भर न हो (विशेष रूप से जब से jQuery UI स्टाइलशीट "em" का उपयोग करता है) – kei

आपके अधिकांश मुद्दों का विश्लेषण करके आसानी से हल किया जा सकता है फ़ायरबग (मोज़िला फ़ायरफ़ॉक्स में) या डेवलपर टूल्स (Google क्रोम में) क्या प्रदर्शित कर रहे हैं। यह आपके वर्तमान स्टाइल + कस्टम jQuery यूआई स्टाइल + आवश्यक छवियों की कमी इत्यादि का संयोजन है। – Tadeck

यह निम्न स्टाइल (style.css, लाइन # 10) की वजह से है:

#main { 
    margin-top: 25px; 
    text-align: center; 
    font-size: 25px; 
}

आप में फ़ॉन्ट के लिए बहुत बड़ा आकार है #main, और क्योंकि jQuery UI सही ढंग से अन्य शैलियों को विरासत में लेता है, बटन भी बड़े होते हैं।

बदलें में ऊपर स्निपेट के और बेहतर (कम से कम बटन पर) दिखेगा:

#main { 
    margin-top: 25px; 
    text-align: center; 
    font-size: 10px; 
}

स्रोत

2011-06-13 17:06:49 Tadeck

मैंने इसके साथ गड़बड़ करने की कोशिश की, लेकिन यह इस रूप में कभी नहीं पहुंचता: http://jqueryui.com/demos/button/ मैंने भी मेरी सभी स्टाइलशीट निकालने का प्रयास किया, और यह अभी भी उदाहरण के करीब नहीं दिखता है। – AKor

@ सेनेहिसर बटन पर कौन सी शैलियों को लागू किया गया है और इस तरह की समस्या की जांच करने के लिए फ़ायरबग (फ़ायरफ़ॉक्स में) या डेवलपर टूल्स (Google क्रोम में) का उपयोग करें। बटन के आकार के साथ समस्या को आपके द्वारा प्रदान किए गए फ़िक्स द्वारा आसानी से हल किया जा सकता है। यदि आपके पास कोई अतिरिक्त प्रश्न है, तो कृपया मुझे बताएं। – Tadeck

टेडेक - मेरा मुद्दा यह है कि बिना किसी कस्टम शैलियों के, बटन jQuery UI वेबसाइट पर उनके मुकाबले बहुत अलग दिखाई देते हैं। – AKor

दो सीएसएस नियम हैं

लाइन jQuery-ui.css की 424

input.ui-button { 
    padding: .4em 1em; 
}

और jQuery-ui.css

रेखा 59

.ui-widget { 
    font-family: Segoe UI, Arial, sans-serif; 
    font-size: 1.1em; 
}

पैडिंग और फ़ॉन्ट-आकार समायोजित करें जब तक कि ऐसा लगता है कि आप इसे कैसे देखना चाहते हैं।

स्रोत

2011-06-13 17:06:14

यूई-विजेट क्लास को हटा दें।

मुझे लगता है कि पैटर्न है

<div class="ui-widget"> 
    <div class="ui-widget-header"> 
    </div> 

    <div class="ui-widget-content"> 
    //your button could go here 
     <div class="ui-button">click me</div> 
    </div> 
</div>

स्रोत

2011-06-13 17:06:46 orolo

मैंने पाया कि वहाँ यूआई पन्नों में वे इस सीएसएस कोड है:

शरीर { फ़ॉन्ट आकार: 62.5%; }

इसलिए वे अपने फ़ॉन्ट आकार को भारी रूप से स्केल कर रहे हैं। इसे अपने पृष्ठ में डालने से समस्या हल हो सकती है, यह मेरे लिए काम करता है।

स्रोत

2011-07-01 02:34:29 steve

थीमरोलर थीम के अधिकांश रूपांतरण करने में सक्षम होने के लिए ऐसा करते हैं: '1em = 10px' https : //forum.jquery.com/topic/adjust-button-size#14737000000744502 – m33lky

हाँ। मुझे नहीं पता कि यह JQuery UI में डिफ़ॉल्ट क्यों है। मुझे नहीं लगता कि कोई भी बड़ा बटन चाहता है।

यहां मैं इसे कैसे हल करता हूं। एचटीएमएल फाइल के < हेड > में इसे जोड़ें।

<style type="text/css"> 
    /* make default button size sane */ 
    .ui-button-text { 
     font-size: .6em; 
    } 
</style>

स्रोत

2011-09-30 00:47:11 TrophyGeek

निश्चित रूप से सबसे आसान समाधान। अच्छी तरह से काम! – olofom

बहुत बहुत धन्यवाद! – MirlvsMaximvs

मैं सिर्फ यह भूल गए हैं, लेकिन अपने उद्घाटन HTML टैग से पहले अपने दस्तावेज़

<!DOCTYPE html> 
<html> 
    <body> 
    </body> 
</html>

को DOCTYPE html जोड़ने का प्रयास हुआ।

स्रोत

2012-10-03 13:44:07 Michael

@Tadeck मुझे एक समान समस्या थी, और फ़ॉन्ट आकार बदलना चाल था :) धन्यवाद!

भी, मैंने इसे पढ़ने से पहले, मैं यह देखने की कोशिश कर रहा था कि आंतरिक सामग्री के फ़ॉन्ट आकारों को बदलना क्या है, लेकिन कारणों से मैं नीचे वर्णित हूं।

स्क्रिप्ट कॉल jQuery टैब टैब

$(function() { 
    $("#tabs").tabs(); 
});

मार्कअप स्क्रिप्ट टैब

का निर्माण करने की जरूरत है बनाने के लिए कार्य करते हैं (तो मैं क्या किया! = पी नहीं करते)

<div id="content-wrapper"> 
    <div id="tabs"> 
    <ul> 
     <li><a href="#tabs-main">Dashboard</a></li> 
     <li><a href="#tabs-stuff"> Other Stuff </a></li> 
    </ul> 
    <div id="tabs-main"> 
     <!-- where i put unformatted content, like headers and description paragraphs --> 
     <div> formatted inner content here (for graphs/visual content/tables/etc) </div> 
    </div> 
    <div id="tabs-stuff"> 
     <!-- where i put unformatted content, like headers and description paragraphs --> 
     <div> formatted inner content here (for graphs/visual content/tables/etc) </div> 
    </div> 
</div> 
</div>

प्रत्येक टैब div के अंदर divs के लिए शैली इनलाइन सेट करने से बाहर निकलता है टैब के आकार को नहीं बदलता है। मुझे cui फ़ाइल में .ui-widget class के लिए फ़ॉन्ट आकार बदलना था जो मैंने jQuery UI थीम से जेनरेट किया था। और यूआई की स्टाइलशीट को बदलना वास्तव में जरूरी नहीं है क्योंकि आप अपनी कस्टम थीम डाउनलोड करने से पहले jQuery थीम रोलर के लिए साइट पर फ़ॉन्ट आकार सेट कर सकते हैं। मैं बस ऐसा करना भूल गया। मैं इसे अपने अधिक गंदे क्षणों में से एक तक चॉक करूंगा।

[संपादित करें] यह स्पष्ट रूप से एक यूआई बटन के लिए नहीं था, लेकिन इसी तरह की अवधारणा और मुद्दों लागू

स्रोत

2013-11-07 18:15:49

मैं इस समस्या हो रही थी .. मेरी स्पिनर नियंत्रण, बदसूरत विशाल, और बजाय एक क्षैतिज में बाहर रखी थे खड़ी खड़ी ...

मैं अपने गुरु html फ़ाइल को देख करने के लिए (वास्तव में एक उस्तरा MVC लेआउट फ़ाइल) हो गया और देखा मैं

/themes/base/jquery.ui.spinner.css शामिल करने के लिए की जरूरत
अब मेरे स्पिनर बहुत अच्छे लग रहे हैं!

स्रोत

2014-03-14 16:40:22 bkwdesign

मैंने अन्य सभी उत्तरों की कोशिश की, लेकिन कोई भी ठीक से काम नहीं कर रहा था। कुछ ने कुछ भी नहीं बदला और कुछ प्रतिकूल दुष्प्रभाव थे (जैसे सबकुछ नीचे स्केल करना)।

.ui-widget 
 
{ 
 
\t font-size: 75%; 
 
}

स्रोत

2015-11-28 20:42:22

jQuery UI तत्व बहुत बड़ी

उत्तर

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