독도 광고 모금 캠페인

화면상의 객체 위치,크기

JavaSCript 2008/04/16 12:34

<HTML>
<HEAD>
<TITLE> 화면상의 객체 위치,크기 </TITLE>
<SCRIPT LANGUAGE="JavaScript" >
<!--
function getBounds(tag)
{
    var ret = new Object();
    if(document.all) {
        var rect = tag.getBoundingClientRect();
        ret.left = rect.left + (document.documentElement.scrollLeft || document.body.scrollLeft);
        ret.top = rect.top + (document.documentElement.scrollTop || document.body.scrollTop);
        ret.width = rect.right - rect.left;
        ret.height = rect.bottom - rect.top;
    } else {
        var box = document.getBoxObjectFor(tag);
        ret.left = box.x;
        ret.top = box.y;
        ret.width = box.width;
        ret.height = box.height;
    }
    return ret;
}

//-->
</SCRIPT>
</HEAD>

<BODY>
<BR><BR><BR><BR><BR>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="youranytag" style="border:1px solid ;width:500px;">aa</span>

<SCRIPT LANGUAGE="JavaScript">
<!--
var box = getBounds(document.getElementById('youranytag'));
var str = "left:"+box.left+"/top:"+box.top+"/width:"+box.width+"/height:"+box.height;
alert(str);
//-->
</SCRIPT>
</BODY>
</HTML>


출처 : http://www.phpschool.com/gnuboard4/bbs/board.php?bo_table=tipntech&wr_id=59355&page=6
참조 : http://koxo.com/lang/js/method/getBoundingClientRect.html

이올린에 북마크하기(0) 이올린에 추천하기(0)

'JavaSCript' 카테고리의 다른 글

화면상의 객체 위치,크기  (0) 2008/04/16
prototype.js 를 위한 개발자 노트  (1) 2008/04/16
자바스크립트의 특징  (1) 2008/04/02
@cc_on  (0) 2008/03/24
레이어 드래그 + 투명효과  (2) 2008/03/24
자바스크립트 에러 출력방지  (0) 2008/03/13
Posted by 하로기
TAG getBoundingClientRect(), it, 객체
트랙백 0개, 댓글 0개가 달렸습니다

트랙백 주소 :: http://harogipro.tistory.com/trackback/192 관련글 쓰기

댓글을 달아 주세요

prototype.js 를 위한 개발자 노트

JavaSCript 2008/04/16 11:28

시간날때 공부해야 겠네요.
많은 도움이 될듯 합니다.

http://openframework.or.kr/framework_reference/prototype_js/1.4.0/prototype.js.html#DollarFunction

http://www.prototypejs.org/download
이올린에 북마크하기(0) 이올린에 추천하기(0)

'JavaSCript' 카테고리의 다른 글

화면상의 객체 위치,크기  (0) 2008/04/16
prototype.js 를 위한 개발자 노트  (1) 2008/04/16
자바스크립트의 특징  (1) 2008/04/02
@cc_on  (0) 2008/03/24
레이어 드래그 + 투명효과  (2) 2008/03/24
자바스크립트 에러 출력방지  (0) 2008/03/13
Posted by 하로기
TAG it, prototype
트랙백 0개, 댓글 1개가 달렸습니다

트랙백 주소 :: http://harogipro.tistory.com/trackback/191 관련글 쓰기

댓글을 달아 주세요

  1. 정숙연 2008/05/23 16:12  댓글주소  수정/삭제  댓글쓰기

    <?
    if($arr[detailimg2] != "none";){
    @$imginfo = getImageSize("{$DOCUMENT_ROOT}/data/goodimg/".$arr[detailimg2]);
    //echo $imginfo."<br>";

    if(gettype($imginfo) == "array";){
    //echo $imginfo[0]."<br>" ; // 가로크기
    //echo $imginfo[1]."<br>" ; // 세로크기
    //echo $imginfo[2]."<br>" ; // gif일 때 1, jpg일때 2, png일때 3
    //echo $imginfo[3] ; // width="500" height="496"
    $max_len=600;//여기에 범위를 잡아주면 가로 세로 비율이 깨어지지 않는 이미지가 됩니다.
    $width=$imginfo[0];
    $height=$imginfo[1];
    if($width>$height){
    if($width>$max_len){
    $img_width=$max_len;
    }else{
    $img_width=$width;
    }
    $img_height=$height*$img_width/$width;
    }else{
    if($height>$max_len){
    $img_height=$max_len;
    }else{
    $img_height=$height;
    }
    $img_width=$width*$img_height/$height;
    }

    if($imginfo[1]>$max_len || $imginfo[0]>$max_len){
    ?>
    <img src="../../data/goodimg/<?=$arr[detailimg]?>" width="<?=$img_width?>" height="<?=$img_height?>" border=0>
    <? }else{?>
    <img src="../../data/goodimg/<?=$arr[detailimg]?>" <?=$imginfo[3]?> border=0>
    <?
    }
    }
    }
    ?>

