아래 소스는 옥션의 메뉴와 같이 하위메뉴를 보여주는 샘플소스.

------------------------------------------------------------------------------

 

<style>

table{
font-size:9pt;
font-family:"arial";
}

</style>

 

<!-------------------------------------->


<script type="text/javascript">

var TimeOut         = 300;
var currentLayer    = null;
var currentitem     = null;

var currentLayerNum = 0;
var noClose         = 0;
var closeTimer      = null;

// Open Hidden Layer
function mopen(n)
{
    var l  = document.getElementById("menu"+n);
    var mm = document.getElementById("mmenu"+n);
   
    if(l)
    {
        mcancelclosetime();
        l.style.visibility='visible';

        if(currentLayer && (currentLayerNum != n))
            currentLayer.style.visibility='hidden';

        currentLayer = l;
        currentitem = mm;
        currentLayerNum = n;           
    }
    else if(currentLayer)
    {
        currentLayer.style.visibility='hidden';
        currentLayerNum = 0;
        currentitem = null;
        currentLayer = null;
    }
}

// Turn On Close Timer
function mclosetime()
{
    closeTimer = window.setTimeout(mclose, TimeOut);
}

// Cancel Close Timer
function mcancelclosetime()
{
    if(closeTimer)
    {
        window.clearTimeout(closeTimer);
        closeTimer = null;
    }
}

// Close Showed Layer
function mclose()
{
    if(currentLayer && noClose!=1)
    {
        currentLayer.style.visibility='hidden';
        currentLayerNum = 0;
        currentLayer = null;
        currentitem = null;
    }
    else
    {
        noClose = 0;
    }

    currentLayer = null;
    currentitem = null;
}

// Close Layer Then Click-out
document.onclick = mclose;
</script>
<style>
#dd
{   margin: 0;
    padding: 0}

#dd li
{   margin: 0;
    padding: 0;
    list-style: none;
    float: left;
    font: bold 11px arial}

#dd li a.menu
{   display: block;
    text-align: center;
    background: #BB0A0A; /*메뉴 바탕색*/
    padding: 4px 10px;
    margin: 0 1px 0 0;
    color: #FFF;
    width: 145;
    height: 20px;
    text-decoration: none}

