建站资源下载详情
为您免费提供多种建站资源下载,包括网站模板下载、前端插件下载和字体下载!您只需注册为会员即可任意下载!

CSS动画进度条JQuery 插件 skillsBar

来源:易助科技网浏览量:20收藏

简介


skillsBar是一款简洁实用的jJQuery css动画进度条插件,通过在页面中放置指定的HTML代码,即可生成带动画效果的进度条。


CSS动画进度条JQuery 插件 skillsBar-示例图


(下载的附件中附有DEMO)



使用


1.  引入文件


<link href="css/an-skill-bar.css" rel="stylesheet">

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/an-skill-bar.js"></script>


2.  HTML


<div class="skillbar html">
  <div class="filled" data-width="90%"></div>
  <span class="title">HTML</span>
  <span class="percent">90%</span>
</div>


3.  调用


$(document).ready(function () {
  $(".skillbar").skillbar();
});



相关链接


官网地址 :https://bar-skills.com/

GitHub 地址 :https://github.com/umarwebdeveloper/jquery-css-skills-bar

在线演示 :http://www.htmleaf.com/Demo/201810305391.html