考虑情况http://codepen.io/anon/pen/JdGYBN
我需要在拖动元素时动态更改卡片“可拖动”的背景颜色。
但是卡片的背景应该根据线条渐变颜色变化。
background: linear-gradient(to bottom, rgba(255,2,2,1) 0%,rgba(242,255,0,1) 34%,rgba(16,255,0,1) 66%,rgba(255,255,255,1) 100%);
不像卡片“badone”那样包含所有渐变。
因此,容器卡顶部的背景应该大部分是红色。底部大部分为白色。
有什么建议如何实现吗?希望你能理解我。
最佳答案
技巧是将拖动元素的 background-size
设置为容器的大小,并将 background-attachment
设置为 fixed
,如下所示:
#draggable {
background: /* linear gradient */;
background-size: 900px 500px;
background-attachment: fixed;
}
draggability
插件在拖动时使用translate
,并且仅在放置后更新元素位置。这会导致背景在拖动时粘住。 jQuery UI Draggable拖动时更改位置以达到所需的效果。
我已经调整了your demo accordingly .
关于javascript - 动态改变元素背景(渐变),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30121344/