jquery实现传统唱碟旋转带进度音乐播放器效果代码
代码语言:html
所属分类:多媒体
代码描述:jquery实现传统唱碟旋转带进度音乐播放器效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title></title> <style> * { margin: 0; padding: 0; } html, body { font: 12px "微软雅黑"; font-family: 'GothamRnd-Light'; color: #666; background-color: #272727; width: 100%; height: 100%; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } .container { width: 1200px; margin: 0 auto; position: relative; padding-top: 200px; z-index: 300; } .music-box { width: 500px; height: 500px; border-radius: 50%; position: relative; overflow: hidden; display: block; margin: 0px auto 0; } .music-box img { width: 100%; border-radius: 50%; transition: all 0.36s ease; display: inline; animation: spin 46s infinite linear; animation-play-state: paused; } .music-box .mask { width: 316px; height: 316px; border-radius: 50%; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); position: absolute; background-color: rgba(0, 0, 0, 0.3); } .mplayer { position: absolute; width: 60px; height.........完整代码请登录后点击上方下载按钮下载查看
网友评论0