컴퓨터/JavaScript

자바스크립트를 이용해서 링크 걸기

스노우볼^^ 2017. 8. 14. 22:01
반응형

링크를 걸때 4가지 동작을 합니다.

새창띄우기, 상위프레임에 넣기, 현재 프레임에 넣기, 아이프레임에 넣기입니다. 

넣는 위치는 x.js에 넣는게 제일 편하더군요. 그래서 x.js 파일 제일 하단에 넣어서 사용중입니다.



1. 새창 띄우기 : <a onclick="xlink('new','http://주소');" style="cursor:pointer;"> 내용 </a>


2. 상위프레임에 넣기: <a onclick="xlink('parent','http://주소');" style="cursor:pointer;") 내용 </a>

  현재 아이프레임상에 있거나 하위 프레임에 있을때 링크를 상위 프레임으로 걸어줍니다.


3. 현재 프레임에 넣기: <a onclick="xlink('','http://주소');" style="cursor:pointer;"> 내용 </a>

    현재 위치한 프레임에 링크를 걸어줍니다.


4. 아이프레임에 넣기: <a onclick="xlink('content','http://주소');" style="cursor:pointer;"> 내용 </a>

    <div id=content name=content>

      <iframe id=iframe></iframe>

    </div>

   일 경우는 아이프레임에 바로 링크를 걸어줍니다.


   <div id=content name=content>

    </div>

    일 경우는 <div>여기에 아이프레임을 만든 후 링크를 걸어줍니다.</div>

아무것도 없을경우...이경우는 확인을 안해봐서 잘 모르겠지만...아마 현재창에 링크를 걸어줄 것이라 생각합니다. 사용자가 링크 위치를 지정하고 사용하므로 이렇게 쓸 일이 있는지는 잘 모르겠네요.


아래는 필요한 함수입니다.


function xlink(E,URL)

{

 switch(E)

 {

   case 'new':

      window.open( URL,'new','left=100, top=100, width=640, height=480, resizable, directories, location, menubar, scrollbars, toolbar, status');

     break;

   case 'parent':

     parent.document.location.href = URL;

     break;

   case 'content':

       var div_parent=xGetElementById(E); 

    if(!xGetElementById('iframe'))

    {

     var div_child=document.createElement("iframe"); 

     div_child.id = "iframe";

     div_child.name = "iframe";

     div_child.style.width = div_parent.offsetWidth;

     div_child.style.height = xClientHeight();

     div_child.style.display = 'block';

     div_parent.innerHTML = "";

     div_child.frameBorder='0'; 

      div_child.attachEvent("onload",xIFrameSize);

     div_parent.appendChild(div_child); 

    }

    else

    { 

     var div_child = xGetElementById('iframe');

     div_child.style.width = div_parent.offsetWidth;

    }

    div_child.src = URL; 

   break;

   default:

     document.location.href = URL;

   break;

 }

}

function xIFrameSize () { 

 try

 {

  

  var iframeElement = xGetElementById('iframe');

  if(iframeElement==null) return;

  if (iframeElement.contentDocument && iframeElement.contentDocument.body.offsetHeight) //ns6 syntax

  {

  iframeElement.style.height =  iframeElement.contentDocument.body.offsetHeight+50+'px'; 

  }

  else if (iframeElement.Document && iframeElement.Document.body.scrollHeight) //ie5+ syntax

  {

  iframeElement.style.height =  iframeElement.Document.body.scrollHeight+50+'px'; 

   }else

   {

  iframeElement.style.height = 1000+'px';

  }

 }catch(e) {}

}



반응형