Area con più Notizie

[Edipo]

Ciao a tutti, premetto che non sono un esperto di javascript altrimenti non avrei esposto il problema
Dunque ho un'area nella quale far visualizzare delle notizie, eccovi uno schema:

        
----------| 1 || 2 || 3 || 4 |--
|                               |
|                               |
|                               |
|                               |
|          TABELLA              |
|                               |
|_______________________________|

I numeri 1, 2, 3 e 4 sono dei Link (immagini) con effetto rollover ed al click di ogni singolo link dovrebbe cambiare il contenuto della TABELLA, un pò come l'area centrale del sito di html.it dove trovate Articoli, Guide, Script etc.
Come posso fare? Da dove comincio?
Grazie.

[Edipo]

Ho trovato su html.it uno script che fa al caso, lo posto:

<div class="TabView" id="TabView">
	<div class="Tabs" style="width: 350px;">
		<a onMouseOver="MM_swapImage('MusicOff','','images/MusicOn.jpg',1)" onMouseOut="MM_swapImgRestore()">
		[img]Images/MusicOff.jpg[/img]</a>
		<a onMouseOver="MM_swapImage('CinemaOff','','images/CinemaOn.jpg',1)" onMouseOut="MM_swapImgRestore()">
		[img]Images/CinemaOff.jpg[/img]</a>
	</div>
			
	
	<div class="Pages" style="width: 350px; height: 250px;">

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

	</div>
</div>

<script language="JavaScript" type="text/javascript">
	tabview_initialize('TabView');
</script>

Il problema e che adesso non so come "bloccare" l'immagine del tasto relativa all'area scelta, quindi se clicco su MusicOff vorrei che passasse a MusicOn fin quando non clicco su Cinema e viceversa, non so se è chiaro cosa intendo
Spero mi possiate aiutare, grazie.