7 Nov 2012

Multi-Tabbed Widget ေလးနဲ႕ အသုံးျပဳၾကမယ္


မဂၤလာပါဗ်ာ.. ကြ်န္ေတာ္ ခုတင္ျပမဲ့ ပို႕စ္ေလးေကတာ့  Multi-Tabbed Widget  လို႕ေခၚတဲ့
မိမိတို႕ ေဖၚျပျခင္ေသာ က႑ေလးေတြကို အက်ဥ္းခ်ဳန္း သလိုလဲ ျဖစ္တဲ့  ဇယားေလးနဲ႕ တင္ျပနည္းေလးဘဲ ျဖစ္ပါတယ္. ကြ်န္ေတာ္ ဥပမာ အေနနဲ႕  ေဘာလုံးပြဲ စဥ္ဇယားေလးကို တင္ျပထားပါတယ္.. မိမိတို႕ တင္လိုေသာ စာသားမ်ား ကိုၾကိဳက္သလို ထည့္သြင္းတင္နိဳင္ပါတယ္..
စိတ္တိုင္းက် ဖန္တီးယူနိဳင္ပါတယ္.. သူက ဇယားတစ္ခုထဲကို ေခါင္းစဥ္ေလး သုံးခုနဲ႕ ဆိုေတာ့
တေနရာထဲနဲ႕ အဆင္ေျပေစပါတယ္... ကဲ စၾကည့္မယ္ေနာ္...ေအာက္မွာ ၾကည့္လိုက္ပါ။

 ထည့္နည္းေလးနဲ႕ ကုဒ္ေတြကို ေပးလိုက္ပါတယ္...ေနာ္..

►1-  Blogger Singin ၀င္လိုက္ပါ။
►2-  DASHBOARD ကိုသြားလိုက္ပါ။
►3-  LAYOUT    ကိုကလစ္ပါ..။
►4-  EDIT HTML  ကို၀င္ပါ..
►5-  Ctrl+F အကူညီျဖင့္ ေပးထားတဲ့ ကုဒ္ကို ရွာလိုက္ပါ။

</head> ရွာလုိက္ပါေတြ့ၿပီးဆုိရင္ </head> ရဲ့ ေအာက္မွာ ေအာက္ကေပးထားတဲ့ ကုဒ္ ေတြကုိထည့္ေပလုိက္ပါ။

<script src="http://www.webaholic.co.in/other/blogger-tabbed-widget-javascript.js" type="text/javascript"></script>
<link href="http://www.webaholic.co.in/other/blogger-tabbed-widget-css.css" rel="stylesheet" type="text/css" />
 ျပီးတာနဲ႕ save template လု္ပေပးနိဳင္ပါျပီ။

ေနာက္တဆင့္အေနနဲ႕..ကေတာ့..လြယ္ကူပါတယ္..
   ►1.  Login လုပ္လုိက္ပါ ဘေလာ့ကာကို
   ►2.  Layout ကိုကလစ္ရပါ့မယ္ မိမိတို႕  Dashboard ကေနေပါ့
   ►3.  Add a Gadget ကိုကလစ္ေပးလုိက္ပါ
   ►4.  HTML/Javascript. ကိုကလစ္ျပီး က်လာတဲ့ ေဘာက္ေလးထဲမွာဘဲ
   ►5.  ေအာက္ကေပးထားတဲ့ ကုဒ္ေတြကို ေကာ္ပီယူ ထည့္လိုက္ပါ

<form action="tabtampil.html" method="get">
<div id="TabTampil" class="TabTampil">
<div style="width: 250px;" class="TTs">
 <a>Tab ၁</a> <a>Tab ၂</a> <a>Tab ၃</a></div>
