Może zacznę od struktury:

Plik html w którym jest następujący kod:

[HTML] pobierz, plaintext 
<div class="produkty">
                <div class="col-sm-4">
                    <div class="service">
                    	<div class="image">
                        	<div class="normal">
                            	<a href="#sery"><img src="img/produkty-sery.jpg" alt="sery"/><h4>Sery</h4></a>
                            </div>
                        </div>
               	     <h4>Sery</h4>
                    </div>
            	</div>
 
                <div class="col-sm-4">
                    <div class="service">
                    	<div class="image">
                        	<div class="normal">
                            	<a href="#wedliny"><img src="img/produkty-wedliny.jpg" alt="wedliny"/><h4>Sery</h4></a>
                            </div>
                        </div>
               	     <h4>Sery</h4>
                    </div>
            	</div>
</div>
[HTML] pobierz, plaintext 

Po kliknięciu w którykolwiek z odnośników przyjmijmy, że jest to odnośnik #wedliny ma się wyświetlić inny div w miejscu divu "produkty".
Pseudokod:
if (a href=#wedliny) then .hide (.produkty) and .show(div xyz)
if (a href=#sery) then .hide (.produkty) and .show(div abc)

Realizacja, najlepiej przez jQuery w htmlu, ewentualnie jakaś wrzutka phpa.
Ktoś coś podpowie?

Jeśli zmienia się hash w adresie, to można to wykonać przy pomocy :target - nie trzeba żadnego JS. Przykład takiej nawigacji (dość toporny, ale akurat taki mam pod ręką): http://roberto.ovh.org/pomoc.html → http://roberto.ovh.org/pomoc.html#php (i nie jest to żadna aluzja do tematu!)
Można też kombinować ze zdarzeniem hashchanhe, jak np. mam to u siebie: http://tutorials.comandeer.pl/ → http://tutorials.comandeer.pl/#html ale IMO na :target będzie łatwiej