토론방

소스관련 디자인 슬라이드형태 이미지출력(메인이미지적합)을 설치하면 모바일에서 공간이 생깁니다.

디자인팜에서 슬라이드형태 이미지출력(메인이미지적합) 이걸 설치해서 모바일에서 보게되면 1px의 공간이 생겨서 메인이 자꾸 움직이게 되는데 이유를 모르겠어요ㅠㅠㅠㅠ

이 배너를 안보이게 처리하면 공간이 생기지 않아서 이 배너가 문제인 것 같은데 원인을 모르겠네요ㅠㅠㅠㅠㅠ

게시글 공유 URL복사
댓글[5]

열기 닫기

  • 배**영 2016-12-06

    해당부분 확인이 되지않습니다..

    만약 1px의 틈이 있다고 하면 html,body에 border:1px solid red;box-sizing:border-box를 적용해 주시고 스크린샷과 휴대폰 기종을 알려주세요.

  • 임**연 2016-12-06

    갤럭시 알파입니다~! 

     

  • 배**영 2016-12-06

    해당 기기가 없어 저희쪽에서 테스트를 하기는 어려울듯합니다...

    현재 보더가 있어도 화면이 흔들리나요? 브라우저는 어떤 브라우저를 사용하신건가요?

  • 임**연 2016-12-06

    네ㅠㅠ 화면이 흔들려요..

    브라우저는 익스입니다!!

    아이폰이나 다른분꺼로 확인해봤는데 이상이 없네요ㅠㅠㅠㅠ제 핸드폰이 너무 오래된거라 그런걸까요ㅠㅠㅠ...

  • 배**영 2016-12-06

    확인이 불가능하여 아래와 같이 방법을 알려드리겠습니다.

    현재 사용중이신 슬라이드는 jquery로 width값을 불러와 슬라이드에 적용합니다.

    슬라이드가 커서 문제가 된다고하면 해당 브라우저와 jquery plugin이 호환이 정상적으로 되지 않을수도 있습니다..

    그럴경우 다른슬라이드를 이용하는 방법이 있고

    또는 슬라이드를 레이아웃으로 하나 감싼다음 width:100%;overflow-x:hidden을 줘도 될듯합니다. 이전 스크린샷을 보면 1px이 아닌 0.5px정도 차이가 나는듯 합니다.

    브라우저별로 소수점 px을 적용되는게 다르다 보니 이와 같은 경우가 발생할 수도 있습니다. 

    또 한가지 방법으로는 jquery로 확인 하는 방법도 있습니다.

    body에 width:100%;overflow-x:hidden을 주시고 

    jquery로

    <script>

    $(function(){

       alert($("body").width());

       alert($("비교할 컨텐츠").width());

    })

    </script>

    를 적용해서 비교하는 방법도 있습니다. 비교후 다른값이 나온다면 해당 컨텐츠의 css를 확인해보시면 될듯합니다.

     

     

    * 참고 ) jquery 선택자

    <div class="selector">       =>      $(".selector")

    <div id="selector">           =>      $("#selector")

댓글작성

열기 닫기

댓글작성
top