반응형사이트에서 팝업2개띄울때

반응형사이트에서 팝업2개띄울때

QA

반응형사이트에서 팝업2개띄울때

본문

반응형사이트에서 팝업2개 이상 띄울때

위치를 pc에서는 양옆으로

모바일에서는 위아래로 띄우게 하고싶은데요

어떻게 해야하나요?

이 질문에 댓글 쓰기 :

답변 3

기본 팝업레이어를 사용하시기 보다는 모달팝업이나. 일반 레이어 팝업을 넣으시는게 편하실거예요.

pc상에서는 position:absolute로 left:0, right:0 으로 좌우로 붙이고

미디어쿼리에서 특정 해상도 이하로 내려갈 때 top:0, bottom:0으로만 바꿔주시면됩니다.

기존의 팝업프로그램은 기준이 top, left 이기 때문에 추가로 bottom, right기준으로 위치를 잡을 수 있게 프로그램을 수정하셔야합니다.

반응형 디자인에 보시면 이런 식의 코드가 있습니다.

 

@media (max-width: 1200px) 

.example {

   ...

}

 

모바일의 크기를 평균적으로 잡으신 후

윗분 말씀처럼 top, left 와 bottom, right 기준으로 CSS 코딩을 해주셔야 합니다.

 

자바스크립트(또는 jQuery)로 작업하는 방법도 있습니다.

이 같은 경우에는 브라우저의 유저 에이전트가 모바일인 경우 강제로 top, left, bottom, right 를 잡아주는 방식입니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 123,128 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT