nonkalol,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.active-menu-item {
background: #FFE4B5;
}
a {
cursor: pointer;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
$(function() {
var $but = $("#nav4 > li a"),
$blocks = $("#div5");
$blocks.hide();
$img = $("img", $blocks); // сервер имитация
$img.load(function() { // $.post callback
$blocks.slideDown()
});
$but.each(function(i, elem) {
var $el = $(elem),
url = $el.data('url');
$el.click(function(event) {
event.preventDefault();
$but.not($el).removeClass("active-menu-item");
$el.addClass("active-menu-item");
$blocks.slideUp(function() {
$img[0].src = url;
}); //$blocks.load(url,function() { $blocks.slideDown()}); что должно быть на самом деле
})
});
});
</script>
</head>
<body>
<ul id="nav4">
<li id="ksik">
<a data-url="http://www.forum-globalteam.ru/wp-content/uploads/motivator-12830.jpg" title="Компьютерные системы и комплексы">КCИК</a>
</li>
<li id="ks">
<a data-url="http://www.moirebenok.ua/gfx/00/00/8b/d3/image-08twf7d_jpg/thumb_800x600_10_w.jpg" title="Компьютерные сети">КС</a>
</li>
<li id="pks">
<a data-url="http://www.leben-und-erziehen.de/wp-content/uploads/2013/04/baby_quiz_fragen_neugierig_iSt_000015776994.jpg" title="Программирование в компьютерных системах">ПКС</a>
</li>
<li id="pi">
<a data-url="http://womem.org/infusions/al_genmem/includes/gen_image.php?image=307&gen_type=2&text1=&text2=" title="Прикладная информатика">ПИ</a>
</li>
<li id="eby">
<a data-url="http://content.foto.mail.ru/mail/sharunova60/_blogs/i-247.jpg" title="Экономика и бухгалтерский учет">ЭБУ</a>
</li>
<li id="atpp">
<a data-url="http://mindcamp.org/images-programs/orane_fun.jpg" title="Автоматизация технологических процессов и производств">
АТПП</a>
</li>
<li id="mts">
<a data-url="http://www.blissstudio.ru/thumb/732/487/uploads/photos/213~jpg" title="Многоканальные телекоммуникационные системы">МТС</a>
</li>
<li id="sssk">
<a data-url="http://upload.wikimedia.org/wikipedia/commons/7/7f/Smile_is_universal.jpg" title="Сети связи и системы коммутации">СССК</a>
</li>
<li id="ibts">
<a data-url="http://www.ahitravel.com/content/images/programs/CHINA13A/Foto_807883.jpg" title="Информационная безопасность телекоммуникационных систем">
ИБТС</a>
</li>
</ul>
<div class="" id="div5">
<img src="" alt="">
</div>
</body>
</html>