jquery - jquery运行后CSS属性不会保留

标签 jquery css

“active”类应该使导航项发光。

http://kevinmikol.com/dmi/home

(function($) {
  var currentRadius, multiplier;

  function parseOptions(options) {
    return {
      RADIUS:     (options.radius    || 20),
      DURATION:   (options.duration  || 500),
      TEXT_COLOR: (options.textColor || '#fff'),
      HALO_COLOR: (options.haloColor || '#777')
    }
  }

  function currentRadius(elem) {
    if (prop = elem.style['text-shadow']) {
      return parseInt(prop.match(/0 0 (\d+)px/));
    } else {
      return 0;
    }
  }

  function stepTextShadow(fx) {
    if (fx.state == 0) {
      fx.start = currentRadius(fx.elem);
    }

    updatedRadius = fx.end.begin ?
      parseInt(fx.end.radius * fx.pos) :
      parseInt(fx.end.radius - (fx.end.radius * fx.pos))

    if (fx.end.begin || (fx.state < 1)) {
      $(fx.elem).css('text-shadow', fx.end.color + ' 0 0 ' + updatedRadius + 'px');
    } else {
      $(fx.elem).css('text-shadow', $(fx.elem).data('glow.originalGlow'));
    }
  }

  function addGlow(opts) {
    var opts = parseOptions(opts || { });

    function startGlow() {
      $(this).stop().animate({
        color: opts.TEXT_COLOR,
        textShadow: {
          begin: true,
          color: opts.HALO_COLOR,
          radius: opts.RADIUS
        }
      }, opts.DURATION);
    }

    function startFade() {
      $(this).stop().animate({
        color: $(this).data('glow.originColor'),
        textShadow: {
          begin: false,
          color: opts.HALO_COLOR,
          radius: opts.RADIUS
        }
      }, opts.DURATION);
    }

    with($(this)) {
      bind('mouseenter', startGlow);
      bind('mouseleave', startFade);
      data('glow.originColor', css('color'));
      data('glow.originalGlow', (css('text-shadow') || 'none'));
    }

    return this;
  }

  $.fx.step['textShadow'] = stepTextShadow;
  $.fn.addGlow = addGlow;
})(jQuery);

最佳答案

据我了解。当将鼠标悬停在单击的页面上时,发光消失,这是因为当将鼠标悬停在 liactive 中的 a 标记时,正在获取属性 不显示。因此,如果您添加一个脚本,以便每次悬停导航选项卡时,您都可以检查 li 的类是否处于事件状态 如果 li 的类处于事件状态,您可以使用

$('.active').find('a').attr('style','');

当然,您已经使用 css 为 active 类指定了样式。但内联样式总是会覆盖 css 样式。

希望这有帮助。

关于jquery - jquery运行后CSS属性不会保留,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12549265/

相关文章:

javascript - tableToExcel jQuery 在 IE 中抛出奇怪的错误

css - QTextBrowser 中的顶部边距不起作用

css - 如何使表内的 block 响应?

javascript - 删除选定/突出显示的文本

jquery - 第二次单击时将 onclick 更改回原始图像

javascript - jQuery DataTable 中显示的总条目数错误

html - 延伸到页脚的 CSS float 列

html - 如何将 <div> 放在图像上?

css - 悬停时圆 Angular 图像变化

asp.net - jQuery UI 自动完成示例