<div style="width: 250px; height: 300px;" class="Halamans">
<div class="Halaman">
<div class="Alas">
<br/>
Tab (၁)  အတြက္ မိမိႏွစ္သက္ရာ ကုဒ္-စာသား ထည့္နိဳင္သည္။
</div>
</div>
<div class="Halaman">
<div class="Alas">
<br/>
Tab (၂)  အတြက္ မိမိႏွစ္သက္ရာ ကုဒ္-စာသား ထည့္နိဳင္သည္။
</div>
</div>
<div class="Halaman">
<div class="Alas">
<br/>
Tab (၃)  အတြက္ မိမိႏွစ္သက္ရာ ကုဒ္-စာသား ထည့္နိဳင္သည္။
</div>
</div>
</div>
<small><a style='margin-left:10px;align:right;' href='http://www.blogger.webaholic.co.in/2011/10/multi-tabbed-widget-for-blogger.html' target='_blank'>Multi-Tabbed Widget</a> | <a href='http://www.webaholic.co.in/' target='_blank'>Webaholic</a></small>
</div>
</div>
</form>
<script type="text/javascript">tabtampil_inisial('TabTampil');</script>



မွတ္ခ်က္   ။       ။ width: 250px; height: 300px;  ေတြမွာ မိမိဘေလာ့နဲ႕ ကိုက္ညီေစမယ့္
                        နံပါတ္ေတြကို ခ်ိန္းေပးလိုက္ပါ။

 Tab ၁------Tab ၂-----Tab ၃  ေနရာေတြမွာ မိိမိထည့္လိုတဲ့ အမည္ေပါ့ဗ်ာ....

လက္ေဆာင္ ။     ။   ကိုကို-မမ- အပ်င္းအိုးမ်ားအတြက္...ေိေိေိ..စတာေနာ္...တိနားး
                           အေနာ္ လုပ္ထားတဲ့ ေဘာလုံးပြဲစဥ္ ကုဒ္ေတြ ယူသုံးဖို႕ လက္ေဆာင္ပါ...
 ႏွစ္သက္ပါက ယူလုိက္ပါ...အေပၚကလို ဘာမွ ၀င္စရာမလိုတဲ့ ရယ္ရီမိတ္ေလးပါ... ခင္လို႕လက္ေဆာင္ေပးးတာေနာ္... စကားေလးေတာ့ ေၾကာခဲ့အုံးး  လုပ္ရတာ အားးမခ်ိလိုက္တာ
မန္ဘာကနည္း  ကြန္မန္႕က မခ်ိနဲ႕...တားတား ညစ္တာဘဲ..ဂယ္ဘဲ..ဂယ္ဘဲ


<style>
/* Modified By Roxx */
div.TabView div.Tabs
{
height: 24px;
overflow: hidden;
}
div.TabView div.Tabs a
{
-moz-border-radius-topleft:10px;
-webkit-border-top-left-radius:10px;
-moz-border-radius-topright:10px;
-webkit-border-top-right-radius:10px;
float: left;
display: block;
width: 90px; /* Lebar Menu Utama Atas */ text-align: center;
height: 24px; /* Tinggi Menu Utama Atas */
padding-top: 3px;
vertical-align: middle;
border: 1px solid #D8D8D8; /* Warna border Menu Atas */
border-bottom-width: 0;
text-decoration: none;
font-family: "Tahoma", Serif; /* Font Menu Utama Atas */
font-weight: 900;
color: #000; /* Warna Font Menu Utama Atas */
}
/* Modified By Roxx */
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
color: #fff;
background-image:url('http://lh3.ggpht.com/_TWC8zfBIdik/S_mtk3GmCTI/AAAAAAAAA0Y/Icb5zF59LTw/h2.gif'); /* Warna background Menu Utama Atas */
}
div.TabView div.Pages
{
clear: both;
border: 1px solid #D8D8D8; /* Warna border Kotak Utama */
overflow: hidden;
background-color: #fff; /* Warna background Kotak Utama */
}
/* Modified By Roxx */
div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}
/* Modified By Roxx */
</style>

