336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요. 이번엔 JAVASCRIPT에서 background 이미지와 이미지 크기 및 반복 안하는 방법에 대해서 간단하게 알려드리겠습니다..
1
2
3
4
5
6
7
8
9
10
11
12
13
14 |
<script>
window.onload = function(){
//반복제거, url
document.getElementById("div").style.backgroundRepeat = "no-repeat";
//이미지 등록
document.getElementById("div").style.backgroundImage = "url('해당파일위치')";
//이미지 사이즈
document.getElementById("div").style.backgroundSize = "200px";
}
</script>
<div id='div'>
</div>
|
cs |
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요. 이번엔 JQUERY에서 URL을 가져오는 방법을 알려드리겠습니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14 |
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
window.onload = function(){
//전체주소
console.log("url : "+$(location).attr('href'));
//http:, localhost:port번호, index.html ?test=tttt 순으로 나누어져 있습니다.
console.log("url : "+$(location).attr('protocol')+"//"+$(location).attr('host')+""+$(location).attr('pathname')+""+$(location).attr('search'));
}
</script>
|
cs |
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요. 이번엔 JAVASCRIPT URL의 Parameter를 처리하는 방법을 알려드리겠습니다.
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 |
function getParams() {
// 파라미터가 담길 배열
var param = new Array();
// 현재 페이지의 url
var url = decodeURIComponent(location.href);
// url이 encodeURIComponent 로 인코딩 되었을때는 다시 디코딩 해준다.
url = decodeURIComponent(url);
var params;
// url에서 '?' 문자 이후의 파라미터 문자열까지 자르기
params = url.substring( url.indexOf('?')+1, url.length );
// 파라미터 구분자("&") 로 분리
params = params.split("&");
// params 배열을 다시 "=" 구분자로 분리하여 param 배열에 key = value 로 담는다.
var size = params.length;
var key, value;
for(var i=0 ; i < size ; i++) {
key = params[i].split("=")[0];
value = params[i].split("=")[1];
param[key] = value;
}
return param;
}
|
cs |
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요. URL주소를 가져오는 방법을 알려드릴께요
|
|
<script>
window.onload = function(){
//전체주소
console.log("url : "+location.href);
//http:, localhost:port번호, index.html ?test=tttt 순으로 나누어져 있습니다.
console.log("url : "+location.protocol+"//"+location.host+""+location.pathname+""+location.search);
}
</script>
|
cs |
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요. 이번엔 html의 attribute를 이용해서 처리하는 방법을 알려드릴께요
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
31
32
33
34 |
<meta charset="utf-8"/>
<html>
<head>
<title>JDK의 블로그</title>
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script language="javascript">
$(document).ready(function(){
//같은 event를 여러개로 지정했습니다.
//input[id] input 태그중에서 ID속성을 가지고 있는지
//span태그의 class=jdkddd인 경우만
//span의 class가 og가 아닌경우
//input class가 te로 시작하지 안는경우
//input name가 kd로 포함하는 경우
$("input[id], span[class='jdkddd'], span[class$='og'], input[class^='te'], span[name*='kd']").click(function(){
alert("jdk's blog Jquery");
});
});
</script>
</head>
<body>
<input type='button' class='test' value='버튼'/>
<input type='button' id='test' value='버튼'/><br/>
<span class='jdkddd'>버튼1</span><br/>
<span name='kd'>버튼2$</span><br/>
<div>
<span class='blog'>div 버튼안에span</span>
</div>
</body>
</html>
|
cs |
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요 jquery에서 seleter와 click이벤트에 대해서 알아보겠습니다.
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
31
32 |
<meta charset="utf-8"/>
<html>
<head>
<title>JDK의 블로그</title>
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script language="javascript">
$(document).ready(function(){
//같은 event를 여러개로 지정했습니다.
//#test는 ID가 test의 경우에 처리합니다.
//.test는 Class가 test의 경우에 처리합니다.
//span은 태그 이름이 span인 경우 처리합니다.
//div.span은 div태그 밑에 span태그인 경우에 처리합니다.
$("#test,.test,span,div.span").click(function(){
alert("jdk's blog Jquery");
});
});
</script>
</head>
<body>
<input type='button' class='test' value='버튼'/>
<input type='button' id='test' value='버튼'/><br/>
<span>버튼</span><br/>
<div>
<span>div 버튼안에span</span>
</div>
</body>
</html>
|
cs |
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요. 이번엔 javascript에서 onload와 jquery처음시작시에 불러오는 ready에 대해서 알아볼 예정입니다.
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 |
<meta charset="utf-8"/>
<html>
<head>
<title>JDK의 블로그</title>
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script language="javascript">
//window.onload는 javascript로써 똑같이 시작시에 합니다.
//다만 jquery보다 늦게합니다.
window.onload = function(){
alert("jdk's blog Window");
}
//winodw.onload 보다 일찍합니다.
$(document).ready(function(){
alert("jdk's blog Jquery");
});
</script>
</head>
<body>
</body>
</html>
|
cs |
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요 이번엔 응용으로 특수문자를 차단하는 함수를 알려드릴께요.
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
31
32
33
34
35
36
37
38
39 |
//특수문자 막음처리
function checkSpecial(inputBox){
var keyValue = event.keyCode;
//특수문자배제
if((keyValue >= 123 && keyValue <= 130) || (keyValue >= 33 && keyValue <= 47) || (keyValue >= 58 && keyValue <= 64) || (keyValue >= 91 && keyValue <= 96)) return false;
}
//특수문자 막음처리 이메일용
function checkSpecial_Email(inputBox){
var keyValue = event.keyCode;
//특수문자배제
if((keyValue >= 123 && keyValue <= 130) || (keyValue >= 33 && keyValue <= 47) || (keyValue >= 58 && keyValue <= 64) || (keyValue >= 91 && keyValue <= 96))
if(keyValue != 64 && keyValue != 46){
return false;
}
}
//특수문자 막음처리 주소용
function checkSpecial_Addr(inputBox){
var keyValue = event.keyCode;
//특수문자배제
if((keyValue >= 123 && keyValue <= 130) || (keyValue >= 58 && keyValue <= 126))
if(keyValue != 45){
return false;
}
}
//숫자가 아니면 처리하는 함수
function checkNumber(inputBox){
var keyValue = event.keyCode;
if((keyValue >= 33 && keyValue <= 47) || (keyValue >= 33 && keyValue <= 47) || (keyValue >= 58 && keyValue <= 64) || (keyValue >= 91 && keyValue <= 96) || keyValue >= 123)
return false;
}
|
cs |
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
안녕하세요 이번엔 setAttribute로 값을 유지하는 방법을 알려드릴께요
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22 |
<meta charset="utf-8"/>
<html>
<head>
<title>JDK의 블로그</title>
<script language="javascript">
//버튼클릭시 javascript 호출합니다.
function javascript(){
//setAttribute로 innerHTML시에 값유지
document.getElementById("test").setAttribute("value",document.getElementById("test").value);
document.getElementById("divId").innerHTML += "<input type='text' name='' id=''/>";
}
</script>
</head>
<body>
<input type='button' onclick='javascript()' value='버튼'/>
<div id='divId'>
<input type='text' name='test' id='test'/>
</div>
</body>
</html>
|
cs |
값을 입력하고, 버튼클릭시에 test값이 유지됩니다.
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
이번엔 팝업창에서 자기자신창을 닫는 방법을 간단하게 보여드릴꼐요..
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 |
<meta charset="utf-8"/>
<html>
<head>
<title>JDK의 블로그</title>
<script language="javascript">
//버튼클릭시 javascript 호출합니다.
function javascript(){
self.close(); //자기자신창을 닫습니다.
}
</script>
</head>
<body>
<input type='button' onclick='javascript()' value='버튼'/>
</body>
</html>
|
cs |