var delay = false;
$(document).on("mousewheel DOMMouseScroll", function(event) {
event.preventDefault();
if (delay) return;
delay = true;
setTimeout(function() {
delay = false;
}, 200);
var wd = event.originalEvent.wheelDelta || -event.originalEvent.detail;
var a = document.getElementsByTagName("del");
if (wd < 0) {
for (var i = 0; i < a.length; i++) {
var t = a[i].getClientRects()[0].top;
if (t >= 40) break;
}
} else {
for (var i = a.length - 1; i >= 0; i--) {
var t = a[i].getClientRects()[0].top;
if (t < -20) break;
}
}
if (i >= 0 && i < a.length) {
$("html,body").animate({
scrollTop: a[i].offsetTop
});
}
});
And then you need to use html elements to add the identifying tags:
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com