我做一个价格展示 需要根据涨跌显示不同的颜色
.css('background','#C13B3F');.css('background','#2BA838');
但 这样显示的太生硬 怎么让他显示的柔和一点的变化
看了眼btc123 大致懂题主的意思 使用jQ的animate() 如果要改背景色需要用官方的插件jQuery.color.js
<!DOCTYPE html> <html> <head> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script> <script src="jquery.color.js"></script> </head> <body> <button>1</button> <p style="background-color:#eee;">2017</p> </body> <script> $(document).ready(function(){ $("button").click(function(){ $("p").animate({backgroundColor:'#d43b3b'},"slow") $("p").animate({backgroundColor:'#eee'},"slow") }); }); </script> </html>
CSS3 transition 属性 http://www.w3school.com.cn/cs...
比如鼠标滑过p变色
CSS:
#p1 { width:100px; height:100px; background:#C13B3F; transition:background 1s; } #p1:hover { background:#2BA838; }
HTML:
<p id="p1"></p>
谢邀……
刚才本来想的是背景柔和用线性渐变就好了,但是想来想去都想不到怎么表示价格的涨跌(感觉用数据可视化库来做是不是更好?),所以把删掉的答案再加上,顺便跟题主探讨下~
看了眼btc123 大致懂题主的意思
使用jQ的animate() 如果要改背景色需要用官方的插件jQuery.color.js
CSS3 transition 属性 http://www.w3school.com.cn/cs...
比如鼠标滑过p变色
CSS:
HTML:
谢邀……
刚才本来想的是背景柔和用线性渐变就好了,但是想来想去都想不到怎么表示价格的涨跌(感觉用数据可视化库来做是不是更好?),所以把删掉的答案再加上,顺便跟题主探讨下~