alert 바꿔서 효과주기(sweetalert)
alert 에 효과를 주는 스크립트입니다.
적용하면 기본으로 적용됩니다. 자세한 내용은 사이트를 참조하시면 됩니다.
https://sweetalert.js.org/
적용하실 페이지나 그누보드 head 에 넣어서 전체 적용하셔도 됩니다.
[code]
add_javascript('<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>', 10);
[/code]
변경하실 코드에 alert 를 swal 로 변경하시면 끝입니다.
[code]
swal("상품을 장바구니에 추가하였습니다.", "", "success");
[/code]
댓글 13개
좋은정보 감사합니다.
감사합니다. '◡'
업그레이드 버전도 있습니다. 개인적으로는 구버전이 뭔가 더 부드럽게 느껴지네요,
https://sweetalert2.github.io
감사합니다. 너무 좋네요.
저처럼 alert을 여러군데서 쓴다면 일일이 바꿔줘여 해서 좀 불편할 때는 다음과 같이 하면 좀더 편하게 하실수 있어요.
SweetAlert2 (swal)를 사용하여 기존의 모든 alert을 그대로 사용하면서 swal로 다 대체할 수 있습니다. 다음과 같이 구현할 수 있습니다.
head.sub.php에
[code]
// ... existing code ...
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
// ... existing code ...
[/code]
그리고 모든 alert을 swal로 대체하기 위해 다음 JavaScript 코드를 head.php 파일에 추가하세요.
[code]
// ... existing code ...
<script>
// 기존 스크립트 유지
$(function(){
$(".gnb_menu_btn").click(function(){
$("#gnb_all, #gnb_all_bg").show();
});
$(".gnb_close_btn, #gnb_all_bg").click(function(){
$("#gnb_all, #gnb_all_bg").hide();
});
});
// alert을 swal로 대체
window.alert = function(message) {
Swal.fire({
text: message,
icon: 'info',
confirmButtonText: '확인'
});
};
</script>
// ... existing code ...
[/code]
이렇게 하면 기존의 모든 alert() 호출이 자동으로 SweetAlert2로 대체됩니다.
기존 alert코드를 수정할 필요가 없습니다.
@케빈엉클 우왓! 너무 감사합니다. :)
@케빈엉클
감사합니다. 비회원 상태나 주소이동이 있는 경우 그냥 경고창으로 나오는데 이것도 바꿀수 있는 방법이 있나요?
@페레이라 비회원..그건 상관없이 작동되야합니다...주소이동은 새창으로 이동되면 당연히 새창에 새로운 SWAL문을 입력하지않는한 작동안될겁니다.
계속 안되면 안되는 url이나 부분 source를 알려주시면 확인될수도 있을 듯 합니다.
감사합니다.
감사 합니다.
감사합니다
호호호 이윰에 이전부터 있던데 이쁘드라구요
감사합니다
감사합니다
감사합니다.
게시판 목록
그누보드5 팁자료실
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 공지 | 3년 전 | 4413 | ||
| 2604 | 8개월 전 | 674 | ||
| 2603 | 8개월 전 | 734 | ||
| 2602 | 8개월 전 | 648 | ||
| 2601 |
|
8개월 전 | 671 | |
| 2600 |
|
8개월 전 | 579 | |
| 2599 | 8개월 전 | 809 | ||
| 2598 | 8개월 전 | 602 | ||
| 2597 |
다케미카코
|
8개월 전 | 756 | |
| 2596 | 8개월 전 | 854 | ||
| 2595 |
|
8개월 전 | 446 | |
| 2594 | 9개월 전 | 608 | ||
| 2593 |
만두먹고또먹고
|
9개월 전 | 938 | |
| 2592 | 9개월 전 | 612 | ||
| 2591 | 9개월 전 | 620 | ||
| 2590 | 9개월 전 | 688 | ||
| 2589 |
|
9개월 전 | 758 | |
| 2588 | 9개월 전 | 477 | ||
| 2587 | 9개월 전 | 796 | ||
| 2586 | 9개월 전 | 643 | ||
| 2585 | 9개월 전 | 511 | ||
| 2584 | 9개월 전 | 577 | ||
| 2583 | 9개월 전 | 498 | ||
| 2582 | 9개월 전 | 643 | ||
| 2581 | 9개월 전 | 598 | ||
| 2580 |
만두먹고또먹고
|
9개월 전 | 517 | |
| 2579 |
|
9개월 전 | 664 | |
| 2578 | 9개월 전 | 647 | ||
| 2577 | 9개월 전 | 627 | ||
| 2576 | 9개월 전 | 562 | ||
| 2575 |
이슈DEV
|
10개월 전 | 993 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기