jqueryui संवाद स्थिति




html css (6)

मैं JQuery UI का उपयोग कर रहा हूं और अपने संवाद को क्षैतिज रूप से केन्द्रित करना चाहता हूं लेकिन लंबवत रूप से केंद्र से ऊपर, शायद निश्चित मात्रा में पिक्सल या पृष्ठ के शीर्ष से एक सापेक्ष दूरी से। क्या इसे करने का कोई आसान तरीका है? ऐसा लगता है कि केवल कुछ पूर्व परिभाषित मान हैं या मैं एक सटीक स्थिति का उपयोग कर सकता हूं लेकिन क्या इसे पूरा करने का कोई आसान तरीका है?

 $("#dialog-form").dialog({
                autoOpen: false,
                width: 630,
                position: 'center',
                modal: true,
                resizable: false,
                closeOnEscape: false

            });

अपने # संवाद-फॉर्म उपयोग% नमूना में सीएसएस लागू करें

अगर चौड़ाई = 1000

डाल

बाएं: 50% मार्जिन-बाएं: -500 पीएक्स;

इसे केंद्रित करने के लिए। या आप iframe का उपयोग कर सकते हैं।


इसे इस्तेमाल करे:

    position: {
        my: 'top',
        at: 'top',
        of: $('#some-div')
    },

मैं फिट करने के लिए Exlord के जवाब समायोजित किया।

स्थिति: ['केंद्र -7%', 'केंद्र -12%']

यह क्षैतिज और लंबवत समायोजित करता है

$(".popup").dialog({    
position: ['center-7%', 'center-12%'],
title: 'Updating',
    width: "auto",
}
});

यदि कोई लिंक बना रहा है जो एक लिंक इवेंट हैंडलर वाले लिंक क्लास के कारण एक jQuery संवाद खोलता है, तो आप देख सकते हैं कि यह पृष्ठ के शीर्ष पर जा सकता है लेकिन पृष्ठ को गहराई से मोडल डायलॉग बना सकता है और आपको स्क्रॉल करना होगा यह।

अगर कोई भी jQuery संवाद को शीर्ष पर कूदने से रोकने की कोशिश कर रहा है, तो उसे क्लिक किए गए लिंक के पास रहने के लिए चाहते हैं, बस href हटा दें। लगभग इसे हल करने की कोशिश कर पागल हो गया। एचटीएमएल 5 विनिर्देश स्पष्ट रूप से href="" या href="#" को शीर्ष पर जाने का मतलब समझता है।


विंडो के शीर्ष (साथ ही एक पिक्सेल या प्रतिशत ऑफ़सेट) के साथ संवाद के शीर्ष को संरेखित करने के लिए स्थिति विकल्प का उपयोग करें।

यह क्षैतिज संवाद को केंद्रित करना चाहिए और इसे शीर्ष से 150 पिक्सेल रखें।

$("#dialog-form").dialog({
    autoOpen: false,
    width: 630,
    position: { my: 'top', at: 'top+150' },
    modal: true,
    resizable: false,
    closeOnEscape: false
});

JQuery UI के पुराने संस्करणों में एक सरणी का उपयोग किया गया था जिसमें एक [x, y] समन्वय जोड़ी बाईं ओर पिक्सेल ऑफ़सेट, व्यूपोर्ट के शीर्ष कोने (उदाहरण के लिए [350,100]) थी।

var dialogWidth = 630;
$("#dialog-form").dialog({
    // ...
    width: dialogWidth,
    position: [($(window).width() / 2) - (dialogWidth / 2), 150],
    // ...
});

position: { 
   my: 'top', 
   at: 'top+150' 
}

मेरे लिए काम किया





jquery-ui-dialog