테스트 사이트 - 개발 중인 베타 버전입니다

반응형사이트에서 팝업2개띄울때 채택완료

의정부아줌마 6년 전 조회 3,425

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

위치를 pc에서는 양옆으로

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

어떻게 해야하나요?

댓글을 작성하려면 로그인이 필요합니다.

답변 3개

채택된 답변
+20 포인트
6년 전

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

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

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

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

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

 

@media (max-width: 1200px) 

.example {

   ...

}

 

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

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

 

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

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

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

티로그
6년 전

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

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인