달력

52024  이전 다음

  • 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
반응형

function replaceAll(str, searchStr, replaceStr) {

    return str.split(searchStr).join(replaceStr);
}

 

str : 문자열 대체를 처리할 원 문자열

targetStr : 대체하기 원하는 문자(열) - 바꿀 문자

replaceStr : 대체될 문자(열) - 바뀌어질 문자

 

 

* 동작 원리

split 함수를 통해 문자열 str을 searchStr(구분자)을 기준으로 분리한다.

이 때, 구분자는 모두 제거되며, 구분자를 기준으로 분리된 문자열들이 배열로 저장된다.

배열로 나온 결과를 다시 join 함수를 사용하여 searchStr(연결자)로 연결한다.

즉, replaceAll함수는 str문자열을 구분자(targetStr)로 한번 분리[split]하였다가 연결자(replaceStr)를 통해 다시 연결(join)된 결과 문자열을 리턴한다.


출처 : http://ooz.co.kr/65

반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형

https://developers.google.com/maps/documentation/javascript/tutorials/firebase

반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형

<script language="javascript" type="text/javascript">

fucntion change(src){

  document.getElementById('mainimg').style.backgroundImage="url('" + src + "')";

}

</script>

<table>

  <tr>

    <td width="400" height="400">

      <div align="center" id="mainimg" style="width:400;height:400px;background-image:URL('/images/02_1.gif')">문장문장</div></td>

    <td><span onclick="change('/images/03.gif');">배경 바꾸기</span></td>

  </tr>

</table>

[출처] div background 변경|작성자 dan ni el

 

반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형

소수점 자리수 고정

.toFixed(n)     - n번째자리까지 고정

ex) "1234".toFixed(2) -> 1234.00

 

math.round(val/1000, 3).toFixed(2) : val을 1000으로 나눈값을 소수점 셋째자리에서 반올림한 후 둘째자리까지 고정 노출한다

ex) math.round(10/1000, 3).toFixed(5) -> 0.01000

 

 

================================================================

 

올림 -> Math.ceil()

버림 -> Math.floor()

반올림 -> Math.round(), number.round(반올림할 자리수)

 

추가 참고는 http://blog.naver.com/imse0109/30128374021 요기서 해보까...

반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형
http://cafe.naver.com/goorume/608

As an alternative to...

newImage.src = "http://localhost/image.jpg?" + new Date().getTime();

...it seems that...

newImage.src = "http://localhost/image.jpg#" + new Date().getTime();

...is sufficient to fool the browser cache without bypassing any upstream caches, assuming you returned the correct Cache-Control headers. Although you can use...

Cache-Control: no-cache, must-revalidate

...you lose the benefits of the If-Modified-Since or If-None-Match headers, so something like...

Cache-Control: max-age=0, must-revalidate

...should prevent the browser from re-downloading the entire image if it hasn't actually changed. Tested and working on IE, Firefox, and Chrome. Annoyingly it fails on Safari unless you use...

Cache-Control: no-store

...although this still may be preferable to filling upstream caches with hundreds of identical images, particularly when they're running on your own server. ;-)

반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형
반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형

Geolocation API 는 프로그램을 실행하는 디바이스의 위치 정보를 얻기 위한 Javascript API이다. 


메서드 3개로 이뤄진 간단한 API이다. 


사용법 

Geolocation API와 관련된 메서드는 모두 window.navigator객체에 정의 되어 있음. 


현재 위치를 한번만 얻음 

우선 디바이스의 현재 위치를 한번만 얻기 위한 메서드 getCurrentPosition()은 다음과 같이 

정의 됨. 

- getCurrentPosition(successCallback, errorCallback, options) 

현재 위치 정보를 비동기로 확인한 다음 처리 결과를 인수로 하여 successCallBack을 한번만 호출

에러가 발생했을 때는 상세한 에러 정보를 인수로 하여 errorCallback을 호출


현재 위치 얻기 

navigator.geolocation.getCurrentPosition(function(position) {  

// 위치 정보를 이용하여 처리를 수행 

alert("위도 : " + position.coords.latitude + "경도 : " + position.coords.longitude); 

});


위치 정보 객체의 속성 


coords 

latitude     : 위도  

longitude   : 경도 

altitude     : 표고(이용할 수없을 때는 null)

accuracy   : 위도, 경도의 오차(단위와 미터) 

altitudeAccuracy : 표고의 오차(단위와 미터)

heading : 디바이스의 진행 방향. 북쪽을 기준으로 한 시계 방향의 각도로 나타냄(이용할 수 없을 때는 null)

speed : 디바이스의 진행 속도(미터/초) 이용할 수 없을 때는 null

timestamp : 위치 정보를 얻은 시각(1970/1/1 부터의 미리 세컨드) 

위치 정보를 계속 확인함. 

