编程爱好者之家

jquery插件之jquery.color.js实现背景色渐变效果

2018-07-11 14:07:09 346

jq的animate不支持颜色的渐变,jquery插件jquery.color.js完美解决了这个问题

首先是HTML代码如下

<div class="content"></div>

css样式如下

.content{
    width: 300px;
    height: 300px;
    background-color:#ff0000;
}

然后调用插件

<!--1、引入jquery的js文件-->
<script src="jquery/jquery-1.9.1.js"></script>
<!--2、引入插件的js文件-->
<script src="jquery/jquery.color.js"></script>
<script>
    $(document).ready(function(){
        //3、直接使用即可
        $(".content").animate({
            backgroundColor:"#64FF48",
            width:"500px",
            height:"500px"
        },2000,function(){
            alert("样式变换");
        });
    });
</script>

注意:jQuery不支持颜色的渐变,有的颜色的单词,jQuery不识别,例如pink,所以颜色最好用16进制。

同类文章