I did a side project that helps with comparisons, but in a rather different way (e.g. how many African elephants does something weigh). Not as slick as this site, but someone might find it useful:
(function() {
let direction = 'right'; // Start by going right
let intervalId;
function getCurrentAnimalName() {
const animalDiv = document.querySelector('.animal-name');
return animalDiv ? animalDiv.textContent.trim() : '';
}
function pressKey(keyCode) {
const event = new KeyboardEvent('keydown', {
key: keyCode === 37 ? 'ArrowLeft' : 'ArrowRight',
keyCode: keyCode,
code: keyCode === 37 ? 'ArrowLeft' : 'ArrowRight',
which: keyCode,
bubbles: true
});
document.dispatchEvent(event);
}
function autoScroll() {
const currentName = getCurrentAnimalName();
if (direction === 'right') {
pressKey(39); // Right arrow
if (currentName === 'Pando Clone') {
console.log('Reached Pando Clone, switching to left');
direction = 'left';
}
} else {
pressKey(37); // Left arrow
if (currentName === 'DNA') {
console.log('Reached DNA, switching to right');
direction = 'right';
}
}
}
// Start the interval
intervalId = setInterval(autoScroll, 3000);
// Log start message and provide stop function
console.log('Auto-scroll started! To stop, call: stopAutoScroll()');
// Expose stop function globally
window.stopAutoScroll = function() {
clearInterval(intervalId);
console.log('Auto-scroll stopped');
};
})(); {
const s = window.scroller = {}
const press = (key, code) => () =>
document.dispatchEvent(new KeyboardEvent('keydown', {
key: key, keyCode: code,
which: key, code: code, bubbles: true
}));
const step = () => {
const div = document.querySelector('.animal-name')
const name = div?.textContent.trim()
if (name === 'Pando Clone') s.dir = s.left
if (name === 'DNA') s.dir = s.right
s.dir()
}
s.left = press(37, 'ArrowLeft')
s.right = s.dir = press(39, 'ArrowRight')
s.start = (ms) => s.ival = setInterval(step, ms)
s.stop = () => clearInterval(s.ival)
}
scroller.start(5000)1. https://healthland.time.com/2013/06/21/theyre-alive-harveste... 2. https://agriculture.institute/food-chemistry-and-physiology/...
Star Size Comparison 3, simply a stunning visualization.