Last Visible Li on screen

Another Solution

Here's one way you could do this using JavaScript:

1. Get the li elements that are visible on the screen by using the getClientRects method on each element. This method returns a list of rectangles that represent the element's size and position relative to the viewport.

2. Iterate through the list of visible li elements and find the one that is closest to the right edge of the viewport. You can do this by comparing the right property of each element's rectangle to the width of the viewport. The element with the highest right value is the one that is closest to the right edge.

Here's some example code that demonstrates how this could work:

const liElements = document.querySelectorAll('li');

// Find the last visible li element
let lastVisibleLi;
let maxRight = 0;
for (const li of liElements) {
  const rect = li.getClientRects()[0];
  if (rect.right > maxRight) {
    maxRight = rect.right;
    lastVisibleLi = li;
  }
}

console.log(lastVisibleLi); // The last visible li element

This code will find the last visible li element by iterating through all of the li elements and keeping track of the one with the highest right value.

Answer By ChatGPT

You can use JavaScript to determine the visibility of each li element and then find the one that is closest to the right edge of the screen. Here's an example of how you might do this:

var listItems = document.querySelectorAll('li');

var lastVisibleItem;
var minDistance = Infinity;

for (var i = 0; i < listItems.length; i++) {
  var rect = listItems[i].getBoundingClientRect();
  if (rect.right > 0 && rect.left < window.innerWidth) {
    // The element is visible on the screen
    var distance = rect.right - rect.left;
    if (distance < minDistance) {
      minDistance = distance;
      lastVisibleItem = listItems[i];
    }
  }
}

// lastVisibleItem is the last visible li element

This code iterates through all of the li elements, checks to see if they are visible on the screen (based on their bounding rectangle), and then finds the one that is closest to the right edge of the screen.