<div id="divTrigger">
 <a href="javascript:;" onClick="openContent(this,'div1')" id="firstSlide">1</a>
 <a href="javascript:;" onClick="openContent(this,'div2')">2</a>
 <a href="javascript:;" onClick="openContent(this,'div3')">3</a>
 <a href="javascript:;" onClick="openContent(this,'div4')">4</a>
</div>
 
<div id="divContent">
 <div id="div1">
    <span class="title">Pemandangan Pantai</span>
 	<img src="images/img1.jpg" align="left" /> Pemandangan pantai memang menakjubkan, dengan berdiam diri sejenak dan
 	melihat pemandangan pantai niscaya kita akan mendapatkan kedamaian jiwa.
 </div>
 <div id="div2">
    <span class="title">Dua Pinguin</span>
 	<img src="images/img2.jpg" align="left" /> Pinguin adalah spesies makhluk hidup yang langka dan hanya terdapat pada
 	benua tertentu di bumi ini. Oleh karena itu kita penduduk dunia harus melestarikannya.
 </div>
 <div id="div3">
 	<span class="title">Pepohonan Sejuk</span>
 	<img src="images/img3.jpg" align="left" /> Ini adalah gambar wallpaper pilihan saya ketika sedang bekerja, dengan 
 	melihat gambar ini hati terasa menjadi lebih tenang.
 </div>
 <div id="div4">
 	<span class="title">Hujan Sakura</span>
 	<img src="images/img4.jpg" align="left" /> Menikmati bunga sakura bagi warga jepang adalah tradisi musiman yang 
 	menyenangkan pada saat memasuki musim dingin.
 </div>
</div>

 #divTrigger a:link,#divTrigger a:visited{
	text-decoration: none; /* hilangkan garis bawah pada link */
	margin:4px 0px; /* memberi jarak antar link */
	padding: 1px 4px; /* menjadikan link seperti kotak */
	border: 1px solid #CCC;
	background-color: #FFF;
	color: #000;
 }
 /* link yang dilalui oleh mouse dan element dengan class='selected' akan mempunyai efek yang sama */
 #divTrigger a:hover,#divTrigger a:active,.selected{ 
	background-color: #00A;
	color: #FFF;
 }
 #divContent{
	margin-top:4px;
	border:1px solid #CCC;
	width: 300px;
	height: 220px;
	padding: 4px;
 }
 #divContent div{ 
	/* semua div di dalam element dengan id='divContent' akan di sembunyikan sementara */
	display:none
 }	
 .title{
	font-size: 16px;
	font-weight: bold;
	color: #006;
	text-decoration: underline;
	margin-bottom: 2px;
	display:block
 }

<script language="javascript" src="jquery.js"></script>
<script language="javascript">
 /* parameter untuk menjalankan fungsi openContent ini adalah 	 
	 1. Element trigger (link) yang akan membuka content apabila di click
	 2. Id dari content yang akan ditampilkan
  */
 /* Update 08 Maret 2009
	 -> Slideshow diberikan animasi otomatis berpindah-pindah content		 
 */
 // siapkan variable timer yang akan menyimpan fungsi animasi 
 var timer = null; 
 function openContent(trigger,divID){ 
	// semua link pada div dengan id='divTrigger' akan di setarakan style-nya menjadi style normal 
	$('#divTrigger a').each( 
		function(){
			$(this).css({'background-color':'#FFF','color':'#000'});			 	
		}
	);
	// semua div di dalam element dengan id='divContent' disembunyikan
	$('#divContent div').hide();
 
	// div yang akan ditampilkan diberi efek fadeIn (built-in dari JQuery) ketika ditampilkan
	$('#'+divID).fadeIn('slow');
 
	// link menjadi trigger diberi style berbeda dengan link lainnya agar dapat diketahui content nomor berapa yang sedang aktif
	$(trigger).css({'background-color':'#00A','color':'#FFF'});	 	
 
	// Update 08 Maret 2009
	// timer di set 
	if(timer != null) clearTimeout(timer);
	timer = setTimeout( 
	  function(){		
		/* Cek terlebih dahulu apakah link yang sedang di-click saat ini ada link lagi setelah itu
		   apabila tidak ada link lagi setelah element yang sedang di-click maka pilih element link pertama
		   dengan selector ':first' dari jquery. Setelah sudah ditentukan link, maka lakukan event click
		   pada link tersebut. Setiap link yang di click akan menjalankan fungsi ini sehingga terjadi animasi
		   perpindahan content slideshow.
		*/	  
		var nextAnchor = ($(trigger).next('a').text() == '') ? $('#divTrigger a:first') : $(trigger).next('a');
		nextAnchor.click();
	  }, 3000 // 3 detik waktu perpindahan content
	);
 }	 
 $(document).ready(
	function(){
		// untuk permulaan, tampilkan content nomor pertama '#firstSlide' adalah id dari trigger yang akan membuka content nomor pertama
		openContent($('#firstSlide'),'div1');			
	}
 )
</script>