2

jQuery を使用して、UI のタブの角を丸くしています。私の問題は、Firefox と Ie9 ではうまく動作しますが、IE7 と IE8 では失敗することです (タブは正方形のように見えます)。

<div id="fig">
        <div id="fig-tabs">
          <strong class="tab-current">1st tab</strong> <a href="" class="tab">2nd tab</a> <a href="" class="tab">3rd tab</a>
        </div>
...</div>

そしてcssは、

#fig-tabs { }

strong.tab-current
{
    background-color: #FFF;
    padding: 3px 8px 7px 8px;
    -moz-border-radius: 4px 4px 0px 0px;
    border-radius: 4px 4px 0px 0px;
    text-decoration: none;
}

a.tab
{
    background-color: #999;
    padding: 3px 8px 2px 8px;
    -moz-border-radius: 4px 4px 0px 0px;
    border-radius: 4px 4px 0px 0px;
    text-decoration: none;
}

a.tab:hover { background-color: #9ffff; }
4

3 に答える 3

6

まず、あなたの問題は、あなたが書いているコードが、<canvas>古いバージョンの Internet Explorer がサポートしていないタグ/要素を使用していることだと思います。使えるもの

css3border-radiusプロパティを使用して丸めを設定してみませんか。これらはまだ Internet Explorer では機能しませんが、より適切でコーディングしやすくなっています。本当にこの時代では、この種のことは を使用して行う必要がありますcss3。9 より前の IE で動作する互換性ライブラリがあります。

古いバージョンのブラウザーで角を丸くしたい場合は、事前に作成された画像を使用する必要があります。

getContext編集: 他の回答で述べたように、Internet Explorer キャンバス ライブラリを使用できますが、キャンバス タグが動的に生成されるため、次の呼び出しを変更する必要があります。

var el = document.createElement('canvas');
G_vmlCanvasManager.initElement(el);
var ctx = el.getContext('2d');

EDIT2: 問題は、css3 プロパティも IE 7/8 でサポートされていないことです。ライブラリを使用してみてください (コメントの 1 つはhttp://css3pie.com/を推奨し、そのサポートを古いブラウザーに追加します)。

于 2012-08-24T04:11:38.990 に答える
3

canvas 要素は IE7/IE8 ではサポートされていません。ここにあるサポートを提供するライブラリを使用できます。試してみてください。

于 2012-08-24T04:11:52.617 に答える
0

divのレイで背景を使用してそれを行う古典的な方法はどうですか

<div><!--top-->
  <div><!--repeat-->
    <div><!--bottom-->

    </div>
  </div>
</div>
于 2012-08-24T10:37:40.160 に答える