Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 24.03.2018, 11:49
Аспирант
Отправить личное сообщение для LLIypuk Посмотреть профиль Найти все сообщения от LLIypuk
 
Регистрация: 23.07.2015
Сообщений: 48

Динамическая загрузка контента через AJAX jQuery
Всем привет.
Решил сделать загрузку контента через AJAX или jQuery load.
Нъюанс в том, что контент должен меняться с помощью анимации и в процессе загрузки должен работать прелоадер.

В итоге нашел отличный код https://webformyself.com/kak-dinamic...oshhyu-jquery/ , но проблема в том, что он некорректно работает в некоторых браузерах. Так, например, в Google Chrome работает анимация, но не работает переход между страницами.

Вообщем есть ли кроссплатформенный код или плагин подобного типа.
Ответить с цитированием
  #2 (permalink)  
Старый 24.03.2018, 12:20
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

погуглите про SPA технологию.
Ответить с цитированием
  #3 (permalink)  
Старый 24.03.2018, 12:37
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

https://www.youtube.com/watch?v=sAjA...ndex=34&t=176s

жесть! смотреть до конца!
Ответить с цитированием
  #4 (permalink)  
Старый 24.03.2018, 13:24
Аспирант
Отправить личное сообщение для LLIypuk Посмотреть профиль Найти все сообщения от LLIypuk
 
Регистрация: 23.07.2015
Сообщений: 48

Списибо за за ссылки. Но вот все-таки... Можно ли поправить код на jQuery чтобы он работал корректно???

Сам код:
$(document).ready(function() {
	var hash = window.location.hash.substr(1);
	var href = $('#nav li a').each(function(){
		var href = $(this).attr('href');
		if(hash==href.substr(0,href.length-5)){
			var toLoad = hash+'.html #content';
			$('#content').load(toLoad)
		}											
	});
	$('#nav li a').click(function(){					  
		var toLoad = $(this).attr('href')+' #content';
		$('#content').hide('fast',loadContent);
		$('#load').remove();
		$('#wrapper').append('<span id="load">LOADING...</span>');
		$('#load').fadeIn('normal');
		window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
		function loadContent() {
			$('#content').load(toLoad,'',showNewContent())
		}
		function showNewContent() {
			$('#content').show('normal',hideLoader());
		}
		function hideLoader() {
			$('#load').fadeOut('normal');
		}
		return false;
	});
});

Последний раз редактировалось LLIypuk, 24.03.2018 в 13:26.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Загрузка в div, который пришел через ajax sazanof jQuery 4 16.08.2016 16:20
Книги по Ajax BaVa Учебные материалы 18 18.08.2013 14:05
jQuery Ajax ивент krasovsky jQuery 4 11.07.2013 11:55
Не работает jQuery меню с AJAX eugene1986 jQuery 0 08.07.2010 18:49
JQuery + Ajax = загрузка изображений jokerbot jQuery 0 06.12.2009 15:10