2

作業中のサイトで jQuery を使用していますが、Internet Explorer 7 (および以前のバージョンですが、サイトはそれらをサポートしていません) を除いて、すべて正常に動作します。http://dev.staffanestberg.com/fromsweden/を Safari または Firefox で見てから、IE7 で見てみると、私の言いたいことがわかるでしょう。現在、コンテンツのフェードに組み込みのエフェクト FadeTo を使用していますが、カスタム エフェクトの作成と、Show/Hide、Animate、および FadeUp/FadeDown の両方の使用も試みました。当サイトでも SWFaddress を使用していて、IE7 との組み合わせでエラーになる場合がありますが、他のブラウザでも同様に表示されないのでしょうか? 私は何が欠けていますか？

-スタッファン

4

5 に答える 5

7

フェードインフェードアウトjQueryに関するフォントCleartypeの問題

これは正確な問題の本当に良い説明です。IEのClearTypeフォントと関係があります。これは私が使用した修正です。

例：

// This causes this text glich
$("#message").fadeIn();

// This will fix it
document.getElementById("#message").style.removeAttribute("filter");

修正はフィルターを削除することです。

$('#message').fadeIn(function(){
    this.style.removeAttribute("filter");
});

ソース

于 2010-01-28T00:42:21.533 に答える
3

IE6以降では、表示/非表示、fadeTo、fadeUp、fadeDownのすべてが正常に機能するようになりました。要素を明らかにすることを含むアニメーションで私が抱えている多くの問題は、ロード時に問題の要素が非表示になっていないことに関連していることがわかりました。

HTMLまたはプログラムのいずれかでstyle="display：none"にフェードインする要素（tableまたはdiv）を設定してみてください。

于 2009-03-17T06:49:20.797 に答える
2 
jQuery.fn.fixClearType = function(){
    return this.each(function(){
        if(typeof this.style.filter  && this.style.removeAttribute)
        this.style.removeAttribute("filter");
    })
}
于 2011-02-11T12:09:16.090 に答える
1

多分これはあなたにとって良い解決策ですか（私にとってはそうです）。解決策は単純ですが効果的です（そして非常に素晴らしいです）。IEの親の背景に色がない場合、IEにはアルファ透明度の問題があります（完全な透明度）。

ここで行うこと（以下の例を参照）は、最初にほぼ透明な（目には透明な）divを追加することです。これはキャンバス/コンテナ内の最初のdiv（=> divなど）であり、絶対に配置されるため、このdivの後のすべてのコンテンツは最初のdivの上に配置され、これが他のすべてのコンテンツの背景になりますこのキャンバスの内側。

現在背景があるため、フェードインまたはフェードアウト（不透明度を変更する場合）またはキャンバスの不透明度を100未満の値に設定すると、IEは厄介な黒い斑点（ピクセル）または黒い領域を表示しません。

方法-100x100の画像の例：

<div id="mycanvas" style="display:none;">
<div style="position:absolute; background:#FFF; display:block; filter:alpha(opacity=1); opacity:0; width:100px; height:100px;">
</div>
<img id="myImage" src="example.png" width="100" height="100"/>
</div>

jQueryを使用して画像をフェードインまたはフェードアウトするには：

    $("#mycanvas").fadeIn("slow", function() 
{setTimeout(function(){$("#mycanvas").fadeOut("slow");},2000 );}
);

これも可能です：

$("myImage").fadeIn("slow");

それでおしまい！

良い点は、このソリューションがVML / SVG（Raphael）またはアルファ透過性を持つ他のコンテンツでも機能することです。また、この「ハッキング」は他のブラウザに影響を与えないため、JSコードを変更/ハッキングする必要はありません。

それが役に立てば幸い。

于 2010-01-28T00:39:22.253 に答える
1

私が見つけたのは、最も効果的なのは単に背景を適用することです.GIFと考えてください。したがって、jQuery はありません。純粋なCSS

于 2011-03-22T14:48:13.110 に答える