0

How to create audio player equalizer using html&css3 animation?

I am trying to create audio player equalizer but animate to downward side ?the code is below in the answer?I want that animation to upward side?

27th Feb 2017, 7:16 AM
kundan
kundan - avatar
2 odpowiedzi
+ 5
#main{width:600px;height:200px;background:red;position:relative;} /* outter -> position:relative; -> create a positionement context */ #m1{width:25px; height:15px; background:blue; position:absolute; /* inner -> position:absolute; -> position relatively to parent context */ -webkit-animation: m1 1s linear infinite; } @-webkit-keyframes m1{ from{bottom:0;left:10px;} /* bottom instead top */ to{bottom:0;left:10px;width:25px;height:100px} }
27th Feb 2017, 7:58 AM
visph
visph - avatar
0
Kundan Dalvi: <!DOCTYPE html> <html> <head> <style> #main{width:600px;height:200px;background:red;position:absolute;} #m1{width:25px; height:15px; background:blue; position:relative; -webkit-animation: m1 1s linear infinite; } @-webkit-keyframes m1{ from{top:185px;left:10px;} to{top:185px;left:10px;width:25px;height:100px} } </style> </head> <body> <div id="main"> <div id="m1"></div> </div> </body> </html>
27th Feb 2017, 7:16 AM
kundan
kundan - avatar