Question

我有两个小问题：1）我使用基于Kilian Valkof插件的脚本在IE7 / 8/9中设置文本阴影。当它们被动画化时，当你在IE中鼠标悬停然后鼠标拖出时，它们后面会产生一个黑盒子，一旦完成每个字母的动画就会消失。如果我注释掉IE插件，那么当然阴影不会在IE中呈现，但黑盒问题已经消失，所以两个插件之间发生了一些需要帮助的事情。如何让黑色闪烁停止？

这是一个JSfiddle（已移除）

2）我正在尝试在文本阴影插件中为任何span.sl-w2分配更大的宽度（参见代码注释'UPDATE WIDTH'）。跨度的宽度设置为自动，那么如何分配，即orig宽度+某个数字？这是textShadow插件（已修改）：

/* jQuery textShadow plugin for IE
* Version 1.1 (26/02/2010)
* @requires jQuery v1.2+
*
* Copyright (c) 2008 - 2010 Kilian Valkhof (kilianvalkhof.com)
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
* MODIFICATIONS made **
*/
(function($) {
  $.fn.textShadowls = function(useroptions) {
   return this.each(function() {
    var obj = $(this);
    // obj.removeTextShadowls(); // Don't know why this is necessary? 
    var col = '#000000'; // %id=?somecolor?%       
    var blurrad = 3; // %id=shblur1%
    var gstr = 8; // %id=shx1%
    var text = "<span class='jQshadls'>" + obj.html() + "</span>";
    var pleft = 3 + 'px';
    var initwd2 = obj.width();  // Should pull width from .sl-w2? I think that's $(this)
    console.log('This Init Width:' + initwd2);        
    var wd = initwd2 + gstr + 'px !important';
    var defaults = {
      color: col,
      blur: blurrad,
      glowstr: gstr,
      opacity: 60
    };
    var options = $.extend(defaults, useroptions);
    options.color = (options.color.length == 4) ? options.color.replace(/#([0-9A-f])([0-9A-f])([0-9A-f])/i, '#$1$1$2$2$3$3') : options.color;
    var filtertext = "glow(strength="+options.glowstr+" color="+options.color+")blur(strength="+options.blur+" direction=45)blur(strength="+options.blur+" direction=90)blur(strength="+options.blur+" direction=135)blur(strength="+options.blur+" direction=180)blur(strength="+options.blur+" direction=225)blur(strength="+options.blur+" direction=270)blur(strength="+options.blur+" direction=315)blur(strength="+options.blur+" direction=360)progid:DXImageTransform.Microsoft.Alpha(opacity="+options.opacity+")";
    if($.browser.msie && options != "") {
      if (obj.is('.sl-w2')) {
        // obj.css({"zoom":"1"}).append(text);
        obj.append(text);  
        obj.children("span.jQshadls").css({
          "position":"absolute",
          "width":wd,  
          "padding-left":pleft,
          "z-index":"-1",
          "zoom":"1",
          "filter":filtertext,
          "-ms-filter":filtertext 
        });
        $('span.sl-w2').css({'width':wd, 'padding-left':pleft});// UPDATE WIDTH 
      } else {
        // obj.css({"zoom":"1"}).append(text);
        obj.append(text);  
        obj.children("span.jQshadls").css({
          "position":"absolute",
          "z-index":"-1",
          "zoom":"1",
          "filter":filtertext,
          "-ms-filter":filtertext 
        });
        //obj.parent().
      }   
    }
  });
};
$.fn.removeTextShadowls = function() {
  return this.each(function() {
    $(this).children("span.jQshadls").remove();
  });
};
})(jQuery);

谢谢，比尔

BUMP：有人可以帮助我 - 我真的很想，但需要一些编码帮助:-) Bill

Answer 1

想出来，最后;-)只需使用Blur w / PixelRadius和ShadowOpacity。

后来，比尔

动画＆amp; IE文本阴影冲突

1 个答案: