image - Firefox - designMode: 画像のサイズ変更ハンドルを無効にする

Question

ユーザーが designMode で画像のサイズを変更できないようにするにはどうすればよいですか? （画像がクリックされたときにハンドルを無効にします）

score 16 · Accepted Answer

これはFirefoxで正常に機能します。

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

IEの場合：

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

score 10 · Accepted Answer

次のように contentEditable をオンにするとします。

document.body.contentEditable = true;

すべての (または一部の) 画像に対してオフにするだけです。

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

score 5 · Accepted Answer

この方が受け入れやすいと思います。Firefox では動作するようですが、他のブラウザについてはわかりません。

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

ドラッグアンドドロップ機能はそのままです。

score 1 · Accepted Answer

まあ、Firefox でも IE でも、これらのサイズ変更ハンドラーを削除することはできません...少なくとも解決策は見つかりませんでした。

最後に、FF インストールフォルダーからいくつかの構成ファイルを編集することで Firefox でそれを管理しましたが、それはしたくありませんよね?

とにかく、画像のサイズ変更を無効にしたい場合 (ただし、サイズ変更ハンドラーは引き続き表示されます) は、次のような css スタイルを追加するだけです。

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

よろしく、ミハイロ

score 1 · Accepted Answer

質問はずっと前でしたが。すべてのブロック要素 (div、img...) は、FF のハンドルで装飾されます。試して：

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

ハンドル、サイズ変更などはありません。

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

画像はリサイズ可能です。したがって、ニックフが画像についてすでに述べたように、ハンドルを持ちたくないすべてのブロック要素に対して contenteditable="false" を明示的に呼び出す必要があります。

さらに奇妙なことに、「position:absolute」を任意の要素 (親 div も含む) に割り当てると、再びハンドルが作成されます。

6 に答える 6