Class: Visible

Extends

• eg.Component

Methods

check(delay, containment){eg.Visible}

visible.js, line 91

Checks whether the visible of the target elements has changed. It trigger that change event on a component.

대상 엘리먼트의 가시성이 변경됐는지 체크한다. change 이벤트를 발생한다.

• delay (default: -1) optional
  Type: Number

  Delay time. It delay that change event trigger.

  지연시간. change 이벤트 발생을 지연한다.

• containment (default: false) optional
  Type: Boolean

  Whether to check only elements that are completely contained within the reference area.

  기준 영역 안에 완전히 포함된 엘리먼트만 체크할지 여부.

Returns:

Type	Description
eg.Visible	An instance of a module itself 모듈 자신의 인스턴스

inherited hasOn(eventName){Boolean}

component.js, line 165

Checks whether an event has been attached to a component.

컴포넌트에 이벤트가 등록됐는지 확인한다.

• eventName
  Type: String

  The name of the event to be attached

  등록 여부를 확인할 이벤트의 이름

Returns:

Type	Description
Boolean	Indicates whether the event is attached. 이벤트 등록 여부

Example

        var Some = eg.Class.extend(eg.Component,{
            "some": function(){
                this.hasOn("hi");// check hi event.
            }
        });

inherited off(eventName, handlerToDetach){eg.Component}

component.js, line 218

Detaches an event from the component.

컴포넌트에 등록된 이벤트를 해제한다

• eventName
  Type: eventName

  The name of the event to be detached

  해제할 이벤트의 이름

• handlerToDetach
  Type: function

  The handler function of the event to be detached

  해제할 이벤트의 핸들러 함수

Returns:

Type	Description
eg.Component	An instance of a component itself 컴포넌트 자신의 인스턴스

Example

        var Some = eg.Class.extend(eg.Component,{
            "hi": function(){},
            "some": function(){
                this.off("hi",this.hi); //detach event
            }
        });

inherited on(eventName, handlerToAttach){eg.Component}

component.js, line 181

Attaches an event to a component.

컴포넌트에 이벤트를 등록한다.

• eventName
  Type: eventName

  The name of the event to be attached

  등록할 이벤트의 이름

• handlerToAttach
  Type: function

  The handler function of the event to be attached

  등록할 이벤트의 핸들러 함수

Returns:

Type	Description
eg.Component	An instance of a component itself 컴포넌트 자신의 인스턴스

Example

        var Some = eg.Class.extend(eg.Component,{
            "hi": function(){},
            "some": function(){
                this.on("hi",this.hi); //attach event
            }
        });

inherited once(eventName, handlerToAttach){eg.Component}

component.js, line 120

Executed event just one time.

이벤트가 한번만 실행된다.

• eventName
  Type: eventName

  The name of the event to be attached

  등록할 이벤트의 이름

• handlerToAttach
  Type: function

  The handler function of the event to be attached

  등록할 이벤트의 핸들러 함수

Returns:

Type	Description
eg.Component	An instance of a component itself 컴포넌트 자신의 인스턴스

Example

        var Some = eg.Class.extend(eg.Component,{
            "hi": function(){
                alert("hi");
            },
            "thing": function(){
                this.once("hi",this.hi);
            }
        });

        var some = new Some();
        some.thing();
        some.trigger("hi");
        // fire alert("hi");
        some.trigger("hi");
        // Nothing happens

inherited option(key, value){eg.Component|Object}

component.js, line 25

Sets options in a component or returns them.

컴포넌트에 옵션을 설정하거나 옵션을 반환한다

• key
  Type: String

  The key of the option

  옵션의 키

• value optional
  Type: Object

  The option value that corresponds to a given key

  키에 해당하는 옵션값

Returns:

Type

Description

eg.Component | Object

An instance, an option value, or an option object of a component itself. - If both key and value are used to set an option, it returns an instance of a component itself. - If only a key is specified for the parameter, it returns the option value corresponding to a given key. - If nothing is specified, it returns an option object. 컴포넌트 자신의 인스턴스나 옵션값, 옵션 객체. - 키와 값으로 옵션을 설정하면 컴포넌트 자신의 인스턴스를 반환한다. - 파라미터에 키만 설정하면 키에 해당하는 옵션값을 반환한다. - 파라미터에 아무것도 설정하지 않으면 옵션 객체를 반환한다.

Example

        var Some = eg.Class.extend(eg.Component, {
            construct: function(options){
                this.options = options; // You have to set this.options.
            }
        });

        var some = new Some({
            "foo": 1,
            "bar": 2,
        });
        some.option("foo"); // return 1
        some.option("foo",3); // return some instance
        some.option(); // return options object.
        some.option({
            "foo" : 10,
            "bar" : 20,
            "baz" : 30
        }); // return some instance.

refresh(){eg.Visible}

visible.js, line 64

Updates the list of elements where the visibility property is to be checked

visibility 속성을 검사할 엘리먼트의 목록을 갱신한다

Returns:

Type	Description
eg.Visible	An instance of a module itself 모듈 자신의 인스턴스

inherited trigger(eventName, customEvent){Boolean}

component.js, line 72

Triggers a custom event.

커스텀 이벤트를 발생시킨다

• eventName
  Type: String

  The name of the custom event to be triggered

  발생할 커스텀 이벤트의 이름

• customEvent
  Type: Object

  Event data to be sent when triggering a custom event

  커스텀 이벤트가 발생할 때 전달할 데이터

Returns:

Type	Description
Boolean	Indicates whether the event has occurred. If the stop() method is called by a custom event handler, it will return false and prevent the event from occurring. 이벤트 발생 여부. 커스텀 이벤트 핸들러에서 stop() 메서드를 호출하면 'false'를 반환하고 이벤트 발생을 중단한다.

Example

        var Some = eg.Class.extend(eg.Component,{
            "some": function(){
                this.trigger("hi");// fire hi event.
            }
        });

Events

change

visible.js, line 192

This event is fired when the event is compared with the last verified one and there is an element of which the visibility property has changed.

마지막으로 확인한 결과와 비교해 visibility 속성이 변경된 엘리먼트가 있을 때 발생하는 이벤트

• visible
  Type: Array

  Visible elements (the element type is HTMLElement)

  보이게 된 엘리먼트들

• invisible
  Type: Array

  Invisible elements (the element type is HTMLElement)

  안 보이게 된 엘리먼트들