मैं उपयोगकर्ता को डिज़ाइन मोड में किसी छवि का आकार बदलने में सक्षम होने से कैसे रोक सकता हूं? (हैंडल को निष्क्रिय जब चित्र को क्लिक)फ़ायरफ़ॉक्स - डिज़ाइन मोड: छवि आकार बदलने वाले हैंडल अक्षम करें
उत्तर
आप contenteditable इस तरह मोड़ पर कहते हैं:
document.body.contentEditable = true;
आपको बस इतना करना है सब (या कुछ) छवियों के लिए इसे बंद कर देते है।
var imgs = document.getElementsByTagName("IMG");
for (var i = 0; i < imgs.length; ++i) {
imgs[i].contentEditable = false;
}
ठीक है, आप नहीं निकाल सकते उन फ़ायरफ़ॉक्स और न ही IE में न संचालकों का आकार बदलने ... कम से कम मैं एक समाधान नहीं मिल सका।
अंत में मैंने फ़ायरफ़ॉक्स में एफएफ स्थापना फ़ोल्डर से कुछ कॉन्फ़िगरेशन फ़ाइलों को संपादित करके प्रबंधित किया और हम ऐसा नहीं करना चाहते हैं, है ना?
वैसे भी, आप आकार बदलने निष्क्रिय करने के लिए करता है, तो छवियों (लेकिन आकार बदलने के संचालकों अभी भी दिखाई देगा) जैसे कुछ सीएसएस शैली को जोड़ने चाहते हैं: हालांकि सवाल था
img {
width: auto !important;
height: auto !important;
}
संबंध है, Mihailo
एक बहुत समय पहले। प्रत्येक ब्लॉक तत्व (div, img ...) एफएफ से हैंडल के साथ सजाया जाएगा। टेस्ट यह:
<div id="myDiv" contenteditable="true"><p>Sample text!</p></div>
कोई हैंडल, कोई आकार बदलने आदि
<div id="myDiv" contenteditable="true"><p>Sample text!</p><img src="picture.jpg" /></div>
छवि को फिर से कर सकते हैं। इसलिए आपको प्रत्येक ब्लॉक एडीएम के लिए कंटेंटएडेबल = "झूठी" को स्पष्ट रूप से कॉल करना होगा, जिसे आप हैंडल नहीं करना चाहते हैं, क्योंकि निक ने पहले ही छवियों के लिए कहा था।
और भी अजीब: अपने किसी भी तत्व के लिए "स्थिति: पूर्ण" असाइन करें - यहां तक कि मूल div - और यह फिर से संभालता है।
मुझे प्यार है कि कैसे स्टैक ओवरफ्लो पर आप कभी नहीं जानते कि आपके उत्तरों अन्य वर्षों पर कैसे प्रभावित होंगे, शायद आने वाले वर्षों में। यह: "यहां तक कि अधिक अजीब: अपने किसी भी तत्व के लिए" स्थिति: पूर्ण "असाइन करें - यहां तक कि मूल div - और यह फिर से संभालता है।" मुझे अभी बहुत परेशानी बचाई है :) –
मुझे लगता है कि आपको यह अधिक स्वीकार्य लगेगा। फ़ायरफ़ॉक्स में काम करते हैं लगता है, लेकिन मैं अन्य ब्राउज़र के बारे में यकीन नहीं है:
document.execCommand("enableObjectResizing", false, false);
यह खींचें छोड़ देता है और ड्रॉप क्षमता बरकरार।
यह Firefox के लिए ठीक काम करता है:
document.execCommand("enableObjectResizing", false, false);
IE के लिए मैं का उपयोग किया है:
image.attachEvent("onresizestart", function(e) { e.returnValue = false; }, false);
+1 यह स्वीकार्य उत्तर होना चाहिए! – giammin
मैं टिप्पणी नहीं कर सकता और अभी तक तो वोट ... nmb.ten के के अनुसार उत्तर, आपको उपयोग करना होगा:
document.execCommand("enableObjectResizing", false, false);
लेकिन यह पर काम करता है केवल के बाद आपकी सामग्री भर जाती है (मेरा मतलब है कि आपको पहले सहेजे गए कुछ पाठ को संपादित करना है)।
वास्तव में संतुष्ट करने के लिए काम करता है। DesignMode के लिए काम नहीं लग रहा है।समाधान ने एक नई समस्या बनाई हालांकि यद्यपि: जब कोई छवि घूमती है और रिलीज़ हो जाती है, तो यह संपादन योग्य क्षेत्र में कैरेट स्थिति पर छवि की एक प्रति बनायेगी। कोई उपाय? – dEEf
मुझे या तो बहुत कुछ पता नहीं है, तो सामग्री के बीच क्या अंतर है संपादन और डिज़ाइन मोड? यदि DesignMode काम नहीं कर रहा है, तो क्या आप केवल सामग्री पर स्विच कर सकते हैं? – nickf
मेरी पिछली समस्या (छवि की ड्रैगन) में समस्या मिली: mousedown -> event.preventDefault(); धन्यवाद निक, मैं सामग्री पर स्विच कर रहा हूं ... – dEEf