시작페이지로 즐겨찾기추가
로그인
회원가입 l 출석체크 l 마이페이지 l CGIMALL
happycgi
자료실 사이트등록 랭킹100 프로그램리뷰 관리자추천자료 초보가이드
커뮤니티
전체 펼쳐보기
퀵메뉴링크 jquery , CSS , PHP , Javascript , 무료폰트 , ASP
상세검색
 > JAVASCRIPT > javascript 소스창고 > 윈도우창관련 > Jquery 와 Bootstrap 를 이용한 notify(알림) 상세정보
사이트등록
클라우드태그
Javascript
PHP
CSS
html
asp
API
jquery
mysql
image
Mobile
slide
게시판
메뉴
현재접속자 33 새로고침
Jquery 와 Bootstrap 를 이용한 notify(알림)
소스통계정보 오류신고 및 문의
해피팀
네티즌
트위터로 보내기 페이스북으로 보내기 네이버로공유
소스분류 윈도우창관련
다운로드 횟수 143 회
간단설명 Jquery 와 Bootstrap 를 이용한 notify(알림)
평가하기 훌륭함 매우좋음 좋음 괜찮음 보통 별로
홈페이지바로가기 소스다운로드 데모 미리보기 스크랩하기

Notify는 닫기 버튼과 Font Awesome 아이콘이있는 Bootstrap 알림 표시 줄을 만드는 가벼운 jQuery 플러그인입니다.

플러그인을 사용하면 다른 jQuery / JavaScript 이벤트에서 여러 동적 알림을 트리거 할 수 있습니다.

가까운 오류, 성공, 정보 및 경고 알림 메시지를 사용자에게 쉽게 표시 할 수 있습니다.

또한 이러한 CSS3 스타일 알림 바는 최상의 사용자 경험을 제공합니다.

알림 메시지는 자동으로 사라지지만 수동으로 닫을 수도 있습니다.

라이센스는 MIT 라이센스 입니다.



1.라이브러리 및 CSS를 호출하세요.

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="css/notify.min.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="js/notify.min.js"></script>




2.버튼을 하나 만들어 보세요.

<button id="btn-test" class="btn btn-sm btn-block btn-primary">클릭해주세요.</button>



3.버튼에 각종 이벤트를 걸어 보세요.
jQuery / JavaScript 이벤트 (click, mouseenter, mousemove, mouseleave, submit 등)를 사용하여 알림을 표시 할 수 있습니다.

$('#btn_test').on('click',function(){
    notify('bell','Title of the message!','This is a sample message! Lorem ipsum!');
});



4.결과를 확인해 보세요. 




5.notify 종류는 여러가지가 있고 커스텀도 가능 합니다. 


 


네티즌 의견   이용하신 자료의 후기를 자유롭게 작성하세요. (상업적인 광고 및 도배성 글 등은 사전통보없이 삭제될 수 있습니다.)
내용 아이디 의견남기기
등록된 의견이 없습니다.
1
이름
내용
:네맞아요: :화나는군요: :잠와: :우울해: :이건아냐: :왕하하: 왕웃음~ 놀램~
평가하기 훌륭함 매우좋음 좋음 괜찮음 보통 별로
도배방지키
 25518330 보이는 도배방지키를 입력하세요.