Question

嗨我正在angularjs中构建一个滑块，根据移动指针的位置改变颜色。

1。）如果指针位于右侧，则栏将为红色 2.）如果指针位于左侧，则条形将为蓝色 3.）如果指针位于中间，则条形将为半红色，半蓝色

我正在使用此库：http://prajwalkman.github.io/angular-slider/

问题：

我试图通过将一个指针固定在底部并且不可见来实现这一点，这样当滑块改变颜色时只有一个指针移动。然而，我正在摸索如何使这项工作。有帮助吗？

这是一个掠夺者：http://plnkr.co/edit/tmDfTksDwSRLrc0choOJ?p=preview

Answer 1

我检查了你的代码，它与角度js无关，你只需要修改第19行的angular-slider.css中的css来完成这个。

slider span.bar {
  width: 100%;
  height: 100%;
  z-index: 0;
  -webkit-border-radius: 1em/1em;
  border-radius: 1em/1em;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #F53337), color-stop(1, #F72529));
  background: -webkit-linear-gradient(top, #F53337 0, #F72529 100%);
  background: -moz-linear-gradient(top, #F53337 0, #F72529 100%);
  background: -o-linear-gradient(top, #F53337 0, #F72529 100%);
  background: -ms-linear-gradient(top, #F53337 0, #F72529 100%);
  background: linear-gradient(top, #F53337 0, #F72529 100%);
  -webkit-box-shadow: inset 2px 2px 5px;
  box-shadow: inset 2px 2px 5px;
}

这是插件：http://plnkr.co/edit/1zjfNbUSwNkdWxpYGZgP?p=preview

也可根据您的口味调整颜色。

用指针改变angularjs滑块的颜色

1 个答案: