아하
검색 이미지
생활꿀팁 이미지
생활꿀팁생활
생활꿀팁 이미지
생활꿀팁생활
작은원앙151
작은원앙15121.04.28

웹사이트 이미지 경로 코딩문의합니다

안녕하세요 초보입니다. 지금 웹사이트 이미지중에 하나를 a href 로 클릭시 다른 웹페이지로 경로이동하게 만들어놨는데요 웹에서 웹으로는 넘어가지만 모바일에서 클릭시에도 웹으로 넘어가니까 이걸 고치고 싶어요 모바일>모바일 이렇게요

이동할 페이지의 모바일링크도 갖고 있는데 어떻게 해결해야할까요

55글자 더 채워주세요.
답변의 개수
4개의 답변이 있어요!
  • 탈퇴한 사용자
    탈퇴한 사용자21.04.28

    안녕하세요.

    a 태그 href 주소에 도메인이 포함되어 있다면 도메인을 제외하면 됩니다.

    도메인을 제외하면 접속한 URL (브라우저 주소표시줄)과 동일한 도메인으로 이동하게 됩니다.

    기존 : href="https://웹페이지 도메인/index.do"

    변경 : href="/index.do"


  • 현재 접속한 기기가 어떤건지 확인하면 됩니다.

    javascript 내장 객체중에 navigator가 있습니다.

    이 객채를 통해 현재 접속중인 장치가 pc인지 모바일인지 등을 확인할 수 있고 또 브라우져가 어떤건지 버전은 몇 인지도 확인 가능합니다.

    아래는 질문하신 pc를 구분하는 조건 입니다.

    var filter = "win16|win32|win64|mac|macintel";

    if ( navigator.platform ) {

    if ( filter.indexOf( navigator.platform.toLowerCase() ) < 0 ) {

    //mobile

    alert('mobile 접속');

    }

    else {

    //pc

    alert('pc 접속');

    }

    }

    위 구문을 통해 pc와 모바일에 맞는 url은 a태그의 href에 넣어 사용하면 됩니다.

    navigator에 대한 자세한 정보는 아래 링크를 참조하세요

    https://opentutorials.org/course/1363/6650


  • 페이지를 어떤 언어로 짜는지 모르겠지만 가장 간단한 해결법으로는 if문을 사용하셔서 분기를 태워주시는 방법이 있을 것 같습니다.

    공통단에 현재 해당하는 운영체제를 체크하는 스크립트를 넣어서, 해당 스크립트값을 체크하는 if문으로 웹일때 모바일일 때 href에 들어가는 경로를 변경해주시면 될 것 같습니다.

    만약 그게 어렵다면 이동되는 페이지에서 모바일페이지 일 경우 redirect하는 방식으로 간단하게 구현할 수도 있겠지만, 별로 추천하는 방식은 아닙니다!

    모바일 체크 스크립트는 구글에 검색하면 많이 나오니, 사용하시는 언어에 맞게 선택하시면 간단하게 구현가능 할 것으로 보입니다.


  • <script>

    function isMobile(){

    var UserAgent = navigator.userAgent;

    return (UserAgent.match(/iPhone|iPod|Android|Windows CE|BlackBerry|Symbian|Windows Phone|webOS|Opera Mini|Opera Mobi|POLARIS|IEMobile|lgtelecom|nokia|SonyEricsson/i) != null || UserAgent.match(/LG|SAMSUNG|Samsung/) != null);

    }

    function customLink(obj){

    if(isMobile()){

    document.location.href = obj.getAttribute('data-mobile');

    }else{

    document.location.href = obj.getAttribute('data-web');

    }

    }

    </script>

    <body>

    <a href="javascript:void(0);" onClick="javascript:customLink(this);" data-web="webUrl" data-mobile="mobileUrl">hihi</a>

    </body>