Cara Membuat Slide show Image keren Menggunakan Marquee Di Blog


Cara Membuat Slide show  Image keren Menggunakan Marquee Di Blog


Dalam Posting ini kita akan membahas tentang membuat tampilan Slide image yang bergerak secara horizontal bergerak ke kiri dan ke kanan secara bergantian dengan menggunakan tag html saja. 


yaitu dengan menggunakan tag html "marquee" dengan tag marque kita dapat menampilkan objeck apapun seperti teks, gambar, bahkan object css pun dapat dimasukan pada marquee dengan sarat harus pada dalam jangkauannya. 

sebelum kita masuk kedalam pembahasan akan pasti kita pernah timbul pertanyaan di benak kita apasih itu Marquee .... ?

Menurut Beberapa sumber Seperti Wikipedia Marquee dapat merujuk ke :


  • Marquee (tanda) , tanda ditempatkan di atas pintu masuk ke suatu pendirian
  • Marquee (tenda) , tenda besar, umumnya digunakan sebagai bangunan sementara
  • Marquee Club , biasa disebut The Marquee, klub rock di London.
  • "Marquee", sebuah lagu oleh Super Chunk dari album 1997 Living Indoor mereka
  • Pemain Marquee  , atlet profesional dianggap sangat populer, terampil, atau luar biasa
  • Seleksi Marquee , teknik animasi sering ditemukan dalam alat seleksi program grafik komputer
  • Elemen Marquee , tag HTML yang membuat teks menggulir di seluruh halaman seolah-olah pada tenda


Mudah-Mudahan Marquee yang di Maksud dalam pembahasan ini adalah yang urutan terakhir.
Karna Marquee juga adalah sebuah efek dalam bentuk modifikasi tulisan di blog dengan membuat efek teks yang bisa bergerak. Bisa dari kanan ke kiri, atau dari atas ke bawah dan sebaliknya



Cara Membuat Slide show  Image keren Menggunakan Marquee Di Blog


Dan untuk lebih Mudah pengertian dari Marquee adalah bahasa HTML untuk memberikan efek sebuah kata atau kalimat menjadi berjalan atau bergerak. 


Tentu Marquee tersebut mempunyai daya tarik tersendiri karena animasi berjalan dan bergerak di dalam area situs atau blog kita, selain itu juga menggunakan tag marquee tersebut dapat menghemat tempat pada blog.



Tentu tag marquee juga mempunyai sebuah kekurangan. kekurangan marquee tersebut adalah ketika konten atau isi dari marquee melebihi kapasitas (height atau width), apalagi sewaktu loading blog belum selesai seluruh isi marquee akan terlihat, dan itu memang sedikit mengganggu juga. 




Baiklah berikut ini tag html yang dapat membangun Slide Image nya :
Caranya tinggal vaste kan saja kode di bawah ini pada situs kita tepat nya di TATA LETAK
Klik tambahkan widget lalu pilih HTML/Java scrift lalu vaste. lihat hasilnya..


 <marquee align="center" behavior="alternate" direction="left" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="3" width="340 px">
<a href="URL Tujuan Gambar 1" target="_blank"><img border="0" height="80" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAiNGeh6NB75QHXAzWuDxkEH7adoMxSjHXkXPTpcyc-_IownbGdha5PVBJRU19iRXrafYagRSNzvBhO_sZA7Do302ito-6hlaw0fCV1VC-CcyVCuSpB8vb2ScLc12gvhAuvg3VMhtJgUX3/s1600/a.jpg" width="130" /></a>
<a href="URL Tujuan Gambar 2" target="_blank"><img border="0" height="80" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7J1nED2Y3bQdWVhFFnzIgwysi8IjvgMugD3ntYicR70UvdEF1iVZo9iutQOsYlKTEBKWLKiGQi0-YkZ1tx2BX7kECDWEoEDTtzzUv07SZggjrGZdkPS45udsdwFu-NhUXIsi0NpPfL7ni/s1600/s.jpg" width="130" /></a>
<a href="URL Tujuan Gambar 3" target="_blank"><img border="0" height="80" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgT_To15ZfNaVGHwwRfCj-cUXfr3jtg_dC3b0eGVQN4M1oOVZIPbVw3vn6UzkEWemDduxD80uBWYVqiHVl3ytfjacf6vyJSOWkDJIDIlBCC9Ti-PaMXhNqy3b6hSFrP3Wzyyxt_-WstDtq8/s1600/c.jpg" width="130" /></a>
<a href="URL Tujuan Gambar 4" target="_blank"><img border="0" height="80" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw2BB-LCSPIF_9V6aT2t4Z9jW89rMF6_vd66RDrmTZmjihYA68ntUKPMA1iqmM09PQWR70wGMvShb9O9PM4cN-CRTuJRqQRCFriNLWBIQs3KH24dwp1zqAG6MniOoYv7kF-kJFksD9Qw5d/s1600/rs.jpg" width="130" /></a>
<a href="URL Tujuan Gambar 5" target="_blank"><img border="0" height="80" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAiNGeh6NB75QHXAzWuDxkEH7adoMxSjHXkXPTpcyc-_IownbGdha5PVBJRU19iRXrafYagRSNzvBhO_sZA7Do302ito-6hlaw0fCV1VC-CcyVCuSpB8vb2ScLc12gvhAuvg3VMhtJgUX3/s1600/a.jpg" width="130" /></a>
</marquee>




Adapun File nya dapat dilihat hasilnya  dan dapat juga diunduh berikut di bawah ini :


Demo                                  Unduh


Cara Membuat Slide show Image keren Menggunakan Marquee Di Blog