Firefox - designMode: vô hiệu hóa xử lý thay đổi kích thước hình ảnh

Question

Làm cách nào để ngăn người dùng có thể thay đổi kích thước hình ảnh trong designMode? (Vô hiệu hóa các xử lý khi hình ảnh được nhấp)

Answer 1

Giả sử bạn biến contentEditable tục như thế này:

document.body.contentEditable = true; 

Tất cả bạn phải làm là tắt nó đi cho tất cả (hoặc một số) hình ảnh.

var imgs = document.getElementsByTagName("IMG"); 
for (var i = 0; i < imgs.length; ++i) { 
    imgs[i].contentEditable = false; 
} 

Answer 2

Vâng, bạn không thể loại bỏ những trình xử lý thay đổi kích thước không trong Firefox và IE ... ít nhất tôi không thể tìm được giải pháp.

Cuối cùng, tôi đã quản lý trong Firefox bằng cách chỉnh sửa một số tệp cấu hình từ thư mục cài đặt FF và chúng tôi không muốn làm điều đó, phải không?

Dù sao, nếu bạn muốn vô hiệu hóa thay đổi kích thước nếu hình ảnh (nhưng thay đổi kích thước xử lý vẫn sẽ được hiển thị) chỉ cần thêm một số phong cách css như:

img { 
    width: auto !important; 
    height: auto !important; 
} 

regards, Mihailo

Answer 3

Mặc dù câu hỏi là một từ lâu rồi. Mỗi phần tử khối (div, img ...) sẽ được trang trí với các chốt từ FF. thử nghiệm nó:

<div id="myDiv" contenteditable="true"><p>Sample text!</p></div> 

Không xử lý, không có thay đổi kích thước, vv

<div id="myDiv" contenteditable="true"><p>Sample text!</p><img src="picture.jpg" /></div> 

Những hình ảnh có thể được thay đổi kích cỡ. Vì vậy, bạn phải gọi rõ ràng contenteditable = "false" cho mỗi khối elem bạn không muốn có xử lý, như nickf đã nói cho các hình ảnh.

Thậm chí còn kỳ lạ hơn: gán "vị trí: tuyệt đối" cho bất kỳ phần tử nào của bạn - kể cả div gốc - và nó có xử lý một lần nữa.

Answer 4

Tôi nghĩ bạn sẽ thấy điều này dễ chấp nhận hơn nhiều. Dường như hoạt động trong Firefox nhưng tôi không chắc chắn về các trình duyệt khác:

document.execCommand("enableObjectResizing", false, false); 

Nó vẫn giữ nguyên khả năng kéo và thả.

Answer 5

này hoạt động tốt cho Firefox:

document.execCommand("enableObjectResizing", false, false);

Đối với IE tôi đã sử dụng:

image.attachEvent("onresizestart", function(e) { e.returnValue = false; }, false);

Answer 6

Tôi không thể bình luận và biểu quyết chưa vậy ... theo của nmb.ten trả lời, bạn phải sử dụng:

document.execCommand("enableObjectResizing", false, false); 

Nhưng nó hoạt động chỉ sau nội dung của bạn được điền vào (Tôi có nghĩa là nếu bạn phải chỉnh sửa một số văn bản được lưu trước đó).