#dd li a.menu:hover
{   background: #FF0000}

.submenu2
{   background: #EAEBD8;
    border: 1px solid #13000A;
    visibility: hidden;
    position: absolute;
    z-index: 3;
 width: 155px;}
 .submenu2 a
    {   display: block;
        font: 11px arial;
        text-align: left;
        text-decoration: none;
        padding: 5px;
        color: #13000A}

    .submenu2 a:hover
    {   background: #FF0000;
        color: #FFF}

.submenu3
{   background: #EAEBD8;
    border: 1px solid #13000A;
    visibility: hidden;
    position: absolute;
    z-index: 3;
 width: 155px;}
 .submenu2 a
    {   display: block;
        font: 11px arial;
        text-align: left;
        text-decoration: none;
        padding: 5px;
        color: #13000A}

    .submenu2 a:hover
    {   background: #FF0000;
        color: #FFF}
</style>
</head>
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
<table border=0 cellpadding=0 cellspacing=0>
<tr><td>
<table cellpadding=0 cellspacing=0 border=0 width=100%><tr><td><table cellpadding=0 cellspacing=0 border=0  width=1050><tr><td >
<ul id="dd">
    <li>
        <a href="/racing/about/about_1.asp" class="menu" id="mmenu1" onmouseover="mopen(1);" onmouseout="mclosetime();">패션 브랜드 뷰티</a>
        <div class="submenu2" id="menu1" onmouseover="mcancelclosetime()" onmouseout="mclosetime();">
           
   <a href="#">BRAND+</a>
   <a href="#">THE SOHO#</a>
   <a href="#">여성의류</a>
   <a href="#">남성의류</a>
   <a href="#">빅사이즈/시니어</a>
   <a href="#">언더웨어/잠옷</a>
   <a href="#">신발/구두/운동화</a>
   <a href="#">가방/패션잡화</a>
   <a href="#">국내화장품</a>
   <a href="#">해외화장품/향수</a>
   <a href="#">쥬얼리/시계</a>
        </div>
    </li>
 <li><a href="/racing/race_card.asp" class="menu"  id="mmenu2" onmouseover="mopen(2);" onmouseout="mclosetime();">식품 유아용품 </a>
 <div class="submenu2" id="menu2" onmouseover="mcancelclosetime()" onmouseout="mclosetime();">
         <a href="#">쌀/과일/농수축산물</a>
   <a href="#">건강식품/다이어트</a>
   <a href="#">음료/과자/가공식품</a>
   <a href="#">기저귀/분유/이유식</a>
   <a href="#">물티슈/생리대/성인패드</a>
   <a href="#">출산/유아동/임부복</a>
   <a href="#">장난감/교육완구/인형</a>
   <a href="#">유아동의류/신발/가방</a>
        </div>
 </li>

 <li><a href="/racing/jockey/ja_lank.asp" class="menu"id="mmenu3" onmouseover="mopen(3);" onmouseout="mclosetime();">가구 생활 취미</a>
 <div class="submenu2" id="menu3" onmouseover="mcancelclosetime()" onmouseout="mclosetime();">
          <!--  <a href="/racing/jockey/ja_01.asp">Jockey's Profile</a>
            <a href="/racing/tra/tra_01.asp">Trainer's Profile</a>-->
            <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
        </div>
 </li>

     <li><a href="/racing/horse/horse_info.asp" class="menu"id="mmenu5" onmouseover="mopen(5);" onmouseout="mclosetime();">디지털 가전 컴퓨터</a>
 <div class="submenu2" id="menu5" onmouseover="mcancelclosetime()" onmouseout="mclosetime();">
            <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
   <a href="#"></a>
        </div>
 </li>
</ul>
</td></tr></table></td><td valign=top width=100%><img src=/racing/racing_img/top_3.jpg height=22 width=100%></td></tr></table>

OSI 7 Layer는 왜 만들어 졌을까?


OSI (Open System Interconnection) 7 Layes...왜 귀찮게 7계층으로 나누었을까?... 그냥 한번에 통신하면 되지..왜 나누었을까?...


7계층은 아래와 같다.


Application


Presentation


Session


Transport


Network


Data Link


Physical


"애-프-스-트-엔-들-피"


이유> 한마디로 "통신의 편리"를 위해서 나누어 놓은 것이다! 단계별접근..심플하지 아니한가요?..


1) 데이터의 흐름이 딱 보인다.


2) 문제 해결이 쉽다 (hierarchical Layer)


3) 표준화를 했기에 여러 브랜드의 상품사용이 가능하다


 예: 데이터케이블 or 허브 - PHY계층

      스위치나 브리지 - Data계층

      라우터 - Network계층


--------------------------------------------------------------------------------------------------------

추가적인 아래의 3계층에 대한 설명


PHY : 전기적,기계적인 특성을 이용하는 계층이다. 즉, 통신 케이블로 데이터를 전송한다. 0 1 0 1 0 1...

이것은 전기적으로 ON/OFF의 반복을 의미하는 것이다. 단지 데이터만을 전달하는 계층이다.

대표적인 통신장비로는 - 케이블, 리피터, 허브 등이 존재한다.


 *리피터 : 장거리 전송 회선의 중간에 삽입하여 신호의 증폭, 파형의 정형 등을 하는 중계장치.


DAT : 안전한 정보전달을 위해서 PHY단을 통하여 송수신 되는 정보의 오류와 흐름을 관리하는 역할을 한다. 

즉, 통신에서 오류검출, 재전송시도, MAC Address 를 통한 통신 을 할수있게 해준다. 전송되는 데이터의 단위는 "프레임"

이라고 부른다.

대표적인 장비로는 - 브리지, 스위치 등이 존재한다.


 *브리지 : 두 개의 LAN을 연결한다는 점에서 리피터(Reapeter)와 같을 수도 있지만, 리피터가 모든 신호를 한꺼번에 보내서 통신량을 증가시키지만, 브리지는 통신량을 조정할 수 있다. 즉 통신하고자 하는 노드가 같은 통신망 안에 있을 경우는 데이터가 다른 통신망으로 전달되지 않도록 한다. 또한 리피터와 마찬가지로 데이터를 재생성할 수 있다는 점에서는 같지만 데이터를 재생성하는 위치가 다르다.


브리지는 ① 통신망의 범위와 길이를 확장할 때, ② 통신망에 더욱 많은 컴퓨터들을 연결시킬 때, ③ 통신망에 과다하게 연결된 컴퓨터들로 인한 병목현상을 줄이고자 할 때, ④ 서로 다른 물리적 매체(통신선로)를 구성된 통신망으로 연결할 때, ⑤ 이더넷(Ethernet)과 토큰링(Token Ring) 같은 서로 다른 통신망 구조의 통신망을 연결할 때 등에 사용할 수 있다. 
일반적으로는 로컬(Local) 브리지와 원격(Remote) 브리지로 구분한다. 로컬 브리지는 말 그대로 동일지역 내에서 다수의 LAN을 서로 연결할 때 쓰이는 것이고, 원격 브리지는 LAN과 광역통신망(WAN)을 연결하는 것으로 지역이 다르고 멀리 떨어져 있는 LAN을 연결하는 것이다. 지금은 라우터가 원격 브리지의 기능을 대신하고 있다.
[출처] 브리지 | 두산백과


NET : 데이터를 목적지까지 가장 빠르고 안전하게 전달하는 역할을 가지고 있다. =  이과정을 라우팅이라 함.

즉, 경로를 선택 - 주소를 정하고 - 경로에 따라 패킷전송을 해주는 것이다. 

대표적인 장비로는 - 라우터이며 스위치중에서도 라우팅기능을 가진 장비가 존재한다.


A CAUTIONARY PERSPECTIVE ON CROSS-LAYER DESIGN


VIKAS KAWADIA, BBN TECHNOLOGIES P. R. KUMAR, UNIVERSITY OF ILLINOIS AT URBANA-CHAMPAIGN



Kawadia, V.; Kumar, P.R.

Wireless Communications, IEEE [see also IEEE Personal Communications]

Volume: 12  Issue: 1  Feb. 2005 

Page(s): 3- 11 



 작성중..



'N.&C. > CrossLayer' 카테고리의 다른 글

[Cross_Layer] What is a notion?  (0) 2013.05.20

예시)


For---------------------------------------------------


It's easy for me to read this book 


It is difficult for him to finish the work in a week 


It is not safe for the kids to play on the street 



Of--------------------------------------------------


It was wise of you to refuse his offer 


It is very cruel of him to do such a thing. 


It was careless of her to break the dishes 


It's foolish of him to say such a thing. 




'English is ..' 카테고리의 다른 글

[콤마] , 의 사용법.  (0) 2014.02.04
영어에서 사용되는 모든 콜론,세미콜론,콤마,따음표,구두점,이텔릭체 규칙  (0) 2014.01.15
some expressions..  (0) 2013.05.17
whether or not  (0) 2013.05.03
by + Which 용법  (0) 2013.04.23

Notion::


The existing networks layer consists of OSI 7 layers. The rule is, each layer work independent.


The Cross layer, however, even break the rules of such a hierarchy, a independent property of OSI 7.


That is, the cross layer means that specific information send to a non-adjacent layer, or shared variables to share In 


order to improve the efficiency in communication,


Why need::


It help the wireless communication that based on a existing OSI 7 layer,  to improve about efficiency. Because the 


wireless communication is not good in existing OSI 7 layer.


2 problems::


1) small scale channel variations


2) Large-scale channel variation


Therefore, we need a another architecture for wireless communication compared with OSI 7 layers. 

'N.&C. > CrossLayer' 카테고리의 다른 글

[R.Papers] A CAUTIONARY PERSPECTIVE ON CROSS-LAYER DESIGN  (0) 2013.05.20

+ Recent posts