var content_td=jQuery('.table_load').html(); 
        jQuery('.table_load').html("").css('width','800px').append("

"+content_td+"

");//помещаем конетент из td class="table_load" в div class='content_table' чтобы можно было использовать .slideDown(), иначе можно удалить эту часть кода jQuery(".uMenuRoot a, .uMenuV a").click(function(){ jQuery('.befor_td').remove();//удаляем блок с картинкой "Загрузка", нужен если быстро нажимать на разные ссылки jQuery(".uMenuRoot a").removeClass("uMenuItemA");//меняем стиль отображения активной ссылки jQuery(this).addClass("uMenuItemA");//меняем стиль отображения активной ссылки var href_a=jQuery(this).attr("href");//заносим в переменную адрес нажимаемой ссылки window.history.pushState(null, null, href_a);//отслеживает и вставляет в адресную строку новую ссылку jQuery('.content_table').before(" ").fadeOut(400, function(){//добавляем блок с картинкой "Загрузка" и скрываем блок с контентом jQuery('.befor_td').html('

Идет ЗАГРУЗКА

').css('width','800px'); jQuery('.content_table').load(href_a+" .table_load", function(){//загружаем с сервера новый контент jQuery('.table_load').css('width','800px'); jQuery('.befor_td').remove();//удаляем блок с картинкой "Загрузка" jQuery('.content_table:hidden').slideDown(300); //открываем блок с новым загруженным контентом }); }); returnfalse;// не даем браузеру перейти по ссылке при клике }); window.addEventListener("popstate", function(e){//берет ссылку из строки браузера и по ней загружает контент, как бы переход при клике по верхним стрелкам назад вперед var href_next_back=window.location.pathname; jQuery('.table_load').html('

Идет ЗАГРУЗКА

'); jQuery('.table_load').load(href_next_back+" .table_load", function(){ jQuery('.table_load').replaceWith(jQuery('.table_load').html()); window.history.pushState(null, null, href_a); }); });

Демо (ссылки левого меню "Меню сайта")

Добавить комментарий