<script type="text/javascript">
function tabview_aux(TabViewId, id)
{
var TabView = document.getElementById(TabViewId);

// ----- Tabs -----

var Tabs = TabView.firstChild;
while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;

var Tab = Tabs.firstChild;
var i = 0;

do
{
if (Tab.tagName == "A")
{
i++;
Tab.href = "javascript:tabview_switch('"+TabViewId+"', "+i+");";
Tab.className = (i == id) ? "Active" : "";
Tab.blur();
}
}
while (Tab = Tab.nextSibling);

// ----- Pages -----

var Pages = TabView.firstChild;
while (Pages.className != 'Pages') Pages = Pages.nextSibling;

var Page = Pages.firstChild;
var i = 0;

do
{
if (Page.className == 'Page')
{
i++;
if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";
Page.style.overflow = "auto";
Page.style.display = (i == id) ? 'block' : 'none';
}
}
while (Page = Page.nextSibling);
}

// ----- Functions -------------------------------------------------------------

function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }

function tabview_initialize(TabViewId) { tabview_aux(TabViewId, 1); }
</script>

<form action="tabview.html" method="get">
<div id="TabView" class="TabView">
<div style="width: 300px;" class="Tabs"> <!-- 450 adalah lebar boks tab -->
<a>Spain</a> <!-- Tab 1 adalah judul menu tab 1 -->
<a>England</a> <!-- Tab 2 adalah judul menu tab 2 -->
<a>ျမန္မာ</a> <!-- Tab 3 adalah judul menu tab 3 -->
</div>
<div style="width: auto; height: 350px;" class="Pages"> <!-- 250 adalah tinggi boks tab -->

<div class="Page">
<div class="Pad">
<!-- BEGIN of Soccerway widget HTML fragment -->
<!-- Personal code for this widget: 2fgHxqZyonoj5g0y -->
<iframe src="http://widgets.soccerway.com/widget/free/classic/competition/7/#d=280x340&f=table,table_colmp,table_colmw,table_colmd,table_colml,table_colgf,table_colga,results,fixtures,scroll&cbackground=110f0f&ctext=61c1aa&ctitle=F85F00&cshadow=644cbf&cbutton=f30b6c&cbuttontext=000000&chighlight=FF0000&tbody_family=Tahoma,sans-serif&tbody_size=9&tbody_weight=normal&tbody_style=normal&tbody_decoration=none&tbody_transform=none&ttitle_family=Impact,sans-serif&ttitle_size=13&ttitle_weight=normal&ttitle_style=normal&ttitle_decoration=none&ttitle_transform=none&ttab_family=Tahoma,sans-serif&ttab_size=9&ttab_weight=normal&ttab_style=normal&ttab_decoration=none&ttab_transform=none" width="280" height="300" scrolling="no" frameborder="0" marginwidth="0" marginheight="0"></iframe>
<!-- END of Soccerway widget HTML fragment -->
</div>
</div>

<div class="Page">
<div class="Pad">
<!-- BEGIN of Soccerway widget HTML fragment -->
<!-- Personal code for this widget: 2fgHxqZyonoj5g0y -->
<iframe src="http://widgets.soccerway.com/widget/free/classic/competition/8/#d=280x340&f=table,table_colmp,table_colmw,table_colmd,table_colml,table_colgf,table_colga,results,fixtures,scroll&cbackground=110f0f&ctext=29dcb2&ctitle=F85F00&cshadow=3d239c&cbutton=f30b6c&cbuttontext=000000&chighlight=FF0000&tbody_family=Tahoma,sans-serif&tbody_size=9&tbody_weight=normal&tbody_style=normal&tbody_decoration=none&tbody_transform=none&ttitle_family=Impact,sans-serif&ttitle_size=13&ttitle_weight=normal&ttitle_style=normal&ttitle_decoration=none&ttitle_transform=none&ttab_family=Tahoma,sans-serif&ttab_size=9&ttab_weight=normal&ttab_style=normal&ttab_decoration=none&ttab_transform=none" width="280" height="300" scrolling="no" frameborder="0" marginwidth="0" marginheight="0"></iframe>
<!-- END of Soccerway widget HTML fragment -->
</div>
</div>

