"JQuery 토스트 toastr"의 두 판 사이의 차이

10번째 줄: 10번째 줄:
toastr.options = {
toastr.options = {
"progressBar": true,
"progressBar": true,
        timeOut: 1000,
}
}
$('#show-toast').click( function() {
$('#show-toast1').click( function() {
toastr.success("안녕하세요?")
toastr.success("안녕하세요?")
});
});
    $('#show-toast2').click( function() {
        toastr.warning("안녕하세요?", "제목", {timeOut: 5000});
    });
});
});
</script>
</script>


<button id='show-toast'>토스트!</button>
<button id='show-toast1'>토스트 #1</button>
<br>
<br>
<button id='show-toast2'>토스트 #2</button>
</source>
</source>
<jsfiddle height='350'>rkw1kmgd</jsfiddle>
<jsfiddle height='350'>rkw1kmgd</jsfiddle>

2015년 8월 10일 (월) 11:18 판

jQuery 토스트 toastr

1 예시

<link rel='stylesheet' href='//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css'/>
<script src='//code.jquery.com/jquery.min.js'></script>
<script src='//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js'></script>
<script>
$(function() {
	toastr.options = {
		"progressBar": true,
        timeOut: 1000,
	}
	$('#show-toast1').click( function() {
		toastr.success("안녕하세요?")
	});
    $('#show-toast2').click( function() {
        toastr.warning("안녕하세요?", "제목", {timeOut: 5000});
    });
});
</script>

<button id='show-toast1'>토스트 #1</button>
<br>
<br>
<button id='show-toast2'>토스트 #2</button>

2 참고 자료

문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}