tel:000-000-0000 태그가 안먹히고 위로가기가 됩니다.

tel:000-000-0000 태그가 안먹히고 위로가기가 됩니다.

QA

tel:000-000-0000 태그가 안먹히고 위로가기가 됩니다.

본문

원래 우측 하단에 gotop 아이콘만 있었는데, 아이콘 위에 전화걸기 아이콘을

추가로 만들어 모바일에서 클릭하면 전화걸기가 뜨게끔 하려고 코드를 수정했습니다.

그런데 전화걸기가 안되고 위로가기가 되버립니다.

뭐가 문제인지 잘 모르겠어요ㅠㅠ

 

전화걸기 아이콘 태그부분

 

   
 <a href="tel:전화번호" title="" class="back-to-top-phone"></a>
    <a href="#" title="위로가기" class="back-to-top">To Top ↑</a>

 

전화걸기 아이콘 css부분


.back-to-top{position:fixed; bottom:8px; right:8px; width:42px; height:43px; line-height:43px; background:url(images/gotop.png) no-repeat; font-size:10px; text-indent:-9999px; text-align:center; display:none; z-index:9999; cursor:pointer}
.back-to-top-phone{position:fixed; bottom:75px; right:8px; width:42px; height:43px; line-height:43px; background:url(images/gotop_phone.png) no-repeat; font-size:10px; text-indent:-9999px; text-align:center; z-index:9999;}
 

 

 

이 질문에 댓글 쓰기 :

답변 6

<a href="tel:전화번호" title="" class="back-to-top-phone">tel</a> 한번 넣어보실래요~

display:block 넣어보셨나요?

영역이 안잡히는거 같은데 클릭이 된다니 아닌거 같기도 하네요^^

 

.back-to-top-phone{display:block;position:fixed; bottom:75px; right:8px; width:42px; height:43px; line-height:43px; background:url(images/gotop_phone.png) no-repeat; font-size:10px; text-indent:-9999px; text-align:center; z-index:9999;}


 
<a href="tel:전화번호" title="" ><span class="back-to-top-phone"> </span></a>
<br/>
<a href="#" title="위로가기" class="back-to-top">To Top ↑</a>
 

로 변경해보세요

 

ㅋㅋ

 

작성하신 CSS에 버그가 있네요

 

.back-to-top{position:fixed; 
bottom:8px; 
right:8px; 
width:42px; 
height:43px; 
line-height:43px; 
background:url(images/gotop.png) no-repeat; font-size:10px; text-indent:-9999px; text-align:center; display:none; z-index:9999; cursor:pointer}

 

 

혹시 html안에 <meta name="format-detection" content="telephone=no, address=no, email=no"/>.이런 코드가 있으면 삭제해보세요. 숫자를 그냥 숫자로만 인식하도록 만들어서 전화가 안될 수 있습니다

네... 댓글 보고 찾아봤는데 head.sub.php 문서에

    echo '<meta name="format-detection" content="telephone=no">'.PHP_EOL;

이런 문구가 있어요.
혹시 이것 때문일까요?
이건 그누보드 자체 소스인거같은데....

자문자답합니다.

 

back-to-top 작동 스크립트가 jquery에 통합되어 있었습니다.

관련 js파일에서 아래 부분을 주석처리했더니 gotop 버튼 제대로 작동하고

전화걸기도 잘 작동합니다. 

댓글 주신 모든 회원님들 감사드리고 새해 복 많이 받으세용!!

 

  
//    $('.back-to-top-phone').click(function(event) {
//        event.preventDefault();
//        $('html, body').animate({scrollTop: 0}, duration);
//        return false;
//    });

 

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

회원로그인

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