<div class="Page"> <!-- Buat bikin tab baru -->
<div class="Pad"> <!-- CONTENT -->
<!-- BEGIN of Soccerway widget HTML fragment -->
<!-- Personal code for this widget: 2fgHxqZyonoj5g0y -->
<iframe src="http://widgets.soccerway.com/widget/free/classic/competition/791/#d=280x340&f=table,table_colmp,table_colmw,table_colmd,table_colml,table_colgf,table_colga,results,fixtures,scroll&cbackground=1d1f31&ctext=14eca4&ctitle=28f7a4&cshadow=6a2626&cbutton=C0C0C0&cbuttontext=ee1313&chighlight=FF0000&tbody_family=Tahoma,sans-serif&tbody_size=9&tbody_weight=normal&tbody_style=normal&tbody_decoration=none&tbody_transform=none&ttitle_family=Impact,sans-serif&ttitle_size=13&ttitle_weight=normal&ttitle_style=normal&ttitle_decoration=none&ttitle_transform=none&ttab_family=Tahoma,sans-serif&ttab_size=9&ttab_weight=normal&ttab_style=normal&ttab_decoration=none&ttab_transform=none" width="280" height="340" scrolling="no" frameborder="0" marginwidth="0" marginheight="0"></iframe>
<!-- END of Soccerway widget HTML fragment --><!-- ISI CONTENT -->
</div> <!-- jangan lupa ditutup -->
</div> <!-- jangan lupa ditutup -->

</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>
<div style="background-color: black; color: magenta; text-align: center;">
&nbsp;Powered by<a href="http://aungsanmks.com/" style="color: cyan;"> ေအာင္ေအာင္(မကစ)</a></div>

 အနီေရာင္ေနရာေတြ ေျပာင္းေပးနိဳင္ပါတယ္..

ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။ အဆင္မေျပတာမ်ားရွိခဲ့ပါက...cbox မွာ ေျပာခဲ့ၾကပါေနာ္..

0 comments:

တင္ထားသမွ် ေခါင္းစဥ္မ်ား

