Responsive

Type : Constructor

Support : 1.0

Extend : $B.Class

  • 설정한 사이즈에 따라 window resize이벤트를 통해서 해당 이벤트를 발생시킨다. (IE9~)

Methods

  • Responsive( type, positions )

    Responsive 생성
    • type : String
      이벤트 발생시킬 기준
      ex) 'width' or 'height'
    • positions : Array
      포지션 데이타 배열, [{min:Number, max:Number, type:String}, ...

  • responsiveType() : Stringver 1.0~

    현재 해상도의 Type을 반환.
    positions 데이타 등록시 설정한 type속성 중에 해당하는 값을 반환

  • enable() : Responsivever 1.0~

    Responsive 검출 허용 설정

  • disable() : Responsivever 1.0~

    Responsive 검출 비허용 설정

  • clear() : Responsivever 1.0~

    이벤트 및 기본설정 삭제

Events

No. type description property ver
1 responsive 해당 size 구간에 진입시 한번 발생
  • responsiveType: 현재 해상도의 Type
 1.0
2 resize 설정한 'width, height' 의 사이즈가 변경시 계속해서 발생
  • responsiveType: 현재 해상도의 Type
 1.0

Example

var responsive = new $B.event.Responsive( 'width', [
        {
            type: 'S',
            min: 0,
            max: 800
        },
        { //801 ~ 1024
            type: 'M',
            min: 800,
            max: 1024
        },
        { //1025 ~ 20000
            type: 'L',
            min: 1024,
            max: 20000
        }
    ])
    .addListener( 'responsive', function (e) {
        console.log( e.responsiveType );//L
    })
    .addListener( 'resize', function (e) {
        console.log( e.responsiveType );//L
    });