'JavaScript'에 해당되는 글 16건

  1. 2011.05.20 jquery live
  2. 2010.12.20 세션유지
  3. 2010.10.09 Side Tab
  4. 2010.10.07 팝업 띄우기 주소보안 방법.
  5. 2010.09.26 유용한 놈들
  6. 2010.09.12 jQuery Plug-in
  7. 2010.08.31 jQuery UI Tab Header 없애기 1
  8. 2010.08.30 jQuery 1.4변경사항
  9. 2010.08.27 유용한 놈들(jQuery)
  10. 2010.08.06 구현한 놈들

jquery live

JavaScript 2011. 5. 20. 18:22 |
jquery live에 이벤트 여러개 지정할 수가 잆다능..

$('.hoverme').live('mouseover mouseout click', function(event) {
  if (event.type == 'mouseover') {
 $(this).addClass("ov");
  } else if (event.type == 'mouseout') {
 $(this).removeClass("ov");
  } else if (event.type == 'click') {
 
  }
});
 
저작자표시

'JavaScript' 카테고리의 다른 글

세션유지  (0) 2010.12.20
Side Tab  (0) 2010.10.09
팝업 띄우기 주소보안 방법.  (0) 2010.10.07
유용한 놈들  (0) 2010.09.26
jQuery Plug-in  (0) 2010.09.12
Posted by 기계식키보드
:

세션유지

JavaScript 2010. 12. 20. 11:01 |
 <c:if test="${not empty sessionScope.userData}">  
jQuery.fjTimer({ interval: 1000*60*15, repeat: true, tick: function(counter, timerId) {
if (confirm("회원님의 보안을 위하여 5분 후 로그아웃 됩니다.\n로그인 상태를 계속 유지하시겠습니까?")) {
$.post('/sessionContinue.html', {}, function(data) {
if( !data.isSuccess ) {
alert("시간이 많이 지나 자동으로 로그아웃이 되었습니다.\n현재 작업 중이던 정보가 제대로 저장되지 않을 수 있습니다.\n다시 로그인 해주세요.");
}  
}, "json");
} 
}});  
저작자표시

'JavaScript' 카테고리의 다른 글

jquery live  (0) 2011.05.20
Side Tab  (0) 2010.10.09
팝업 띄우기 주소보안 방법.  (0) 2010.10.07
유용한 놈들  (0) 2010.09.26
jQuery Plug-in  (0) 2010.09.12
Posted by 기계식키보드
:

Side Tab

JavaScript 2010. 10. 9. 18:10 |
종종 나오는 케이스라서 기록해 놓는다. C&P방법론 적용하여 구현하자.
모양은 아래와 같다.
우측 탭 마우스 오버시 왼쪽 이미지가 변한다.



한 방에 긁어 성공하려면 이미지 이름이 다음과 같이 되어야 한다.
왼쪽 큰 이미지 >> 이미지 이름 끝에 1~n까지의 순번 부여 
<img id="changeImage" src="/images/fortune/gunghap_box1.gif" />
(gunghap_box2, gunghap_box3, gunghap_box4 ...)

오른 쪽 탭 이미지 >> over이미지일 경우이미지 명이  ov.gif, 아닐경우 or.gif로 끝나게
<img src="/images/fortune/gunghap_index_tab01ov.gif" class="imgOv" />
<img src="/images/fortune/gunghap_index_tab02or.gif" class="imgOv"  />
<img src="/images/fortune/gunghap_index_tab03or.gif" class="imgOv"  />
<img src="/images/fortune/gunghap_index_tab04or.gif" class="imgOv"  />


구현 소스는 다음과 같다.
----------------------------------------------------------------------------------
$("img.imgOv")
.addClass("pointer")
.bind('mouseover', function(){
$("img.imgOv").map(function(){
$(this).attr('src',$(this).attr('src').replace('ov.gif','or.gif'));
});
$(this).attr('src',$(this).attr('src').replace('or.gif','ov.gif'));


var idx = $("img.imgOv").index(this); $("#changeImage").attr('src', '/images/fortune/gunghap_box'+(idx+1)+'.gif'); $("#changeImage").show();
});

저작자표시

'JavaScript' 카테고리의 다른 글

jquery live  (0) 2011.05.20
세션유지  (0) 2010.12.20
팝업 띄우기 주소보안 방법.  (0) 2010.10.07
유용한 놈들  (0) 2010.09.26
jQuery Plug-in  (0) 2010.09.12
Posted by 기계식키보드
:

팝업 띄우기 주소보안 방법.

JavaScript 2010. 10. 7. 15:25 |
 


음 이건 그냥 동료에게 배운 편법이다.

현재 보통 팝업창을 뛰울때 
window.open(url,name,option); 
을 이용해서 팝업을 띄우기 마련이다.

하지만 url에 parameter들을 달고 가면 IE7부터는 주소창 보안에 걸리기 마련이다.

