Powered by Jasper Roberts - Blog

TV Online @ Budak Nakal Blogspot(TV1 dan TV2)

Jom! comments

Di ruangan ini korang boleh menonton tv saluran RTM...saluran-saluran yang lain insyallah akan koz tambah dari masa ke semasa...enjoy okey^ ^

TV1
































TV2




















______________________________________________

Nama Jepun Yang Lawak.

4 comments


Hai all...ahak hari ini koz nak kongsi dengan korang senarai nama yang boleh di katakan lawak juga...
hihi..jadi korang layan ar okey^ ^...

1. Yang pemarah - KEJI CACIMAKI
2. Yang tak suka brg mahal - SATO SUKAMURA
3. Yang bisu - KITA TADASUARA
4. Yang suka makan tose - NANACHI HITOSE
5. Yang suka lagu blues - APO NADIKATO
6. Yang suka belajar - ASIKO ULANGKAJI
7. Yang kerap bikin ribut - WAKASI HURUHARA
8. Yang masih bujang - MATIMATI TAMOKASI
9. Yang masih gatal - ICHI BAWA
10. yang suka memasak -AJINO0MOTO DAHABISLA
11. Yang hidup menyusahkan orang - KICHI KICHI TAKMAUM MATI

Tutorial Cara Buat TabView Tanpa Mengubah Template

4 comments



Hai all...Hari ini koz nak ajar korang cara hendak membuat Widget Tabview di blog...Tutorial ini ramai juga buat permintaan supaya koz dapat mengubah script asal yang jika di guna pakai ia juga memberi effect pada code HTML template...Alhamdulillah koz dapat juga mengubah scriptnya yang tidak akan mengganggu script/code template jika menggunakannya.

Widget ini dapat menjimatkan ruang sidebar sesebuah blog...ia juga turut dapat meringankan loanding sesebuah blog...Jika berminat memiliki widget ini, mari ikuti cara-cara atau langkah-langkah membuatnya:-

Langkah 1

Layout>Page Elements>Add a Gadget>HTML/Javascript

Langkah 2

Copy dan paste code di bawah

<div id="widget" style="background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio98V2oipjDqw1DqdSHshmjeg3zx_W0V5fyM4fwG0Wp6Xuj_mDSuPTCRGlgj_qbeeleinTNT4LpMWWx6NI0TVET8wAkgNNJuU3Zt2bjKb1bEcHDkc4bwn3mfLphKLr27fEzEP6kIPCEJht/s1600/bg+widget.png) no-repeat left top; width:350px;height:406px;padding: 50px 10px 0px;text-align: center;line-height: 1 ">

<style type="text/css">
div.TabView div.Tabs
{height: 30px;overflow: hidden}
div.TabView div.Tabs a {float:left; display:block; width: 98px; /* Main Menu Top Width */
text-align:center ; height: 30px; /* Top High Main Menu
*/
padding-top:8px; vertical-align:middle; border:2px solid #66CCFF; /* Top Menu border color */
border-bottom-width:0; text-decoration: none; font-family: "Verdana", Serif; /* Top Fonts Main Menu */
font-weight:bold; color:#000; /* Main Menu Font Color Top */ -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active {background-color: #CCF0FF; /* Background colors on Main Menu */ }
div.TabView div.Pages {clear:both; border:2px solid #66CCFF; /* Main Box border color */ overflow:hidden; background-color:#FFFFFF; /* Main Box background color */ }
div.TabView div.Pages div.Page {height:100%; padding:0px; overflow:hidden}
div.TabView div.Pages div.Page div.Pad {padding: 5px 5px}
</style>
<script type='text/javascript'>
//<![CDATA[
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">
<a>Tajuk 1</a>

<a>Tajuk 2</a>

<a>Tajuk 3</a>
</div>
<div style="width:300px; height:310px; " class="Pages">
<div class="Page">
<div class="Pad">

ISI TAJUK 1(TEXT/CODE HTML)

</div>
</div>
<div class="Page">
<div class="Pad">

ISI TAJUK 2(TEXT/CODE HTML)

</div>
</div>
<div class="Page">
<div class="Pad">

ISI TAJUK 3(TEXT/CODE HTML)

</div>
</div>
</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>

</div>

Sedikit perubahan harus dilakukan pada code berwarna merah tetapkan tajuk dan code berwarna biru tetapkan isi kandungan mengikut tajuk masing-masing...

Jika ingin mengubah background widget ini,gantikan di code berwarna ungu dan tetapkan saiz gambar berkenaan ( width 350px height 406px )

Save dan lihat hasilnya...

Selamat mencuba^ ^...

Denaihati.com

 
Google PageRank Checker Powered by  MyPagerank.Net