我正在使用FlexGuage.js为我网站上的某些仪表制作动画。仪表显示我希望它们在“简历/技术技能”部分下显示,但它们不是动画。我做得不对劲。我的网站在这里:http://spenry.mydevryportfolio.com/portfolio/这里也是我与jsfiddle的链接:http://jsfiddle.net/penrysh/tejfxcru/embedded/result/
HTML代码:
<div id="HTMLCSSGauge" style="width:175px">
<script>
var gauge = new FlexGauge({
appendTo: '#HTMLCSSGauge',
dialValue: true, // Set the dial to display arcFillPercent supplied
dialClass: 'gaugeDials',
dialUnit: '%',
animateEasing: true,
dialLabel: 'HTML/CSS',
dialLabelClass: 'gaugeDialsLabel',
arcFillPercent: .80,
arcStrokeFg: 20,
arcStrokeBg: 20,
animateSpeed: 1,
colorArcFg: '#91B0DF',
colorArcBg: '#124085'
});
</script>
</div>
CSS代码:
.gaugeDials {
font-size: 200%;
font-weight: bold;
left: 0;
top: 100px;
width: 100%;
float: left;
margin-left: 10%;
padding-top: 10px;
}
.gaugeDialsLabel {
font-size: 80%;
font-weight: bold;
left: 0;
top: 170px;
width: 100%;
float: left;
margin-left: 6%;
margin-bottom: 5%;
}
#HTMLCSSGauge {
float: left;
margin-left: 60px;
padding: 0;
}