Public code
modal
はじめてモーダルウィンドウを実装した！
data-modal-roleをhtmlにつける
import $ from 'jquery'
export default class Modal {
constructor(elem) {
this.$elem = $(elem)
this.$window = $(window)
this.$open = this.$elem.find('[data-modal-role="open"]')
this.$close = this.$elem.find('[data-modal-role="close"]')
this.$content = this.$elem.find('[data-modal-role="content"]')
this.openClass = 'open'
this.init()
}
init() {
this.bindEvents()
}
bindEvents() {
this.$window.on('resize', () => {
this.$content.removeClass(this.openClass)
})
this.$open.on('click', () => {
this.$content.addClass(this.openClass)
})
this.$close.on('click', () => {
this.$content.removeClass(this.openClass)
})
}
}
