JS插件收集
JS插件收集
Ethan-GOGO 发表于2年前
JS插件收集
  • 发表于 2年前
  • 阅读 44
  • 收藏 3
  • 点赞 0
  • 评论 0

标题:腾讯云 新注册用户域名抢购1元起>>>   

1.动画插件

<script>
    $(function(){
//        导航跳转动画
        $('.nav').singlePageNav({
            offset:70
        });


//动画初始化
        new WOW().init();
    })
</script>


 <div class="wow flash" data-wow-delay="0.2s" data-wow-duration="1s">
</div>

 

2.表插件

1.创建画布
            <div class="panel panel-default">
                <div class="panel-heading">今日访客统计</div>
                <div class="panel-body">
                    <canvas id="canvas" class="col-md-12"></canvas>
                </div>
            </div>

2.引出曲线图代码js

var lineChartData = {
	//X坐标数据
	labels : ["2","4","6","8","10","12","14","16","18","20","22","24"],
	datasets : [
		{	
			//统计表的背景颜色
			fillColor : "rgba(255,255,255,0)",
			//统计表画笔颜色
			strokeColor : "rgba(0, 0,0, 1)",
			//点的颜色
			pointColor : "rgba(155, 39, 39, 1);",
			//点边框的颜色
			pointStrokeColor : "#fff",
			//鼠标触发射点的颜色
			pointHighlightFill : "#fff",
			//鼠标触发时点边框的颜色
			pointHighlightStroke : "rgba(220,220,220,1)",
			//Y坐标数据
			data : [1,2,3,4,5,5,6,7,8,8,9,9]
		},
		{
			fillColor : "rgba(255,255,255,0)",
			strokeColor : "rgba(92, 184, 92, 1)",
			pointColor : "rgba(23, 126, 23, 1)",
			pointStrokeColor : "#fff",
			pointHighlightFill : "#fff",
			pointHighlightStroke : "rgba(151,187,205,1)",
			data : [2,2,1,4,2,4,5,7,8,8,4,3]
		}
	]

}

//初始化
window.onload = function(){
	var ctx = document.getElementById("canvas").getContext("2d");
	window.myLine = new Chart(ctx).Line(lineChartData, {
		responsive: true
	});
}

 

共有 人打赏支持
粉丝 13
博文 161
码字总数 82033
×
Ethan-GOGO
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: