java, c# , linux, program devloper

javascript 숫자 만 쓰기 , 숫자체크 , 숫자만허용, numberic: 2012/02/10

폰트, style 정리: 2012/01/16

[DIV 겹치기] - html,css: 2012/01/16

ajax, jquery 예제, ajax 예제: 2012/01/05

로컬스토리지, Local Storage: 2011/12/30

SCROLL BAR , 스크롤바 디자인 변경: 2011/12/30

mouseDrage, 마우스 드레그 안되게 하려면: 2011/12/08

meta redirect, 메타 리다이렉트, 메타 테그: 2011/11/02

javascript, removeChild, appendChild: 2011/11/01

IE6 체크: 2011/10/27

Posted 2012/02/10 17:13

Filed under Htm&Javascript

<input type="text" onKeyDown = "onlyNumberInput(this)" />

function onlyNumberInput(obj){
var code = window.event.keyCode;

if ((code > 34 && code < 41) || (code > 47 && code < 58) || (code > 95 && code < 106) || code == 8 || code == 9 || code == 13 || code == 46){
window.event.returnValue = true;
return;
}
window.event.returnValue = false;
}

onKeyup="" 데이터 처리를 한다. ex)

function nvaridate(obj){

var val = parseInt(obj.value);
obj.value =val;

if(obj.id=="s_score1"){

if(val > cooking_contest1 ){
obj.value=cooking_contest1;
}
calc_t1();
}

if(obj.id=="s_score2"){
if( val > cooking_contest2){
obj.value=cooking_contest2;
}
calc_t1();
}

if(obj.id=="s_score3"){
if( val > cooking_contest3){
obj.value=cooking_contest3;
}
calc_t1();
}

if(obj.id=="s_score4"){
if( val > cooking_contest4){
obj.value=cooking_contest4;
}
calc_t1();
}

if(obj.id=="s_score5"){
if( val > cooking_contest5){
obj.value=cooking_contest5;
}
calc_t3();
}
}//end function

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed

Trackbacks0
Comments0

Posted 2012/01/16 18:05

Filed under Htm&Javascript

[원문] : http://perfdrug.tistory.com/71

[링크 1] :
http://mwultong.blogspot.com/2006/11/html-css-css-font.html

[링크 2]: 장평 / 자간
http://blog.naver.com/PostView.nhn?blogId=zcmmp&logNo=20034271631

- 괄호안은 자바스크립트에서 접근할때 쓰는 프로퍼티. 대부분 하이픈 다음의 글자는 대문자로 바꾸면 된다.

++ 폰트 관련 ++
1. font-family (fontFamily)
- 폰트의 종류를 지정

2. font-size (fontSize)
   - 폰트의 크기를 지정
   - 상대적 크기를 결정하려면 em, pt 사용, 절대적 크기는 px 사용
   - 이전 폰트와의 상대적 크기는 지정할때는 smaller, larger 사용

3. font-size-adjust (fontSizeAdjust)
   - 영문 소문자 x의 높이와 font-size 지정된 높의 비율을 지정, 거의 사용 안함.

4. font-stretch (fontStretch)
   - 폰트의 장평을 지정
   - 사용할 수 있는 값 : noraml, wider, narrower, ultra-condensed, extra-condensed,
condensed, semi-condensed, semi-expanded, expanded,
ultra-expanded, extra-expanded

5. font-style (fontStyle)
   - 폰트에 간단한 효과를 줌.
   - normal, italic, oblique

6. font-variant (fontVariant)
   - 글씨를 작은 대문자로 표기하고 싶을때 small-caps 사용

7. font-weight
   - 폰트의 굵기를 성정
   - noraml, bold, bolder, lighter 또는 100, 200,300, 400 .. 900 까지

++ 텍스트 관련 ++
1. color
   - 색상 지정

2. line-height (lineHeight)
   - 줄 간견( 윗 줄과 아랫 줄의 간격) 지정
   - 폰트 크기 지정하는 방법과 같음

3. text-decoration (textDecoration)
   - 텍스트를 꾸밈 : none, underline, overline, line-through

4. text-indent
   - 들여쓰기 지정

5. text-transform (textTransform)
   - 대문자 소문자 지정
   - capitalize(모든 단어의 첫글자를 대문자로), uppercase, lowercase

6. white-space
   - noraml, pre, nowrap 중 하나로 지정

7. direction
   - ltr(왼쪽에서 오른쪽), rtl(오른쪽에서 왼쪽) 중 하나 지정

8. text-align (textAlign)
   - 정렬방식 지정

9. word-spacing (wordSpacing)
   - 단어 사이의 간격 지정

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed

Trackbacks0
Comments0

Posted 2012/01/16 17:59

Filed under Htm&Javascript

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed

Trackbacks0
Comments0

Posted 2012/01/05 11:30

Filed under Htm&Javascript

ajax, jquery 예제, ajax 예제

//ajax 처리

var url = url_ajax_mcategory_connect;
var _data = "mode=" + mode + "&c_1=" + c_1.value + "&c_2=" + c_2.value + "&c_uid="+c_uid + "&uid=" + uid.value;

$.ajax({
type:"GET",
cache:false,
async:true,
url: url,
data: _data,

success: function(msg){
if(mode=="insert"){
var c_uid = document.getElementById("c" + n + "_uid");
c_uid.value = msg;
}

}//end success
}); //end ajax

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed

Trackbacks0
Comments0

Posted 2011/12/30 13:34

Filed under Htm&Javascript

[원문] : http://croute.me/419

Web Storage란?
웹 스토리지란 클라이언트쪽에 소량의 데이터를 저장해 두기 위한 스토리지입니다.

웹 스토리지를 다룰때는 그동안 일반적으로 사용되던 쿠키와 많이 비교를 하게 되는데요,
간단하게 한번 보도록 하겠습니다.

쿠키

4KB의 저장 용량, 크기가 작다.
같은 사이트내에서 둘 이상의 탭을 열었을 때, 둘 이상의 트랜젝션 추적에 어려움이 있다.
이 외에도 여러 보안문제가 있다.

웹 스토리지

사양에 따르면 크기 제한이 없다.
서버로 보내지 않는다.(원하면 명시적으로 보낼 수 있다.)
유효기간이 없다.
JavaScript 객체를 저장할 수 있다.(정확하게는 객체의 복사본이 저장된다.)
웹 스토리지에는 Session Storage와 Local Storage가 있다.

키와 값

Web Storage는 간단하게 키와 값으로 데이터를 저장할 수 있습니다.
또한 해당하는 키를 통해 값을 꺼낼 수 있습니다.

웹 스토리지의 유효 범위

웹 스토리지의 유효범위는 Session Storage와 Local Storage에 약간 차이가 있습니다.
먼저 그림으로 살펴보고 아래의 내용을 읽어보면 쉽게 이해할 수 있습니다.

Session Storage
- 도메인마다 따로 생성된다.
- 윈도우(window 객체)와 같은 유효범위와 생존기간을 가진다. (같은 도메인이라도 윈도우마다 따로 생성된다.)
- 윈도우 복제로 생성된 경우, 스크립트를 이용해 새 창을 연 경우 같은 값을 가진 세션 스토리지가 "복제"된다.
- 새로 생성된 윈도우와 기존 윈도우의 세션 스토리지는 서로 영향을 주지 않는다.

Local Storage
- 도메인마다 따로 생성된다.
- 지속기간에 제한이 없다. 사용자가 명시적으로 지우지 않는 한 영구적으로 저장된다.
- 도메인이 다르면 서로의 로컬 스토리지에 접근할 수 없다. (hi.croute.me와 hello.croute.me는 다른 로컬 스토리지)
- 같은 도메인, 예를들면 croute.me에 소속된 웹페이지는 모두 같은 로컬 스토리지를 가진다.(접근한다.)
- Cookie를 이용한 사이트 고유 설정 정보등을 대신하기에 적당하다.

세션과 로컬의 차이점은 로컬은 지속성(보존)을 가지기 때문에 여러 창을 켜도 같은 도메인이라면, 같은 스토리지를 사용하는 것입니다.
세션 스토리지는 각 세션마다 새로운 스토리지를 사용하고 폐기합니다.

웹 스토리지 메소드

스토리지의 메소드는 세션 스토리지와 로컬 스토리지의 메소드가 같습니다.

메소드	설명
length	스토리지에 저장된 데이터의 수를 반환
key(index)	지정된 인덱스의 키를 반환하고 키가 없다면 null 반환
getItem(key)	지정된 키에 대응하는 데이터를 반환
setItem(key, data)	지정된 키로 스토리지에 데이터를 저장
removeItem(key)	지정된 키에 대응하는 데이터를 삭제
clear()	모든 데이터를 스토리지에서 삭제

아래는 로컬 스토리지를 통해 알아본 저장/읽기/삭제에 대한 사용 예입니다.
메소드를 통하지 않은 키를 통한 직접적인 접근도 할 수 있습니다.

// 저장 
localStorage.croute = "good job"; 
localStorage["croute"] = "good job"; 
localStorage.setItem("croute", "good job"); 
  
// 읽기 
var croute = localStorage.croute; 
var croute = localStorage["croute"]; 
var croute = localStorage.getItem["croute"]; 
  
// 삭제 
delete localStorage.croute; 
delete localStorage["croute"]; 
localStorage.removeItem("croute");



아래는 for loop를 사용해서 storage에 저장된 모든 값을 가져오는 코드입니다.

for(var i = 0; i < localStorage.length; i++) 
{ 
    var key = localStorage.key(i); 
    var value = localStorage[key]; 
}

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed

Trackbacks0
Comments0

Posted 2011/12/30 10:06

Filed under Htm&Javascript

웹표준/Html

scroll-bar 디자인

인터넷 익스플로러의 스크롤 바의 색상을 지정할 때 쓰이는 익스플로러만의 css입니다.(IE 5.5이상 적용)

다른 브라우저에는 적용되지 않습니다.
또, html문서의 Doctype을 xhtml로 정할 경우에는 IE에서도 효과가 나타나지 않습니다.

스크롤 바 색상 지정

</style>

scrollbar.htm

스크롤바 색상 적용해

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed

Trackbacks0
Comments0

Posted 2011/12/08 12:28

Filed under Htm&Javascript

body 태그에
onselectstart="return false" ondragstart="return false"
다음과 같이 넣어 주면 됩니다.

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed

Trackbacks0
Comments0

Posted 2011/11/02 10:56

Filed under Htm&Javascript

<html>

</html>

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed

Trackbacks0
Comments0

Posted 2011/11/01 08:54

Filed under Htm&Javascript

<html>
<body>
<script language="JavaScript">
function function2() {
var m = "New Element";
var n = document.createElement("li");
n.appendChild(document.createTextNode(m));
document.getElementById("myList").appendChild(n);
}
function function2() {
myList.removeChild(myList.lastChild);
}
</script>
<ul id="myList">
<li>First list element</li>
<li>Second list element</li>
</ul>
<input type="button" value="Add list item" onClick="function2();">
<input type="button" value="Remove added items" onClick="function2();">
</body>
</html>

Posted by java, tomcat, c#

Response

You can track responses via RSS / ATOM feed