| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | |
| 7 | 8 | 9 | 10 | 11 | 12 | 13 |
| 14 | 15 | 16 | 17 | 18 | 19 | 20 |
| 21 | 22 | 23 | 24 | 25 | 26 | 27 |
| 28 | 29 | 30 |
- 킹북이초월
- 티스토리
- 알리익스프레스
- iptime
- 소비전력
- KB증권
- 자바스크립트
- html/css
- 복현오거리
- Apache
- centos
- 시놀로지
- 알뜰폰
- KB국민카드
- 아파치
- Ajax
- php
- 램가스초월
- SKT
- 가상서버호스팅
- 거제도
- jQuery
- 스톤에이지
- proxmox
- 보르비스초월
- 리눅스
- mysql
- 워드프레스
- 윈도우10
- ConoHa
- Today
- Total
맛집 여행 캠핑 일상 생활
jQuery custom Alert 사용하기 본문
jQuery custom Alert 사용하기
자바스크립트의 기본 함수인 alert 은 단순히 메시지만 뿌려주기 때문에 color 를 넣을 수도 없고 크기를 변경할 수도 없다.
이럴때 jAlert 을 사용하면 사용자에 맞게 custom alert 팝업을 구현할 수가 있다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery Alert</title>
<script src="http://labs.abeautifulsite.net/archived/jquery-alerts/demo/jquery.js" type="text/javascript"></script>
<script src="http://labs.abeautifulsite.net/archived/jquery-alerts/demo/jquery.ui.draggable.js" type="text/javascript"></script>
<script src="http://labs.abeautifulsite.net/archived/jquery-alerts/demo/jquery.alerts.js" type="text/javascript"></script>
<link href="http://labs.abeautifulsite.net/archived/jquery-alerts/demo/jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" />
<script>
function cAlert(msg, title) {
msg = "<span style='font-size:12pt;color:#0000FF;'>" + msg + "</span>";
jAlert(msg, title);
}
</script>
</head>
<body>
<button onclick="cAlert('Hello world');">커스텀 alert</button>
</body>
</html>
아래 버튼을 눌러보세요~
http://labs.abeautifulsite.net 이 이제 안되는가 보네요~
'jQuery' 카테고리의 다른 글
| jQuery 브라우저 F12 키 막기 (0) | 2016.07.11 |
|---|---|
| jQuery 마우스 우측 드래그 선택 막기 (0) | 2016.07.06 |
| jQuery ajax 비동기식 및 동기식 처리 방식 (0) | 2016.06.20 |
| jQuery 배열 each click 처리 (0) | 2016.06.15 |
| jQuery 팝업 바깥영역 마우스클릭시 팝업 닫기 예제 (0) | 2016.06.14 |