sites/m.xuannaer.com/components/mip-xuannaer-selectitem/mip-xuannaer-selectitem.js
/**
 * Make height transiton for element that has unknown height.
 * height transiton from 0px/40px to whatever height element will be.
 *
 * author&maintainer liangjiaying<jiaojiaomao220@163.com>
 *
 * @param  {Object} opt options
 * @example
 * {
 *   "ele": document.getElementById('id1'), // target DOM
 *   "type": "fold",                  // "fold" or "unfold"
 *   "transitionTime": "0.3",         // seconds, animation time
 *   "tarHeight": "140px",            // DOM height when animation ends
 *   "oriHeight": "20px",             // DOM height when animation begins
 *   "cbFun": function() {}.bind()  //callback, exec after animation
 * }
 */
Make height transiton for element that has unknown height.
height transiton from 0px/40px to whatever height element will be.

author&maintainer liangjiaying


Make height transiton for element that has unknown height . height transiton from 0px / 40px to whatever height element will be . author&maintainer liangjiaying
function heightAni (opt) {
  let element = opt.ele
  let type = opt.type
  if (!type || !element) {
    return
  }
  let transitionTime = isNaN(opt.transitionTime) ? 0.24 : Math.min(parseFloat(opt.transitionTime), 1)
  let oriHeight = (opt.oriHeight !== undefined ? opt.oriHeight : getComputedStyle(element).height)
  let tarHeight
  let cbFun = opt.cbFun || function () {}
  if (type === 'unfold') {
    if (opt.tarHeight !== undefined) {
      tarHeight = opt.tarHeight
    } else {
      util.css(element, {transition: 'height 0s', height: 'auto'})
      tarHeight = getComputedStyle(element).height
    }
    setTimeout(() => {
      util.css(element, {transition: 'height 0s', height: 'auto'})
    }, transitionTime * 1000)
  } else if (type === 'fold') {
    tarHeight = opt.tarHeight || 0
  }
  element.style.height = oriHeight
  setTimeout(() => {
    util.css(element, {transition: `height ${transitionTime}s`, height: tarHeight})
  }, 10)
  setTimeout(cbFun, transitionTime * 1000)
}
function heightAni ( opt ) { let element = opt . ele let type = opt . type if ( ! type || ! element ) { return } let transitionTime = isNaN ( opt . transitionTime ) ? 0.24 : Math . min ( parseFloat ( opt . transitionTime ) , 1 ) let oriHeight = ( opt . oriHeight !== undefined ? opt . oriHeight : getComputedStyle ( element ) . height ) let tarHeight let cbFun = opt . cbFun || function ( ) { } if ( type === 'unfold' ) { if ( opt . tarHeight !== undefined ) { tarHeight = opt . tarHeight } else { util . css ( element , { transition : 'height 0s' , height : 'auto' } ) tarHeight = getComputedStyle ( element ) . height } setTimeout ( ( ) => { util . css ( element , { transition : 'height 0s' , height : 'auto' } ) } , transitionTime * 1000 ) } else if ( type === 'fold' ) { tarHeight = opt . tarHeight || 0 } element . style . height = oriHeight setTimeout ( ( ) => { util . css ( element , { transition : ` ${ transitionTime } ` , height : tarHeight } ) } , 10 ) setTimeout ( cbFun , transitionTime * 1000 ) }
Make height transiton for element that has unknown height.
Make height transiton for element that has unknown height .
// 开始动画 // 动画结束后，执行 callback