I'm facing a challenge with a page layout that involves two vertical div's - one for the menu on the left and another for loading content on the right. My goal is to utilize the .scrollintoview() function on the menu div so that when a link is clicked, it remains aligned at the top.
Additionally, I would like to implement scrolling functionality specifically within the left div. After exploring a solution in this fiddle, I attempted to apply it to each link in my code but encountered issues with it not functioning correctly.
A snippet of my code:
//script for scrollintoview
$(".fleft #01").click(function() {
var target = document.getElementById(".fleft #02");
target.parentNode.scrollTop = target.offsetTop - target.parentNode.offsetTop;
});
//script for loading content on the right div
$(document).ready(function () {
$('.fleft #01').click(function () {
$('.fright').load('div1.html .innerRight');
});
$('.fleft #02').click(function () {
$('.fright').load('teste2.html');
var data = $(this).html();
});
$('.fleft #03').click(function () {
$('.fright').load('teste3.html');
});
})