Guest User

Untitled

a guest
May 16th, 2018
124
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 0.90 KB | None | 0 0
  1. class ImageBackground extends HTMLElement {
  2. createdCallback() {
  3. let src = this.hasAttribute('src') ? this.getAttribute('src') : '/static/images/user.png'
  4. let className = `img-bg ${this.hasAttribute('className') ? this.getAttribute('className') : ''}`
  5. let isLazy = this.getAttribute('lazy') !== false
  6.  
  7. const slotContent = document.createElement('slot')
  8. slotContent.setAttribute('name', 'slot-content')
  9.  
  10. const wrapper = document.createElement('div')
  11. wrapper.appendChild(slotContent)
  12. wrapper.style.backgroundImage = `url("${src}")`
  13. wrapper.style.backgroundSize = 'cover'
  14. wrapper.style.backgroundPosition = 'center'
  15. wrapper.style.height = '300px'
  16. wrapper.setAttribute('class', className)
  17.  
  18. this.createShadowRoot().appendChild(wrapper)
  19. }
  20. }
  21.  
  22. document.registerElement('img-bg', ImageBackground)
  23.  
  24. img-bg(src="/static/images/email.svg")
  25. p(slot="slot-content") cek
Add Comment
Please, Sign In to add comment