홈페이지 레이아웃 참고용 사이트 모음

Info & News 2008/04/11 10:50
홈페이지 리녈해볼려다가 찾은 사이트들...

http://www.freelayouts.com/
http://www.templatesbox.com/
http://www.oswd.org/
http://www.openwebdesign.org/



이올린에 북마크하기(0) 이올린에 추천하기(0)

'Info & News' 카테고리의 다른 글

홈페이지 레이아웃 참고용 사이트 모음  (1) 2008/04/11
UI 에 대해...  (0) 2008/04/02
로딩 이미지 만들어 주는 사이트  (2) 2008/04/02
아스키코드표  (0) 2008/03/21
간단 아쿠아 버튼 만들기 프로그램  (0) 2008/03/20
TiltViewer 플래시 갤러리  (3) 2008/03/20
Posted by 하로기
TAG 무료, 웹디자인, 템플릿, 홈페이지
트랙백 0개, 댓글 1개가 달렸습니다

트랙백 주소 :: http://harogipro.tistory.com/trackback/190 관련글 쓰기

댓글을 달아 주세요

  1. BlogIcon 반장 :: G+ 2008/04/24 02:20  댓글주소  수정/삭제  댓글쓰기

    참고가 많이 되겠어요 ㅎㅎ

자바스크립트의 특징

JavaSCript 2008/04/02 14:26


http://www.ibm.com/developerworks/kr/library/j-cb12196/index.html




오호라......-_-a;;
이올린에 북마크하기(0) 이올린에 추천하기(0)

'JavaSCript' 카테고리의 다른 글

화면상의 객체 위치,크기  (0) 2008/04/16
prototype.js 를 위한 개발자 노트  (1) 2008/04/16
자바스크립트의 특징  (1) 2008/04/02
@cc_on  (0) 2008/03/24
레이어 드래그 + 투명효과  (2) 2008/03/24
자바스크립트 에러 출력방지  (0) 2008/03/13
Posted by 하로기
TAG JavaScript, UI, 객체지향
트랙백 0개, 댓글 1개가 달렸습니다

트랙백 주소 :: http://harogipro.tistory.com/trackback/189 관련글 쓰기

댓글을 달아 주세요

  1. BlogIcon 까칠한지민 2008/04/03 09:28  댓글주소  수정/삭제  댓글쓰기

    "Hello, World" 얘는 뭐길래 - _-;;
    C언어에서도 나오고 J.S에서도 ..
    출력예제로 나오는 거예요 ~~

UI 에 대해...

Info & News 2008/04/02 13:55
"사용자 경험은 제품이 내부적으로 어떻게 작동하는가의 문제가 아니다. 사용자의 경험은 제품이 외부에서, 즉 한사람이 그 제품과 접촉하고, 그것을 가지고 일하는 그곳에서 어떻게 작동하는가의 문제이다."

http://www.blo9.com/wp/?p=373

도움이 되길....

경험디자인의 요소 상세보기
제시 제임스 게러트 지음 | 한솜미디어 펴냄
앞서가는 조직은 웹디자인이 단지 깔끔한 코드와 정교한 그래픽을 만드는 일 이상임을 잘 알고 있다. 잘 돌아가는 사이트는 여러분의 전략적 목표들과 사용자 요구들을 동시에 충족시킨다. 이 책은 도구나 기술이 아니라 아이디어에 초점을 맞추는 명쾌한 설명과 생생한 그림을 통해서 웹 분야의 사용자 중심 디자인이 지니는 복잡한 측면들을 헤쳐 나가고 있다. 이 책의 저자는 독자들에게 전략에서부터 인포메이션 아키텍처나 비
이올린에 북마크하기(0) 이올린에 추천하기(0)

'Info & News' 카테고리의 다른 글

홈페이지 레이아웃 참고용 사이트 모음  (1) 2008/04/11
UI 에 대해...  (0) 2008/04/02
로딩 이미지 만들어 주는 사이트  (2) 2008/04/02
아스키코드표  (0) 2008/03/21
간단 아쿠아 버튼 만들기 프로그램  (0) 2008/03/20
TiltViewer 플래시 갤러리  (3) 2008/03/20
Posted by 하로기
TAG UI
트랙백 0개, 댓글 0개가 달렸습니다

트랙백 주소 :: http://harogipro.tistory.com/trackback/188 관련글 쓰기

댓글을 달아 주세요