즐겨찾기(Bookmark) 버튼 크로스브라우징 > 정보공유

본문 바로가기

정보공유

일반글
Javascript

즐겨찾기(Bookmark) 버튼 크로스브라우징

페이지 정보

게시물QR코드

본문

즐겨찾기 크로스 브라우징

북마크(즐겨찾기로 알려진)는 웹페이지를 브라우저에 저장해두고 바로가기하는 기능입니다.

필요에 따라 사용자가 언제든지 페이지를 즐겨찾기에 추가할 수 있지만, 이를 구현하는 동작을 웹페이지에 추가하는 디자인이 국내에서는 꽤 자주 사용됩니다.


[브라우저 지원사항]

- IE 모든 브라우저 지원

- Chrome 단축키 알림을 띄움

- Opera 단축키 알림을 띄움

- Firefox 지원

- Safari 테스트 못해봄


[HTML 구조]

즐겨찾기 버튼을 원하는 페이지에 삽입합니다

<a href="#" id="favorite" title="즐겨찾기 등록">즐겨찾기</a>


[자바스크립트]

jQuery를 이용해 아래와 같이 구성됩니다. 이를 순수 자바스크립트 함수로 만들어 사용해도 무관합니다.

<script>

$(document).ready(function() {

    $('#favorite').on('click', function(e) {

var bookmarkURL = window.location.href;

var bookmarkTitle = document.title;

var triggerDefault = false;


if (window.sidebar && window.sidebar.addPanel) {

    // Firefox version < 23

    window.sidebar.addPanel(bookmarkTitle, bookmarkURL, '');

} else if ((window.sidebar && (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)) || (window.opera && window.print)) {

    // Firefox version >= 23 and Opera Hotlist

    var $this = $(this); $this.attr('href', bookmarkURL);

    $this.attr('title', bookmarkTitle);

    $this.attr('rel', 'sidebar');

    $this.off(e);

    triggerDefault = true;

} else if (window.external && ('AddFavorite' in window.external)) {

    // IE Favorite

    window.external.AddFavorite(bookmarkURL, bookmarkTitle);

} else {

    // WebKit - Safari/Chrome

    alert((navigator.userAgent.toLowerCase().indexOf('mac') != -1 ? 'Cmd' : 'Ctrl') + '+D 키를 눌러 즐겨찾기에 등록하실 수 있습니다.');

}


return triggerDefault;

    });

});

</script>


댓글목록

등록된 댓글이 없습니다.

  • Addr.부산광역시 부산진구 중앙대로 666번길 50, 더샵센트럴스타 CEO. 이경애 Email. gnuwiz@naver.com
  • BR. 625-68-00172 TRC. 2019-부산해운대-1186 TEL. 0507-1382-2790
Copyright © 2017 ~ 그누위즈. All rights reserved.