2014-05-22 1 views
1

Foundation에는 Media Queries을 감지 할 수있는 일부 JS 함수가 있습니다. 내 질문에 중간 기능 미디어 쿼리에서 일부 기능을 정의하는 방법이 무엇입니까?미디어 쿼리의 Call/Firing Foundation JS

정확하게 중급에 Foundation Equalizer을 발사하거나 실제로 모바일에서 작동을 중지하고 싶습니다.

감사합니다 :)이 올바른 접근하지만 당신은 항상 data-equalizer 속성을 제거하고 다시 추가 할 수 있을지는 확실하지 않다

답변

0

@parhum,

. 어떤 이유

// media query event handler 
if (matchMedia) { 
    var mq = window.matchMedia("(min-width: 767px)"); 
    mq.addListener(WidthChange); 
    WidthChange(mq); 
} 

// media query change 
function WidthChange(mq) { 

    if (mq.matches) { 
     // window width is at least 767px 
     $('.row').attr('data-equalizer','data-equalizer'); 
    } 
    else { 
     // window width is less than 767px 
     $('.row').removeAttr('data-equalizer'); 
    } 

} 

, 나는이 작업

Foundation.utils.register_media('custom', "(min-width: 767px)"); 

if (matchMedia(Foundation.media_queries['custom']).matches) { 
    // window width is at least 767px 
    $('.row').attr('data-equalizer', 'data-equalizer'); 
} else { 
    // window width is less than 767px 
    $('.row').removeAttr('data-equalizer'); 
} 

미리 얻을 수 없습니다 : @Fiddle를 | 코드 : @Editor

~ 아빈

+0

응답 해 주셔서 감사 드리며 모바일에서 데이터 속성을 테스트하고 제거합니다. 그러나 데이터 이퀄라이저는 여전히 작동합니다. – Parhum

+0

나는 attr 제거 후 이퀄라이저를 '리플 로우'시켜야한다고 생각한다. – Parhum

0

재단 6 중단 점을 설정할 수 있습니다 "equalizeOn"라는 이퀄라이저 속성을 지원합니다. 이퀄라이저는이 중단 점에 이르기까지 작업을 수행합니다 (모바일 우선 접근 방식). 데이터가 HTML이나 자바 스크립트를 통해 속성을 통해 http://foundation.zurb.com/sites/docs/equalizer.html

당신은 옵션을 설정할 수 있습니다

다음은 워드 프로세서 (제, 플러그인 옵션)에 대한 링크입니다.

관련 문제