관련 : - hash] hashConsol 구현 2... (IE 부분완성) : killofki's javascript Walking -

지난번에 만들어놓은 consolReceiver 의 작동환경이랄까...
스크롤이 안되는(?) 부분을 생각해서

강제로(?) 스크롤하도록 조정했다. 그리고... 버그(?)부분도 수정...

- hashConsol_4.html -

...


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>hashReceiver</TITLE>
</HEAD>
<BODY>
<script>
// init Consol
var consolID='Consol', receiverID='ConsolReceiver', consolCount=0;

function hashAlerter() {
  sendtoConsol(location.hash);

  setTimeout(hashReceiver, 200);
  }

function hashReceiver() {
  sendtoConsol(location.hash);
  }


function scrollReceiver() { var ar=arguments, i;
  for (i=0; i<ar.length; i++)
   document.getElementById(ar[i]).style.top=document.body.scrollTop+'px';
  }

// sendtoConsolFunction
function sendtoConsol() {

  var ar=arguments, i, e=document.getElementById(consolID), ov='';

  for (i=0; i<ar.length; i++) ov+=ar[i];
  e.innerHTML+=(ov=='#no'+consolID?'':'<br/>')+'-'+unescape(ov)+'-';

  consolCount++;

document.body.scrollTop=e.offsetTop+e.offsetHeight-document.body.clientHeight;
scrollReceiver('ConsolReceiver', 'no'+consolID);

location.href='#no'+consolID;
  }

function inithashAlerter() {

//if (location.hash) consolID=location.hash.substring(1, location.hash.length);

document.write('<a style="position:absolute;" id=ConsolReceiver name=ConsolReceiver href=# onfocus=hashAlerter(); ></a>');
document.write('<a style="position:absolute;" id=no'+consolID+' name=no'+consolID+' href=#></a>');
document.write('<div id='+consolID+'></div>');

// end of init Consol (Receiver & consol)

// hash receiver Initialize

// only IE 7 ? or less?

//if (!document.all) window.onhashchange=hashAlerter;
if (!document.all) window.onhashchange=hashReceiver;
// not activate of <a tag's onfocus

  }

</script>

<script>
inithashAlerter();
</SCRIPT>

</BODY></HTML>


...


...

1) consol 강제 scroll
사실 .focus() 나 window.open('#', '_self') 를 이용해서 consol 에 자리잡게하고 싶었지만,
그럴 경우, 해당 element 를 기준으로 화면의 최상단에 자리잡게하는 오류(?)가 있어서,

document.body.scrollTop=... 형식을 취했다.
그 외에, 계산식(?)은 <div id=consol 기준으로 바닥을 계산하고, document.body.clientHeight 를 잡아서
화면에 표시했다.

... 사실, <a id=ConsolReceiver , <a id='no'+consolID 에 style="position:relative" 하고싶었지만,

IE 에서 #ConsolReceiver 를 받는 형태를 보니,
해당 element 의 style="top:..." 을 이용해서 element 틀 모두(?) 아래쪽으로 내려갔다고 해도,
원래 있던 위치로 스크롤 되어서...

어쩔 수 없이... position:absolute; 로 바꾼 것.

...

2) 버그패치
뭐(?)... 실제로 IE 외에는 <a 태그를 강제로 잡을 일이 없으니 오류는 안났겠지(?)만,
그래도... 저렇게 꾸며(?)놓는 것과, 안꾸며놓는 것 차이가 있으니까... ( id=... name=... 부분)

...

smallLet killofki@.

Posted by killofki
,