whatisthis?

html_pr13) app.js Code Review 본문

PRACTICE/REVERSE-ENGINEERING

html_pr13) app.js Code Review

thisisyjin 2021. 11. 10. 23:01

https://mywebproject.tistory.com/124

 

 

HTML 훈련 - (13) Music Player

 Music Player REFERENCE (style.css / app.js) https://github.com/rohjs/bugless-101/tree/master/html-practice/13-music-player 김버그의 HTML&CSS는 재밌다 - 구름EDU HTML&CSS를 한번에! 탄탄한 개념이해..

mywebproject.tistory.com

 

 

 

 

 

var musicPlayItems = document.querySelectorAll(".music-play-item")

musicPlayItems.forEach(function(item) {
  item.isPlaying = false
  item.audio = item.querySelector("audio")

  item.addEventListener("click", function() {
    if (this.isPlaying) {
      item.audio.pause()
      item.audio.currentTime = 0
    } else {
      item.audio.play()
    }

    item.isPlaying = !item.isPlaying
  })
})

 

 

 

 

 

 

REFERENCE (style.css / app.js)

https://github.com/rohjs/bugless-101/tree/master/html-practice/13-music-player

 

 

 

김버그의 HTML&CSS는 재밌다 - 구름EDU

HTML&CSS를 한번에! 탄탄한 개념이해부터 실습까지 한 강의로 끝내기, 실무 가능한 실력으로 😎

edu.goorm.io

 

강의내용 (X)
github 코드 위주로 작성하였습니다.

추후 비공개 처리 예정,

'PRACTICE > REVERSE-ENGINEERING' 카테고리의 다른 글

javaScript. canvas redo/undo button  (0) 2022.02.07
html_pr14) style.css Code Review  (0) 2021.11.11
html_pr12) app.js Code Review  (0) 2021.11.10
html_pr12) style.css Code Review  (0) 2021.11.10
html_pr11) app.js Code Review  (0) 2021.11.08
'PRACTICE/REVERSE-ENGINEERING' Related Articles more