单击时使用javascript添加多个文本阴影规则

Question

我正在尝试在单击按钮时将这种类型的css属性应用于给定元素：

text-shadow: 1px 1px 0 #b77e42,
             2px 2px 0 #b77e42,
             3px 3px 0 #b77e42,
             4px 4px 0 #b77e42;

但我最终得到了这些规则：

text-shadow: 1px 1px 0 #b77e42;

jsfiddle

Answer 1

问题似乎与您的逗号有关。每个规则都需要用逗号分隔。的 Live demo (click).

function addShadow(element) {

  var appliedStyle = i + 'px ' + i + 'px ' + '0 #b77e42';

  var current = element.style.textShadow;

  if (current) {
    //if there's already a style, add a comma before adding new
    current+= ',';
  }

  element.style.textShadow= current+appliedStyle;

  i++;
}