Javascript 微小的MCE和Django

Javascript 微小的MCE和Django,javascript,django,tinymce,tinymce-plugins,django-tinymce,Javascript,Django,Tinymce,Tinymce Plugins,Django Tinymce,我正试图建立一个博客网站。为此,我使用了Tiny MCE和Django。 我可以向我的博客添加/上传照片。但问题是通过微型MCE上传的图像对较小屏幕(如手机屏幕)没有响应。文本响应良好,但图像溢出。我查阅了微小的MCE文档,但没有找到答案。 以下是我的代码集: tinyinject.js: (我不太擅长JS) 需要帮助 要获得响应图像,您需要停止TinyMCE向插入的图像添加像素宽度和高度。一种方法是使用image\u dimensions:false。然后使用css设置图像的宽度,常用的方法是

我正试图建立一个博客网站。为此,我使用了Tiny MCE和Django。 我可以向我的博客添加/上传照片。但问题是通过微型MCE上传的图像对较小屏幕(如手机屏幕)没有响应。文本响应良好,但图像溢出。我查阅了微小的MCE文档,但没有找到答案。 以下是我的代码集:

tinyinject.js: (我不太擅长JS)

需要帮助


要获得响应图像,您需要停止TinyMCE向插入的图像添加像素宽度和高度。一种方法是使用
image\u dimensions:false
。然后使用css设置图像的宽度,常用的方法是使用
img{width:100%;max width:600px;}
其中
600px
将是最大图像宽度。如果你想深入研究图像造型

var script = document.createElement('script');
script.type = 'text/javascript';
script.src = "https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js";
document.head.appendChild(script);
script.onload = function () {
    tinymce.init({
        selector: '#id_content',
        plugins: [
            'advlist autolink link image imagetools lists charmap print preview hr anchor pagebreak',
            'searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking',
            'table emoticons template paste help'
        ],
        toolbar: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | ' +
            'bullist numlist outdent indent | link image | print preview media fullpage | ' +
            'forecolor backcolor emoticons | help | image',
        imagetools_toolbar: "rotateleft rotateright | flipv fliph | editimage imageoptions",
        image_title: true,
        automatic_upload: true,
        file_picker_types: 'image',
        file_picker_callback: function(cb, value, meta) {
            var input = document.createElement('input');
            input.setAttribute('type', 'file');
            input.setAttribute('accept', 'image/*');
            input.onchange = function() {
                var file = this.files[0];
                var reader = new FileReader();
                reader.onload = function() {
                    var id = 'blobid' + (new Date()).getTime();
                    var blobCache = tinymce.activeEditor.editorUpload.blobCache;
                    var base64 = reader.result.split(',')[1];
                    var blobInfo = blobCache.create(id, file, base64);
                    blobCache.add(blobInfo);
                    cb(blobInfo.blobUri(), {title: file.name});
                };
                reader.readAsDataURL(file);
            };
            input.click();
        },
        menu: {
            favs: { title: 'My Favorites', items: 'code visualaid | searchreplace | emoticons' }
        },
        menubar: 'favs file edit view insert format tools table help',
    });
}