Skip to main content

Letak Gallery Gambar Di Dalam Blog





Tutorial kali nie Mr. Drakula nak konsi dengan korang widget gallery yang pernah di letak kat dalam blog.memang smart, kalau korang nak cuba try ikut step kat bawah nie k.

Step 1: Letak gallery code dekat templates

Dashboard, layout >> Edit Html >>
lepas tu cari code nie 


                ]]></b:skin> 


Copy code dekat bawah nie sebelum code di atas


/* Blogger Zoom Gallery By AllBlogTools.com */
ul.thumb {
float: left;
list-style: none;
margin: 0; padding: 10px;
width: 360px;
}
ul.thumb li {
margin: 0; padding: 5px;
float: left;
position: relative; /* Set the absolute positioning base coordinate */
width: 110px;
height: 110px;
}
ul.thumb li img {
width: 100px; height: 100px; /* Set the small thumbnail size */
-ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */
border: 1px solid #ddd;
padding: 5px;
background: #f0f0f0;
position: absolute;
left: 0; top: 0;
}
ul.thumb li img.hover {
background:url(http://4.bp.blogspot.com/_p4Te9Li52fs/So9a2fSh2jI/AAAAAAAAAAc/
VX0mAW1oYHc/thumb_bg.png) no-repeat center center; /* Image used as background
on hover effect
border: none; /* Get rid of border on hover */
}


Lepas tu cari code nie

</head>

Korang copy code kat bawah nie sebelum code </head>


<script src='http://code.jquery.com/jquery-latest.js'
type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){


//Larger thumbnail preview


$(&quot;ul.thumb li&quot;).hover(function() {
$(this).css({&#39;z-index&#39; : &#39;10&#39;});
$(this).find(&#39;img&#39;).addClass(&quot;hover&quot;).stop()
.animate({
marginTop: &#39;-110px&#39;,
marginLeft: &#39;-110px&#39;,
top: &#39;50%&#39;,
left: &#39;50%&#39;,
width: &#39;174px&#39;,
height: &#39;174px&#39;,
padding: &#39;20px&#39;
}, 200);

} , function() {
$(this).css({&#39;z-index&#39; : &#39;0&#39;});
$(this).find(&#39;img&#39;).removeClass(&quot;hover&quot;).stop()
.animate({
marginTop: &#39;0&#39;,
marginLeft: &#39;0&#39;,
top: &#39;0&#39;,
left: &#39;0&#39;,
width: &#39;100px&#39;,
height: &#39;100px&#39;,
padding: &#39;5px&#39;
}, 400);
});



//Swap Image on Click
$(&quot;ul.thumb li a&quot;).click(function() {



var mainImage = $(this).attr(&quot;href&quot;); //Find Image Name
$(&quot;#main_view img&quot;).attr({ src: mainImage });
return false;
});


});
</script>



Save code tadi..

Step 2: Letak gellery dekat templates

Layout >> page elements dan korang boleh pilih nak letak kat sidebar, footer atau kat bottom.

Click 'Add a Gadget' pilih Html/Javascript

Copy code dibawah nie k.

<ul class="thumb">

<li><a href="#"><img src="picture 1 Link" alt="" /></a></li>

<li><a href="#"><img src="picture 2 Link" alt="" /></a></li>

<li><a href="#"><img src="picture 3 Link" alt="" /></a></li>

<li><a href="#"><img src="picture 4 Link" alt="" /></a></li>

</ul>


Lepas tu korang boleh copy url image sendiri just tukar yang warna merah tu je k..kalau nak tambah link korang tambah link kat bawah nie jer

<li><a href="URL 1 #"><img src="picture 1 Link" alt="" /></a></li>
Save lepas siap masukkan link..

Comments

Popular posts from this blog

Tubuh Mongelku Di Kucup.. Di Isap.. Di Ramas Sepuas-puasnya

Kisah hidupku bermula di sebuah pub terkenal di ibu kota. Aku ditempatkan disuatu tempat yg sempit bersama 19 yg lain Tauke Leong yaaaa..aku masih ingat nama itu..dialah yg memiliki kami..Suatu malam datang seoranglelaki bernama Joe. Aku tak pasti apa yg dibincangkan oleh Joe dgn Taukey Leong..apa yg aku ingat..setelah itu Joe menghampiri dan membawa aku pergi..aku resah meninggalkan kawan yang lain.

Mereka hanya mampu melemparkan pandangan sayu penuh simpati? simpati padaku dan jugak pada diri mereka sendiri..kerna mereka sedar? mereka juga bakal menerima nasib yang sama? Joe membawa aku berjalan ? jalan menyusuri kaki lima ibu kota dengan riang..sungguh indah pemandangan bandaraya ini alangkah bahagianya jika aku dapat menikmati malam-malam begini tanpa kongkongan..tanpa perlu menjadi hamba kepada sesiapa..

Tiba Joe berhenti..melabuhkan punggung sambil tersenyum, menyeringai seolah-oleh ada sesuatu yg sedang mengeletek nafsunya perlahan-lahan Joe menyentuh tubuhku..dilurut-lurutnya …

Kenali Hafiz Mahamad

Wow ! Tak sangka mamat ni makin popular dikalangan gadis-gadis. Well, ramai pompuan nak boyfriend dia macam Hafiz Mahamad kan. Siapa je tak mau dilayan macam princess. Okay, buat yang masih tak kenal siapa Hafiz Mahamad ni, boleh lah Stalk Instagram, Twitter dan FB dia. Buat lelaki-lelaki diluar sana, boleh la ambil inspirasi dari dia. Hehehe



Instagram           :@Hafizmahamad
Twitter               : @Hafizmahamad
Facebook           :  Hafiz Mahamad

ZULASRI : Power shall ! 

JOM TERJAH STORY NI JUGA :
Bagaimana badan kita beroperasiJenis denda yang guru lakukan di sekolahProjek bahasa asing Kem Bina Insan guru Vokasional Mid Night Movie - The Hunger Games MockingJay

Cara mengambil SPM semula

Untuk mendapat kerja di institusi kerajaan dengan kelayakan SPM sekarang ni amat sukar. Banyak persaingan berlaku diantara pelajar lain. Semakin ramai pelajar Malaysia semakin pandai dengan mendapat keputusan yang cemerlang. Baru-baru ini, aku mendapat email daripada seorang sahabat blog yang mempertanyakan bagaimana untuk mengambil SPM semula. Okay, sebelum kita ingin mengambil peperiksaan ulangan, kita hendaklah berpegang dengan syarat yang diberikan oleh Kementerian.


Syarat Pendaftaran Peperiksaan Sijil Pelajaran Malaysia (SPM)


Pelajar Tingkatan Lima Sekolah Menengah Kerajaan / Sekolah Menengah Bantuan Kerajaan / Sekolah Swasta yang diiktiraf oleh Kementerian Pelajaran Malaysia.
atau

Mereka yang pernah menduduki PMR sekurang-kurangnya 1 (satu) tahun sebelum mendaftar untuk menduduki peperiksaan SPM.
atau
Mereka yang pernah menduduki peperiksaan SPM / SPM(V) / SPVM / MCE / SC / FMC.
atau
Mereka yang telah mencapai umur 19 17 tahun pada 1 Januari dalam tahun peperiksaan SPM semasa.

Merek…