-1

ホバー時に「ぼかしを取り除く」(テキストの影を取り除く)ページを作成しようとしています。

これは、IEを除くすべてのブラウザで機能します:http://mmhudson.com/brett.html

要素がホバーされていないときに色を「透明」に設定していて、IEフィルターの「ぼかし」がそれを継承しているため、テキストの影も透明になっているため、機能しません。

フィルタがそれを継承しないようにする、またはシャドウのみが非表示になるようにするにはどうすればよいですか?

私は現在プラグインを使用していますが、それが望ましい場合は通常のcssを使用できます。

http://jsfiddle.net/PaDwt/

IEブロックの場合はhtmlに注意してください

IE8とIE9のサポートだけが必要ですが、IE7以前も良いでしょう。

4

2 に答える 2

0

問題は、透明色を継承しているということではなく、IEがテキストシャドウをまったくサポートしていないということです。

このstackoverflow.com/questions/6905658/css3-text-shadow-in-ie9を使用してください

p.shadow { 
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#0000FF,direction=45);
}

- - - - - -編集 - - - - - - -

これはあなたが探しているものですか? http://jsfiddle.net/PaDwt/4/

-CSS

#paragraphs p{
  /*the width needs to be a set value, not a percentage*/
  width: 600px;
  /*blur all paragraphs*/
  color: transparent;
  text-shadow: 0px 0px 2px #666666;
  filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=3);
}

-JS

$(document).ready(function(){
  if($.browser.msie) $("#paragraphs p").css("color", "black");
  $("#paragraphs p").mouseover(function(){
    var thisP = this;
    if($.browser.msie)
    {
      $("#paragraphs p").css({
        filter:"progid:DXImageTransform.Microsoft.Blur(pixelradius=3)"
      });
    }
    else{
      $("#paragraphs p").css({
        color:"transparent",
        textShadow:"0 0 2px #666",
      });
    }
    $(thisP).css({
      color:"#000",
      textShadow:"none",
      filter:"none"
    })
  });
  $("#paragraphs p").mouseout(function(){
    if($.browser.msie)
    {
      $("#paragraphs p").css({ 
        filter:"progid:DXImageTransform.Microsoft.Blur(pixelradius=3)"
      });
    }
    else
    {
      $("#paragraphs p").css({
        color:"transparent",
        textShadow:"0 0 2px #666"
      });
    }
  });
});​

これはIE9で私のために働きます。

于 2012-07-05T20:42:11.583 に答える
0

これを見てください:IEパートIのCSSぼやけたテキストの影

于 2012-07-05T20:35:24.147 に答える