자 이츰해서 과연 어떻게 해야될까...

방법은 의외로 간단하다.
window.open('',name,option)
document.form 네임.target = name;
document.form 네임.method = post;
document.form 네임.action = 페이지;
document.form 네임.submit();

이렇게 되면 먼저 name이라는 이름을 가지는 팝업을 띄운 다음에
그 창을 타겟삼아서 submit을 시켜버린다.
이렇게 되면 일일히 parameter를 달고 갈 필요가 없어서 주소창 보안이 된다.
parameter가 많이 선언된 경우에는 속도쪽 문제를 감안해야되지만 
parameter의 값이 한글인 경우에도 어느정도 편하게 사용 할 수 있습니다!!
저작자표시

'JavaScript' 카테고리의 다른 글

세션유지  (0) 2010.12.20
Side Tab  (0) 2010.10.09
유용한 놈들  (0) 2010.09.26
jQuery Plug-in  (0) 2010.09.12
jQuery UI Tab Header 없애기  (1) 2010.08.31
Posted by 기계식키보드
:

유용한 놈들

JavaScript 2010. 9. 26. 15:06 |
String.prototype.number_format=function(){
  return this.replace(/(\d)(?=(?:\d{3})+(?!\d))/g,'$1,');
}

String.prototype.trim = function() {
  return this.replace(/^\s+|\s+$/g, "");
}

String.prototype.strip_tags = function(){
  return this.replace(/<\/?[^>]+>/gi, '');
}

String.prototype.only_number = function(){
  return this.replace(/[^0-9\.]/gi, '');
}

String.prototype.only_number_dot = function(){
  return this.replace(/[^0-9\.]/gi, '');
}

String.prototype.only_eng_number = function(){
  return this.replace(/[^0-9A-Za-z]/gi, '');
}

// 텍스트박스에 기본값이 넣어져 있고, 포커스가 오면 기본 값을 없앤다. 의외로 유용함
var isInit = new Array();
$("input.required")
.each(function(idx){
isInit.push(false);
$(this).bind('focus', function(){
if( isInit[idx] == false ) {
isInit[idx]=true;
$(this).val('');
}
});
});
저작자표시

'JavaScript' 카테고리의 다른 글

Side Tab  (0) 2010.10.09
팝업 띄우기 주소보안 방법.  (0) 2010.10.07
jQuery Plug-in  (0) 2010.09.12
jQuery UI Tab Header 없애기  (1) 2010.08.31
jQuery 1.4변경사항  (0) 2010.08.30
Posted by 기계식키보드
:

jQuery Plug-in

JavaScript 2010. 9. 12. 15:01 |
from
http://affo.springnote.com/pages/5597897





저작자표시

'JavaScript' 카테고리의 다른 글

팝업 띄우기 주소보안 방법.  (0) 2010.10.07
유용한 놈들  (0) 2010.09.26
jQuery UI Tab Header 없애기  (1) 2010.08.31
jQuery 1.4변경사항  (0) 2010.08.30
유용한 놈들(jQuery)  (0) 2010.08.27
Posted by 기계식키보드
:

jQuery UI Tab Header 없애기

JavaScript 2010. 8. 31. 20:46 |
기존에는 아래처럼 사용하여 문제없이 쓰고 있었다.
$("#dialog").dialog({
    autoOpen: false,
    /*height: 600,*/
    width: 400,
    modal: true,
    open:function() {
        $(this).parents(".ui-dialog:first").find(".ui-dialog-titlebar").remove();
    },
    close:function(){
        $("img.notPhone").show();
    },
    disabled: true ,
    resizable: false
});

그런데! 아래와 같은 방법도 있었네..
.ui-tabs > .ui-widget-header {
    background: #FFFFFF;
    border:0px;
    color:#FFFFFF;
    font-weight:bold;
}
.ui-tabs.ui-widget.ui-widget-content {
    background: #FFFFFF;
    border:0px;
}

.ui-tabs .ui-tabs-panel {
    background: #FFFFFF;
    border:1px solid #DDDDDD;
    margin: 0 !important;
}


저작자표시

'JavaScript' 카테고리의 다른 글

유용한 놈들  (0) 2010.09.26
jQuery Plug-in  (0) 2010.09.12
jQuery 1.4변경사항  (0) 2010.08.30
유용한 놈들(jQuery)  (0) 2010.08.27
구현한 놈들  (0) 2010.08.06
Posted by 기계식키보드
:

jQuery 1.4변경사항

JavaScript 2010. 8. 30. 15:55 |
http://firejune.com/1527

저작자표시

'JavaScript' 카테고리의 다른 글

jQuery Plug-in  (0) 2010.09.12
jQuery UI Tab Header 없애기  (1) 2010.08.31
유용한 놈들(jQuery)  (0) 2010.08.27
구현한 놈들  (0) 2010.08.06
정규식  (0) 2010.07.26
Posted by 기계식키보드
:

유용한 놈들(jQuery)

JavaScript 2010. 8. 27. 11:05 |
[ 숫자만 입력 받기 ]
$("#phone").bind('keyup', function(e){
$(this).val( $(this).val().replace(/[^0-9]/g, ""));
});

// 퍼센테이지 애니메이션
$("img.percentage").map(function(){
$(this).animate({"height":percentage[$("img.percentage").index(this)]},2000);
});


저작자표시

'JavaScript' 카테고리의 다른 글

jQuery UI Tab Header 없애기  (1) 2010.08.31
jQuery 1.4변경사항  (0) 2010.08.30
구현한 놈들  (0) 2010.08.06
정규식  (0) 2010.07.26
Ajax 뒤로가기 구현  (3) 2010.07.26
Posted by 기계식키보드
:

구현한 놈들

JavaScript 2010. 8. 6. 03:14 |

모양은 위와같다. 명세는 다음과 같다.
1. 한 페이지에 위와같은 탭이 n개 존재
2. 마우스 오버스 각 탭 이미지 토글
3. 각 페이지마다 탭의 색상이 다름
4. 탭 클릭시 해당 카테고리 위치로 문서내 이동

스크립트 구현)
<script type="text/javascript">
//<![CDATA[
$(function(){
// mouse over
$("table.fortuneAllTab a")
.hover(
   function(){
   $(this).children("img").attr('src', $(this).children("img").attr('src').replace('or.gif', 'ov.gif'));
   },
   function(){
   if( $(this).children("img").hasClass("selected") == false ) {
   $(this).children("img").attr('src', $(this).children("img").attr('src').replace('ov.gif', 'or.gif'));
   }
   }
);

// change tab color group by category
$("table.fortuneAllTab").each(function(idx){
$("table.fortuneAllTab:eq("+idx+") img").each(function(){
$(this).attr('src', $(this).attr('src').replace('bt_all01_', 'bt_all0'+(idx+1)+'_'));
});
});
// toggle current tab image
$("table.fortuneAllTab").each(function(){
var idx = $("table.fortuneAllTab").index(this);
var img = $("table.fortuneAllTab img[name=tab_"+idx+"]:eq("+idx+")");
img.attr('src', img.attr('src').replace('or.gif', 'ov.gif'));
img.addClass("selected");
});
});
//]]>
</script>  

DOM 구성)
<a name="tab_0"></a>
<table class="fortuneAllTab" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#tab_0"><img name="tab_0" src="/images/fortune_result/bt_all01_01or.gif" /></a></td>
<td><a href="#tab_1"><img name="tab_1" src="/images/fortune_result/bt_all01_02or.gif" /></a></td>
<td><a href="#tab_2"><img name="tab_2" src="/images/fortune_result/bt_all01_03or.gif" /></a></td>
<td><a href="#tab_3"><img name="tab_3" src="/images/fortune_result/bt_all01_04or.gif" /></a></td>
<td><a href="#tab_4"><img name="tab_4" src="/images/fortune_result/bt_all01_05or.gif" /></a></td>
<td><a href="#tab_5"><img name="tab_5" src="/images/fortune_result/bt_all01_06or.gif" /></a></td>
<td><a href="#tab_6"><img name="tab_6" src="/images/fortune_result/bt_all01_07or.gif" /></a></td>
</tr>
</table>

<a name="tab_1"></a>
<table class="fortuneAllTab" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#tab_0"><img name="tab_0" src="/images/fortune_result/bt_all01_01or.gif" /></a></td>
<td><a href="#tab_1"><img name="tab_1" src="/images/fortune_result/bt_all01_02or.gif" /></a></td>
<td><a href="#tab_2"><img name="tab_2" src="/images/fortune_result/bt_all01_03or.gif" /></a></td>
<td><a href="#tab_3"><img name="tab_3" src="/images/fortune_result/bt_all01_04or.gif" /></a></td>
<td><a href="#tab_4"><img name="tab_4" src="/images/fortune_result/bt_all01_05or.gif" /></a></td>
<td><a href="#tab_5"><img name="tab_5" src="/images/fortune_result/bt_all01_06or.gif" /></a></td>
<td><a href="#tab_6"><img name="tab_6" src="/images/fortune_result/bt_all01_07or.gif" /></a></td>
</tr>
</table>

.
.
.
.
.
.
n

나중에 ㅆㅓ먹을 일은 없을 듯 하다ㅡ.ㅡ;
저작자표시

'JavaScript' 카테고리의 다른 글

jQuery 1.4변경사항  (0) 2010.08.30
유용한 놈들(jQuery)  (0) 2010.08.27
정규식  (0) 2010.07.26
Ajax 뒤로가기 구현  (3) 2010.07.26
image resize(비율유지)  (0) 2010.07.04
Posted by 기계식키보드
:

티스토리툴바