Followers

အီးေမးလ္မွာဖတ္ခ်င္ရင္အေပၚမွာ Sign In (Menber)ဝင္ၾကပါလို႕ေတာင္းဆိုပါရေစ။ခင္မင္ေလးစားလွ်က္ေကပီသရီးမိသားစု

Kp3နည္းပညာ၊၄၈၅၊AUniqueStyleDropDownBarNavigationMenuသံုးခ်င္ရင္

 အခ်ိန္ရတုန္း၊AUniqueStyleDropDownBarNavigationMenuေလးတင္ေပးလိုက္ပါ။ဒီMenuကသံုးတဲ့သူေတြအရမ္းနည္းပါ
တယ္။မရွိသေလာက္ပါဘဲ၊Menuထဲမွာkp3အၾကိဳက္ဆံုးလို႕လည္းေျပာရင္ရပါတယ္။က်ေနာ္ေအာက္မွာသြားၾကည့္လို႕ရေအာင္
လည္းDEMOလင့္ခ္ေလးေပးသလိုပံုနဲ႕တကြျပထားေပးပါတယ္။ၾကိဳက္ၾကမယ္လို႕လည္းေမ်ာ္လင့္ပါတယ္။Menuမတင္တာလည္း
ၾကာျပီဆိုေတာ့ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားျမဲေကပီသရီးမိသားစု
ဒီမွာသြားၾကည့္လိုက္ပါ။
 မွတ္ခ်က္။ ။ပံုကိုၾကည့္ရတာအဆင္မေျပရင္Clickထပ္ႏိုပ္ေပးလိုက္ပါ။

၁။ေအာက္ကကုဒ္ကိုရွာပါ။
]]></b:skin>
၂။ေတြ႕ျပီဆိုရင္အေပၚမွာေအာက္ကကုဒ္ကိုထည့္ေပးလိုက္ပါ။
.nav {
height:35px;
background: url(http://3.bp.blogspot.com/-iYO_dq-SM3k/Ti1qX6kEh0I/AAAAAAAAE1g/riMnCYQz3_4/s1600/bg.gif) repeat-x;
position:relative;
font-family:arial, verdana, sans-serif;
font-size:11px;
width:100%;
z-index:100;
margin:0;
padding:0;
}

.nav .table {
display:table;
margin:0 auto;
}

.nav .select,
.nav .current {
margin:0;
padding:0;
list-style:none;
display:table-cell;
white-space:nowrap;
}

.nav li {
margin:0;
padding:0;
height:auto;
float:left;
}

.nav .select a {
display:block;
height:35px;
float:left;
font-weight:bold;
background: url(http://3.bp.blogspot.com/-iYO_dq-SM3k/Ti1qX6kEh0I/AAAAAAAAE1g/riMnCYQz3_4/s1600/bg.gif);
padding:0 30px 0 30px;
text-decoration:none;
line-height:35px;
white-space:nowrap;
color:#2b3238;
}


.nav .select a:hover,
.nav .select li:hover a {
background: url(http://2.bp.blogspot.com/-nVl9muJMq7Q/Ti1qYHKkioI/AAAAAAAAE1k/-xo6sTlGN-A/s1600/hover.gif);
padding:0 0 0 15px;
cursor:pointer;
color:#2b3238;
}

.nav .select a b{
font-weight:bold;
}

.nav .select a:hover b,
.nav .select li:hover a b {
display:block;
float:left;
padding:0 30px 0 15px;
background:url(http://2.bp.blogspot.com/-nVl9muJMq7Q/Ti1qYHKkioI/AAAAAAAAE1k/-xo6sTlGN-A/s1600/hover.gif) right top;
cursor:pointer;
}

.nav .select_sub {
display:none;
}

/* IE6 only */
.nav table {
border-collapse:collapse;
margin:-1px;
font-size:1em;
width:0;
height:0;
}

.nav .sub {
display:table;
margin:0 auto;
padding:0;
list-style:none;
}

.nav .sub_active .current_sub a,
.nav .sub_active a:hover {
background:transparent;
color:#2b3238;
}

.nav .select :hover .select_sub,
.nav .current .show {
display:block;
position:absolute;
width:100%;
top:35px;
background:url(http://1.bp.blogspot.com/-ha6EhdiZxBI/Ti1qXa6bmsI/AAAAAAAAE1c/A7NU-qQ_-Ls/s1600/back.gif);
padding:0;
z-index:100;
left:0;
text-align:center;
}

.nav .current .show {
z-index:10;
}

.nav .select :hover .sub li a,
.nav .current .show .sub li a {
display:block;
float:left;
background:transparent;
padding:0 10px 0 10px;
margin:0;
white-space:nowrap;
border:0;
color:#2b3238;
}

.nav .current .sub li.sub_show a {
color:#2b3238;
cursor:default;
}

.nav .select .sub li a {
font-weight:normal;
}

.nav .select :hover .sub li a:hover,
.nav .current .sub li a:hover {
visibility:visible;
color:#73a0d2;
}

၃။ေအာက္ကကုဒ္ကိုျပထားတဲ့ပံုအတိုင္းထည့္ေပးလို္က္ပါ။


<div class="nav">
<div class="table">

<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a></li></ul>

<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a>
<div class="select_sub">
<ul class="sub">
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>

<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
</ul>
</div>
</li>
</ul>

<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a>
<div class="select_sub">
<ul class="sub">

<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
</ul>

</div>
</li>
</ul>


<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a>
<div class="select_sub">
<ul class="sub">
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>

<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
</ul>
</div>
</li>
</ul>


<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a>
<div class="select_sub">
<ul class="sub">

<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
</ul>

</div>
</li>
</ul>

</div>
</div>
က်ေနာ္အေပၚကကုဒ္မွာေရးထားသလိုလင့္ခ္ေတြကိုထည့္ျပီးရင္kp3နည္းပညာေနရာေတြမွာမိမိရဲ႕လင့္ခ္အမည္ကိုေရးေပးပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

Related Post

Reactions:

3 comments:

လင့္ဒ္ ထည္႔ရန္ဆိုတာက ဘယ္က လင့္ဒ္လဲဗ် သိပ္နားမလည္လို႔ပါ

အကိုၾကီးဘေလာ့မွာတင္ထားတဲ့ပိုစ္ေတြရဲ႕ေခါင္းစဥ္။ဒါမွမဟုတ္အျခားၾကိဳက္တဲ့လင့္ခ္ေတြေပါ့ေနာ္။

no.3 အဆင့္ကပံုကသိပ္မရွင္းဘူး လုပ္တာလဲလုပ္လို ့မရဘူး

Post a Comment

မွတ္ခ်က္မ်ားကို စိစစ္ၿပီးမွ ေဖာ္ျပေပးမည္ ျဖစ္ပါသျဖင့္ ဤစာမ်က္ႏွာေပၚမွာ ခ်က္ခ်င္း ျမင္ရမည္မဟုတ္ပါ။ မၾကာခင္ ေနာက္တခါ ျပန္လာၿပီး မိမိ၏ မွတ္ခ်က္ကို ျပန္ၾကည့္ပါရန္ ေမတၲာရပ္ခံပါသည္။