watchPostion() 메서드를 이용하면 현재 위치를 계속 추적할 수 있고, 이 처리는 clearWatch()메서드를 호출하여 확인을 종료할 때까지 계속 된다. 


- watchPosition(successCallback, errorCallback, option)

이 메서드를 호출하면 현재 위치 정보를 비동기로 확인하고 처리 결과를 인수로 지정한 콜백메서드를 호출한다. 그 후에도 콜백 메서드는 디바이스가 위치가 변경되었다고 판단할 때마다 계속 호출한다. 

메서드의 반환값은 clearWatch()에 전달 할 수 있는 정수 


- clearWatch(watchId)

watchPosition()가 반환한 정숫값을 인수로 하여 watchPosition()메서드를 종료한다. 


위치 정보를 얻을 때의 옵션 

getCurrentPosition() 과 watchPosition() 의 세 번째 인수에는 위치 정보 확인 처리를 제한하기 위한 옵션을 지정

현재 Geolocation API는 다음과 같은 속성르 가진 Javascript객체를 옵션으로 지정할 수 있다. 

- enableHighAccuracy : 정확도가 높은 위치 정보를 요청 

- timeout : 위치 정보 확인에 시간제한을 설정(밀리 세컨드). 시간제한을 초과하면 에러(TIME OUT)발생 

- maximumAge : 위치 정보의 유효 기간을 설정함(밀리 세컨드). 현재의 위치 정보가 maximumAge보다 오래된 것이라면 해당 위치 정보는 폐기되고 새롭게 위치 정보 확인을 시도함. 0을 지정하면 항상 새로운 위치 정보를 확인함. 


예제 코드 

navigator.geolocation.getCurrentPosition(onSuccess, onError, {

   enableHighAccuracy: true, 

   maximumAge : 0

}); 



[출처] Geolocation API|작성자 난이

반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형
IE 6 에서 투명도가 회색으로 표기되는 부분 적용하기 위해 추가된 부분임!!!

크롬, 파이어폭스. 사파리에서는 이미지가 노출되지 않으니 적용하면 안되서 조건문을 걸었다.


 var ie5=(w3c && document.all && !window.opera)? true : false;


  if(ie5)
  {
    iconimg.width=iconimg.height="1";
    iconimg.style.display="inline-block";
    iconimg.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+iconimg.src+"', sizingMethod='image')";
    }
반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형

document.body.scrollTop 쓸 때 스크롤 시 주의

 

작성일: 2010.08.17

작성자: 권희영

 

마우스의 현재 포인트의 좌표값을 받아올 때

 

x 좌표: document.body.scrollLeft

y 좌표: document.body.scrollTop

 

사용 예)

event = window.event;

 

x = document.body.scrollLeft + event.clientX;

y = document.body.scrollTop+ event.clientY;

 

위와 같이 사용한다.

그런데 위와 같이 사용했을 때 스크롤을 내리면 내린만큼의 값을 받아오지 못한다.

이럴때 대체방법은 document.documentElement.scrollTop 이렇게 쓰면 된다.

 

그러나 저 방법으로 사용할 때에는 ie7이상부터 가능하며 파이어폭스에서는 실행되지 않는다.

 

[참고 사이트]

브라우저별 scrollTop 값에 대한 설명 : http://www.webuit.com/160

브라우저별 좌표값 얻어내기 : http://jmvidal.cse.sc.edu/talks/javascriptinbrowser/windowgeometry.html

참고 포트터 : http://paranbarami.tistory.com/314

 

반응형
Posted by 친절한 웬디양~ㅎㅎ
|
반응형

scrollHeight, clientHeight, offsetHeight  셋 모두 높이를 나타내는데요,

각각의 정확한 의미를 정리합니다.

* javascript code

<script type="text/javascript">

function msg( oTgt )
{
    var oDivID = oTgt ;
    alert( oDivID.scrollHeight ) ;
    alert( oDivID.clientHeight ) ;
    alert( oDivID.offsetHeight ) ;
}
</script>

 * html code

<div id=”divID” style="height=100px;background-color:blue;overflow:scroll" onclick="msg(this);">

abcdefghijklmn<br/>

abcdefghijklmn<br/>

abcdefghijklmn<br/>

abcdefghijklmn<br/>

abcdefghijklmn<br/>

abcdefghijklmn<br/>

</div>

 

 

각 단위는 픽셀 단위입니다.

scrollHeight : 스크롤바 높이를 뺀 내용 전체의 높이

clientHeight : 스크롤바 높이를 뺀 가시적인 높이

offsetHeight : 스크롤바 높이를 포함한 가시적인 높이



이상입니다.

관련정보 제공자 : mhlee 님,  cute772
Posted by 지위자드
반응형
Posted by 친절한 웬디양~ㅎㅎ
|