- This topic is empty.
January 16, 2014 at 6:51 am #160513
I have used the tutorial https://css-tricks.com/css3-progress-bars/ to display a percentage amount of a total which changes colour the lower it goes. This works fine. However I now want to also have it as a button but rather than just making this into a button I want to take a button element and have it work in a similar way. So it is a particular colour treating the full width of the button as 100% and moving left along it until it is empty.
I don’t understand.
Why would a button show progress?
What have you tried so far, we aren’t here to do it all for you?January 16, 2014 at 7:19 am #160516
You might want to review Chris Coyier recent article on buttons.January 16, 2014 at 7:25 am #160518
sorry, I think I’ve confused things. It’s not a progress, it’s just a meter to display the percentage of something. What it’s used for is a cart that I want to display the remaining items so it doesn’t need to change dynamicallyJanuary 16, 2014 at 8:10 am #160524
it’s just a meter to display the percentage of something.
Still not something a button should be used for.
What it’s used for is a cart that I want to display the remaining items so it doesn’t need to change dynamically
So where will it get the value from?January 16, 2014 at 9:56 am #160532
Why shouldn’t it be used for that? It’s a dual purpose. It tells you availability and allows you to purchase.
Currently I have the values in a php array. The total, the sold and the percentage left.January 16, 2014 at 10:07 am #160533
Fair enough…you seem determined.
Just use the techniques given in the article https://css-tricks.com/css3-progress-bars/ to a style a
<button>element or an
Quite what you expect the difference to be, I’m not sure…and any functionality will require some JS.January 16, 2014 at 10:15 am #160534
I’ll give it a go. If it doesn’t work or is stupid I’ll remove it but won’t know till I try.
- The forum ‘CSS’ is closed to new topics and replies.