daily pastebin goal
90%
SHARE
TWEET

Untitled

a guest May 16th, 2018 72 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  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
RAW Paste Data
Top