इस विषय पर एक jQueryUI संवाद बॉक्स

के लिए बंद करें आइकन की जगह व्यापक खोज के बाद, मैं एक जवाब खोजने के लिए नहीं कर पाए हैं, इसलिए उम्मीद है कि कोई इस मुद्दे के साथ मेरी मदद कर सकते हैं।इस विषय पर एक jQueryUI संवाद बॉक्स

$("#dialog-search").dialog({ 
    resizable: false, 
    height:dimensionData.height, 
    width: dimensionData.width, 
    modal: true, 
    title: dimensionData.title, 
    position: [x,y], 
    open: function() { 
     $("#dialog-search .dateField").blur(); 
    }, 
    close: function(event, ui){ 
     callBack(event,ui); 
    } 
});

मुझे क्या करना चाहते हैं ui (यूआई आइकन-ऋण) द्वारा प्रदान की एक अलग चिह्न के साथ X आइकन (यूआई आइकन-पास) की जगह है, इसलिए है कि: मैं एक अपेक्षाकृत बुनियादी संवाद बॉक्स है माइनस आइकन पर क्लिक करने से इसके बजाय संवाद बंद हो जाता है। मैंने आइकन को छिपाने के तरीके पर पोस्ट किया है या सीएसएस में एक कस्टम छवि के साथ इसे प्रतिस्थापित किया है, लेकिन मुझे अभी तक समान कार्यक्षमता करने के लिए आइकन को किसी अन्य आइकन से प्रतिस्थापित करने का कोई तरीका नहीं मिला है।

संपादित करें: मैं भी कस्टम व्यवहार/स्थान जोड़कर अपने संवाद बॉक्स में एक अलग कार्यक्षमता के लिए ui-icon-close का उपयोग करने में सक्षम होना चाहता हूं, लेकिन यह इस प्रश्न के दायरे से बाहर हो सकता है। अगर यह एक संबंधित समाधान है, तो इसे संबोधित करने के लिए स्वतंत्र महसूस करें।

स्रोत

2011-10-26 Axle

संवाद की संरचना को देखने के लिए प्रयास करें और यह यह करने के लिए मुश्किल नहीं होना चाहिए।

http://jqueryui.com/demos/dialog/#theming

उपयोग create घटना एक और आइकन करेंगे के वर्ग के करीब बटन आइकन के वर्ग बदलने के लिए।

http://jsfiddle.net/Quincy/kHU2M/1/

$("#dialog-search").dialog({ 
    create: function(event, ui) { 
     var widget = $(this).dialog("widget"); 
     $(".ui-dialog-titlebar-close span", widget) 
      .removeClass("ui-icon-closethick") 
      .addClass("ui-icon-minusthick"); 
    } 
});

स्रोत

2011-10-27 01:34:55 Quincy

धन्यवाद, मैं इस बाहर की जाँच करेंगे। यह वास्तव में निराशाजनक है कि जावास्क्रिप्ट इतना उलझन में है कि आपको एक साधारण छवि प्रतिस्थापन को पूरा करने के लिए बस कक्षा को हटाना और जोड़ना है। – Axle

लेकिन मैं अपनी खुद की छवि कैसे जोड़ूं? केवल एक सीएसएस-क्लास बनाने के लिए जो पृष्ठभूमि-छवि का उपयोग करता है: ... वास्तव में काम नहीं करता है, यह सिर्फ पूरी चीज़ को गड़बड़ कर देता है। क्या एक्स को एक्सचेंज करने के लिए कोई और ट्यूटोरियल है, पूरी तरह से "निर्मित" छवियों में से एक नहीं? और प्राथमिक रूप से बड़ा। – Ted

@Ted मैंने कस्टम छवि के साथ एक और जवाब जोड़ा है। – udalmik

पुराना सवाल, लेकिन शायद मैं किसी को मदद करेंगे। CSS के बाद मेरे लिए चाल बनाई गई, पूरी तरह से कस्टम Close बटन यूआई। बहुत सुंदर नहीं :), लेकिन मेरे लिए ठीक काम करता है।

.ui-icon-closethick { 
    background-image: url(images/my-10px-image.png) !important; 
    background-position: left top !important; 
    margin: 0 !important; 
} 

.ui-dialog .ui-dialog-titlebar-close, .ui-icon-closethick { 
    width: 10px !important; 
    height: 10px !important; 
} 

.ui-dialog .ui-dialog-titlebar-close { 
    background: none !important; 
    border: none !important; 
} 

.ui-dialog .ui-dialog-titlebar-close, .ui-dialog .ui-dialog-titlebar-close:hover { 
    padding: 0 !important; 
}

मेरे कस्टम बंद करें बटन पर गौर करें:

स्रोत

2013-03-04 14:56:22 udalmik

इस विषय पर एक jQueryUI संवाद बॉक्स

उत्तर

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