0

次のスクリプトでareaは、イメージ マップの中央にあるクリック可能な領域としてタグが定義されています。タグは領域のaltテキストを指定し、zoomプロパティは拡大レベルを元の画像から 50% 縮小するように制御します。

<style type="text/css">
    #myimg {zoom:50%; -moz-transform:scale(50%); -webkit-transform:scale(50%);}
</style>

<img src="http://www.content.onemexico.net/rosa.jpg" id="myimg" width="640" height="640" usemap="#themap">
<map name="themap">
    <area shape="rect" coords="240,240,400,400" alt="RosesByAlt" title="RosesByTitle" href="#">
</map>

クリック可能な領域の説明テキストは、Internet Explorer (IE-9) を除くすべての主要なブラウザーで表示されます。

titleの代わりに属性を試しましたaltが、それでもテキストは表示されません。

Internet Explorer を使用して、ズーム プロパティでクリック可能な領域に説明テキストが表示されるように、どなたかご協力ください。

4

1 に答える 1

0

IE9は標準のCSStransformプロパティで動作します。プレフィックスが必要ですが、サポートされています。したがって、IE9をサポートしようとしているだけの場合は、まったく必要ありませんzoom。あなたはこれを行うことができるはずです:

#myimg {
    -ms-transform:scale(0.5);
    -o-transform:scale(0.5);
    -moz-transform:scale(0.5);
    -webkit-transform:scale(0.5);
    transform:scale(0.5);
}

IE8以前をサポートする必要がある場合は、または同様のものが必要になりますが、;と同じではないことにzoom注意してください。表面的にはいくつかの類似点があるかもしれませんが、動作はまったく異なり、使用すると奇妙な効果が得られます。zoomscale

したがってzoom、古いIEバージョンであっても、まったく使用しないことをお勧めします。IEのmatrixフィルターまたはポリフィルスクリプトのいずれかを使用して、transformスタイルのサポートを古いIEにバックポートすることをお勧めします。ここで提供される答えはあなたを助けるかもしれません

また、プロパティのプレフィックスなしバージョンも追加したことに注意してください。ブラウザがまだサポートしていない場合でも、すべてのプロパティのプレフィックスなしバージョンを常に提供する必要があります。将来、すべてのプロパティが削除されるためです。プレフィックス付きバージョンのサポート。この時点で、標準バージョンがない場合はコードが壊れます。

于 2013-02-05T16:58:40.497 に答える