Bonjour.

Je charge des pages dans un container (<section>) avec un loader ajax.

ça fonctionne très bien mais je n'arrive pas à atteindre l'ancre qui va avec l'url

genre: page.html#_idTextAnchor008

Je sèche salement.

monContainer.scrollTop = document.querySelector(ancre).offsetTop;

ne fonctionne pas

la console me renvoie une valeur pour le offsetTop (donc il le trouve)

Je n'utilise pas jQuery !!!

Une idée?

merci

je vous laisse le code pour la bonne bouche

function chargeChapitre(_url) {
	const ancre = '#'+_url.split('#')[1];
	const con = document.querySelector('#main-content');
	if (pageEncours != _url.split("#")[0]) {
				
		console.log(`chargeChapitre("${_url}")`,_url.split('#')[1]);
					
		// cache le container
					
		let xhr = new XMLHttpRequest();
		
							
		xhr.onreadystatechange = function (e) { 
			if (xhr.readyState == 4 && xhr.status == 200) {
				con.innerHTML = xhr.responseText;	
				pageEncours = _url.split("#")[0]
			}
		}
		xhr.onload = function (e) {
			console.log(e.status);
			if (xhr.readyState == 4 && xhr.status == 200) {
				console.log("chargé");
				// va à l'ancre
				console.log('offsetTop',document.querySelector(ancre).offsetTop);
				con.scrollTop = document.querySelector(ancre).offsetTop;
				//console.log(`transition ${con.style.transitionDuration}, ${con.style.transitionDelay}`);
			}
			if (xhr.status == 404) {
				console.log ("le fichier n'est pas trouvable");
			}
		}			
		xhr.open("GET", _url, true);
		xhr.setRequestHeader('Content-type', 'text/html');
		xhr.send();
		urlEncours = _url;
	} else {
		console.log("meme page");
		if (urlEncours != _url) {
			console.log('offsetTop',document.querySelector(ancre).offsetTop);
			con.scrollTop = document.querySelector(ancre).offsetTop;
		} else {
			//même url + meme ancre
		}
	}
}

-
Edité par mrbbp 16 janvier 2019 à 19:37:16

<a href="#ton-ancre">Lien</a>

Salut NuageZen,

je charge la page depuis un sommaire qui est lui-même chargé dans une div...

donc ça marche pas.

La solution compliquée est que je n'appelle pas le bon container pour le scrollTo, je dois appeler le parent...