Im add My Ember Application for j query circular progress bar, Its not a correctly display , image 01 Im use this example example
Look image 01, display like this, normal html , its is working fine, )
This is my Coding part application.hbs
<div class="navbar-header">
<span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>
</div>
Home
Manage rooms
Channel manger
Cash reports
Add expenses
Settings
Helps
<div class="progress-bar position" data-percent="60" data-duration="1000" data-color="#ccc,yellow"></div>
app.css
.progress-bar {
position: relative;
height: 200px;
width: 200px;
}
.progress-bar div {
position: absolute;
height: 200px;
width: 200px;
border-radius: 50%;
}
.progress-bar div span {
position: absolute;
font-family: Arial;
font-size: 25px;
line-height: 175px;
height: 175px;
width: 175px;
left: 12.5px;
top: 12.5px;
text-align: center;
border-radius: 50%;
background-color: white;
}
.progress-bar .background { background-color: #b3cef6; }
.progress-bar .rotate {
clip: rect(0 100px 200px 0);
background-color: #4b86db;
}
.progress-bar .left {
clip: rect(0 100px 200px 0);
opacity: 1;
background-color: #b3cef6;
}
.progress-bar .right {
clip: rect(0 100px 200px 0);
transform: rotate(180deg);
opacity: 0;
background-color: #4b86db;
}
@keyframes
toggle { 0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
and im added vendor folder to following files-
jQuery-plugin-progressbar.js
jquery-2.1.4.min.js
after add ember-cli-build.js to
app.import('vendor/jQuery-plugin-progressbar.js')
app.import('vendor/Progress.js')
, please help me to fix it,
Aucun commentaire:
Enregistrer un commentaire