slick.js 플러스 파운데이션 이퀄라이저 문제 (slick.js plus foundation equalizer issue)


문제 설명

slick.js 플러스 파운데이션 이퀄라이저 문제 (slick.js plus foundation equalizer issue)

옆에 이 있습니다. <섹션> 아래에 탐색 슬라이더가 있는 slick.js 슬라이더를 추가했고 에 텍스트가 있습니다.

높이가 일치하도록 하기 위해 저는 zurb Foundation의 data‑equalizer를 사용했습니다. 이 모든 것이 작동합니다. 그러나 페이지를 로드할 때 페이지 크기를 모바일 크기로 조정한 다음 다시 데스크탑 크기로 조정하면 data‑equalizer가 슬라이더의 높이를 인식하지 못하므로 텍스트의 높이와 일치합니다. .

특히 창의 크기를 빠르게 조정할 때 발생하며 태블릿 장치를 회전할 때도 반드시 발생합니다.

다음은 JSFiddle에 대한 예입니다.

모두 이 문제를 해결하는 방법에 대한 아이디어가 좋습니다. 건배.


참조 솔루션

방법 1:

Change : " data‑equalizer‑mq " for " data‑equalize‑on="medium" " on the first line.

(by Gary VossMartin Ayotte Cummings)

참조 문서

  1. slick.js plus foundation equalizer issue (CC BY‑SA 2.5/3.0/4.0)

#zurb-foundation #html #slick.js






관련 질문

zurb-foundation Rails gem에 캔버스 외 레이아웃 포함 (Including off-canvas layouts with the zurb-foundation Rails gem)

CSS zurb 기초 및 dhtmlx (CSS zurb foundation and dhtmlx)

기초 바닥글이 전체 페이지 너비가 아닙니다. (Foundation footer is not full page width)

slick.js 플러스 파운데이션 이퀄라이저 문제 (slick.js plus foundation equalizer issue)

반응형 웹사이트 드롭다운 양식 문제 (Responsive Website Dropdown form issue)

Foundation 6의 TopBar가 작동하지 않음 (TopBar in foundation 6 not working)

_settings.scss의 변수는 주석 처리되지 않은 상태로 컴파일됩니다. (Variables in _settings.scss are compiled as uncommented)

Foundation for Apps 프로젝트의 양쪽 맞춤 탭 (Justified tabs in Foundation for Apps project)

휴대폰에서 보이지 않는 웹사이트의 일부 (Part of the Website invisible on mobile phone)

Zurb Foundation 구성 요소가 작동하지 않음 (Zurb Foundation components not working)

Foundation 탭이 초기화되었는지 확인하는 방법은 무엇입니까? (How to check if Foundation tabs are initialized?)

Zurb Foundation 균등화 그리드: 그리드 셀 내부의 div 하단에 콘텐츠를 배치하는 방법 (Zurb Foundation equalised grid: how to position content at bottom of div inside grid cell)







코멘트