2Step Verification (5) A+အေၾကာင္း (1) Activator (9) Adobe CS3 Master Collection (1) Adobe Premiere Pro CS6 အသံုးျပဳနည္ (1) Adobe Software (12) Android application (1987) Android Game (710) AndroidPhoneဆိုင္ရာ (4) Antivirus (1) Apowersoft ApowerEdit v1.4.7.22 Build 04042019 (1) AVAST! Cleanup Premium 2019 version 19.1 Build 7085 (1) Blog Slider (8) Blogger Button (5) Blogger Comment (17) Blogger Ebooks (1) Blogger Hack (54) Blogger Loading Style (6) Blogger Mouse (1) Blogger Template (44) Blogger Tips (77) Blogger Widget (152) Blogs Html (63) Blogs Post (86) Blogs Tab Menu (53) Blogဆိုင္ရာ (1) Bowser ဆိုင္ရာ (21) Brothers in Arms® 3 v1.4.7c Mod Data [Unlimited Money] (1) Buddha ျမန္မာစာတန္းထုိး (53) Burning Software (34) Burning Tools (47) C-Box (10) Canon LBP 6000 Original Driver (1) Canon LBP 6030 Original Driver & Installation Guide (1) CCleaner 5.56.7144 (Business / Professional / Technician) Multilingual Portable (1) CD/DVD ဆိုင္ရာမ်ား (30) Cleanner-Speed (68) Computer Autoplay ပိတ္ထားနည္း (1) Computer Partationခြဲနည္း (1) Computer ဆိုင္ရာ (189) Computerဆိုင္ရာ (33) Converter (73) Desing Card (10) Display အလုပ္မလုပ္ေသာ ျပႆနာေျဖရွင္းနညး္မ်ား (1) Domain (3) Download Manager (42) Drive SnapShot v1.46.0.18213 (1) Driver Software (46) DVD-Cloner Platinum 2019 v16.30 Build 1446 [x86/x64] (1) DVDFab v11.0.2.4 [x86/x64] (1) Easy Translator version 14.0.0 (1) Ebooks (405) Errorေျဖ႐ွင္းနည္း (1) Eset Smart Security 12.1.34.0 (x86/x64) (1) Facebook (152) Folder Lock (17) Fonts မ်ားစုစည္းမႈ (6) Foxit PhantomPDF (1) Game (47) Game PC (32) Glary Utilities PRO version 5.117.0.142 (1) Gmail-Gtalk (70) GoogleChome &InternetDownloadmananger (1) Hacking (81) How To Download (6) Html (51) Internet Download Manager (18) InternetDownloadmananger(IDM) (1) IP Hider Software (6) Java Script (11) KhineMaster (1) KMS/2038 & Digital & Online Activation Suite v6.9 (1) MAGIX SOUND FORGE Pro 13 v.13.0.0 Build 46 (1) Marquee Technique (14) Media Player (31) MI Play store Apk (1) Microsoft Office (21) Mobile Legends Bang Bang Installer .exe Pc Version (1) Motors ( ေမာ္တာမ်ား )အေၾကာင္း (1) Movie (95) My Pdf (35) Myanmar Font (9) Myanmar Typing Software (1) MZW Solftware (1) NetGuide Journal (63) Network Software (7) New Blogs (15) Notကာကြယ္ျခင္းနည္း (1) ONEKEY PDF Convert to Word 4.0 REPACK (1) Partition Software (7) Password Recovery Software (1) paypal နွင္ ့ဆိုင္ေသာ (5) PC GAMES (17) PC recovery (13) PC Software (203) PC Speed Up (32) PC-Clean Software (73) PDF (4) PDF Editor (10) Photo Editor Software (64) PHOTO SHOP (သင္တန္း)သီးသန္႔ (44) Photo Slideshow (12) photoshop background အလန္းမ်ား (6) photoshop PNG ဖိုင္မ်ားရွာရန္ (14) Photoshop Software (35) Photoshop ဆိ္ုင္ရာ (51) Player (8) PrinterDriver (2) Programming (16) Pyidaungsu font (1) Read More (9) Recent Posts Widget (23) Recover Software (46) Recovery (33) Refresh and Restoreအေၾကာင္း (1) Reset (1) SAMSUNG One UI ဖုန္းေတြအတြက္ ျမန္မာေဖာင့္ (1) Screen Video Recorder (37) Search Box (6) Security Software (36) Sidebar Widget (71) SkyNet လိုင္းအသစ္ထည့္နည္း (1) SkynetBinfile (1) Slideshow Movie Maker (7) Social Widget (19) SOFTWARE (588) Software For Blogs (17) Software မ်ားအသံုးျပဳနည္း (2) Softwares ေတြအတြက္ Serial no (or) Key ေတာင္းလၽွင္ ေျဖ႐ွင္းနည္း (1) Speed Up Internet (13) TeamViewer version 14.2.2558.0 (Repack & Portable) (1) TTA Pie Myanmar (1) Unicode ေ​ြေပာင်းနည်း (1) Uninstaller Software (25) Upload (6) USB ျဖင့္၀င္းဒိုးတင္နည္း (4) USB ႀကိဳးကေန Virus မဝင္ေအာင္ ႀကိဳတင္ ကာကြယ္နည္း (1) Usb-Memory (19) Video Converter (29) Video Editing (76) Video Editor (1) Video Recorder (12) Virus ဆိုင္ရာ (86) WannaCry Ransomware ၏ အႏၱရာယ္ အေၾကာင္းႏွင့္ ကာကြယ္နည္း (1) Web Design ေရးဆြဲနည္း (5) Webcam Camera Software (11) Website ေရးနည္း (3) Wifi ဆိုင္ရာ (32) Win Update v1.4 (1) Window-10 ဆိုင္ရာ (2) Window-7 ဆိုင္ရာ (32) Window-xp ဆုိင္ရာ (2) window8ဆိုင္ရာ (19) Windows 10 Factory Reset ခ်နည္း (1) Windows 10 Backup & Restore လုုပ္နည္း (1) Windows 10 ကြန္ပ်ဴတာမွာျမန္မာစာတိက်မွန္စြာထည့္နည္း (1) Windows Activator (18) windows loader မ်ား (10) Windows Manager Software (23) Windows Themes (24) Windows တင္နည္းမ်ား (6) WinRAR 5.70 (Fully) (1) WinRar Full Version (12) WinRAR V3.80 Beta Version (1) WinToBootic ႏွင့္ USB ထဲ Install လုပ္နည္း (7) WinUtilities Professional Edition Tool (1) Wordpress Tips (3) Write-Protected ကို ျဖဳတ္ႏိုင္မယ့္နည္းႏွစ္သြယ္ (1) Zawgyi နဲ႔ Unocode ဘာကြာလဲ (1) ကြန္ပ်ဴတာ User Account Picture အေၾကာင္းမ်ား (1) ကြန္ပ်ဴတာဆိုင္ရာ (1) ကြန္ပ်ဴတာပတ္၀ပ္ေျပာင္းမရေအာင္လုပ္နည္း (1) ကြန္ပ်ဴတာရဲ ့Storage က HDD လား? SSD လား? စစ္ေဆးနည္းမ်ား (1) ကြန္ပ်ဴတာဟန္းေနရင္ေျဖ႐ွင္းနည္း (1) ကြ်နုပ္ႏွင့္ ပရဟိတအလွဴ (9) ကာမသိဒၶိက်မ္း (1) ခ်က္နည္းျပဳတ္နည္း (1) နည္းပညာဆိုင္ရာ (2) နည္းလမ္းမ်ား (6) ပန္ကာျပဳျပင္နည္း (1) ဖိုင္ေျဖနည္းမ်ား (8) ဗဟုသုတ (6) ဗားရွင္းအသစ္ထြက္ရွိလာတဲ႔ Facebook (ႏွင္႔) Messenger (1) ဘာသာစကား ၉၁ မ်ိုးထိ ပါ၀င္တဲ့ Easy Translator (1) ဘာသာေရးစာအုပ္မ်ား (9) မိမိဆိုက္ကိုေကာ္ပီကူးမရေအာင္ ပိတ္ထားနည္း (1) ျပည္ေထာင္စု ေဖာင့္ လက္ကြက္ ႏွင့္ စာ႐ိုက္နည္း (1) ျမန္မာစာမွန္ေအာင္လုပ္နည္း (1) ျမန္မာဆိုတာ (1) ဝင္းဒုိးကုိ AOMEISoftware ျဖင္႔ Backup & Restore လုပ္နည္း (1) သင့္ Laptop ကို ျမန္ဆန္ေအာင္လုပ္ေပးမယ့္ အခ်က္ ၇ ခ်က (1) အင္တာဗ်ဴးအစီစဥ္ (2) အပ်ိဳလမ္းၫႊန္ (1) အသံဇာတ္လမ္း (19) အေျခခံကြန္ပ်ဴတာ Pdf (1) ဦးဇာနည္နည္းလမ္းမ်ား (7) ေဆာ့ဝဲ ျပႆနာေျဖ႐ွင္းနည္း (1) ေၾကာ္ျငာ (13) ေဟာေျပာပြဲ (15)

မန္ဘာ၀င္လို႕အားေပးၾကပါ