अपने पैरेंट div

में समायोजित करने के लिए ऐस संपादक कैसे प्राप्त करें मेरे पास एक और div के अंदर ऐस div है और मैं एसी संपादक को पैर की div पर इसकी चौड़ाई और ऊंचाई समायोजित करना चाहता हूं। मैं editor.resize() को कॉल करता हूं लेकिन कुछ भी नहीं होता है।अपने पैरेंट div

<!DOCTYPE html> 
<html lang="en" style="height: 100%"> 
<head> 
<title>ACE in Action</title> 
<style type="text/css" media="screen"> 
    #editor { 
     top: 0; 
     right: 0; 
     bottom: 0; 
     left: 0; 
     height: 100px; 
    } 
</style> 
</head> 
<body style="height: 100%"> 
<div style="background-color: red; height: 100%; width: 100%;"> 
<div id="editor">function foo(items) { 
    var x = "All this is syntax highlighted"; 
    return x; 
}</div> 
</div> 

<script src="ace-builds/src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script> 
<script> 
    var editor = ace.edit("editor"); 
    editor.setTheme("ace/theme/monokai"); 
    editor.getSession().setMode("ace/mode/javascript"); 

    editor.resize(); 
</script> 
</body> 
</html>

स्रोत

2015-02-28 user441521

आप दो शिष्टाचार में जो चाहते हैं उसे प्राप्त कर सकते हैं। मैंने jsfiddle बनाया है जो सीएसएस और जावास्क्रिप्ट को अपने कंटेनर में ऐस-एडिटर का आकार बदलने के लिए उपयोग किया जाता है।

उपयोग किया जाने वाला सीएसएस इसे बनाने के लिए है ताकि संपादक कंटेनर की चौड़ाई और ऊंचाई ले ले, ताकि editor.resize() संपादक के आकार की उचित गणना कर सके।

मैं काम करने के लिए editor.resize() प्राप्त करने के लिए निम्नलिखित की अनुशंसा करता हूं।

<style type="text/css" media="screen"> 
    #editor { 
     width: 100%; 
     height: 100%; 
    } 
</style>

हालांकि आप वर्तमान सीएसएस आप #editor निम्नलिखित काम करेंगे के लिए है का उपयोग कर बनाए रखने के लिए चाहते हैं।

<style type="text/css" media="screen"> 
    #editor { 
     position: absolute; /* Added */ 
     top: 0; 
     right: 0; 
     bottom: 0; 
     left: 0; 
    } 
</style>

और कंटेनर के लिए position: relative; जोड़ते हैं, ताकि पूरी तरह से तैनात संपादक सही ढंग से अपने कंटेनर के अंदर स्थिति में है। यह कैसे काम करता है के रूप में मैं तुम्हें Absolute positioning inside relative positioning.

स्रोत

2015-09-24 01:05:09 scain

आपका तर्क ऊंचाई नहीं बल्कि चौड़ाई समायोजित करता है। सही? –

ऊंचाई और चौड़ाई दोनों समायोजित किया जाना चाहिए। ऊंचाई और चौड़ाई दोनों पर 100% यही है। – scain

का उल्लेख jquery-ace मैं इस प्रबंधित किया है का उपयोग करते हुए बस का उपयोग करके:

$('#php_code').ace({ 
     theme: 'chrome', 
     lang: 'php', 
     width: '100%', 
     height: '300px' 
    })

स्रोत

2017-07-17 02:19:10 kjdion84

आप jquery के बिना उसी तरीके से ऐसा कर सकते हैं, बस 'चौड़ाई' को '100% 'पर सेट करें –

अपने पैरेंट div

उत्तर

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