토스트 알림
포스트
취소

토스트 알림

환경 설정

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css" 
integrity="sha512-3pIirOrwegjM6erE5gPSwkUzO+3cTjpnV9lexlNZqvupR64iZBnOOTiiLPb9M36zpMScbmUNIcHUqKD47M719g==" 
crossorigin="anonymous" referrerpolicy="no-referrer" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js" 
integrity="sha512-VEd+nq25CkR676O+pLBnDW09R7VQX9Mdiij052gVCp5yVH3jGtH70Ho/UUv4mJDsEdTvqRCFZg0NKGiojGnUCw==" 
crossorigin="anonymous" referrerpolicy="no-referrer"></script>

사용 방법

  • 기본 형식 : toastr.메소드명(제목, 내용, 옵션);
  • 제목 생략 후 내용만 입력할 수도 있다.
function toast_succeess(){
    toastr.success('toast_succeess');
}
function toast_info(){
    toastr.info('toast_info');
}
function toast_warning(){
    toastr.warning('toast_warning');
}
function toast_error(){
    toastr.error('toast_error');
}

옵션 설정

toastr.options = {
    "closeButton": false,
    "debug": false,
    "newestOnTop": false,
    "progressBar": true,
    "positionClass": "toast-top-right",
    "preventDuplicates": false,
    "onclick": null,
    "showDuration": "100",
    "hideDuration": "1000",
    "timeOut": "1500",
    "extendedTimeOut": "1000",
    "showEasing": "swing",
    "hideEasing": "linear",
    "showMethod": "fadeIn",
    "hideMethod": "fadeOut"
}
이 기사는 저작권자의 CC BY 4.0 라이센스를 따릅니다.