frontend queen

вы отбирали по неправильному селектору (класс gallery без точки)

var images = document.querySelectorAll('.gallery img');

сама функция может быть такого вида:

images.forEach(image => {
  image.oncontextmenu = e => {
    e.preventDefault();
  };
})

document.querySelector('.item_count').onchange = function(event){
  document.querySelector('.add_item').setAttribute('data-count', event.target.value);
}

не вижу вариантов, кроме js

const details = document.querySelectorAll("details");

details.forEach((targetDetail) => {
  targetDetail.addEventListener("click", () => {
    details.forEach((detail) => {
      if (detail !== targetDetail) {
        detail.removeAttribute("open");
      }
    });
  });
});

jQuery(document).ready(function() {
  jQuery('span').on('mouseenter', function() {
    jQuery('div').show();
    jQuery('div').offset({top: 10, left: 10});
  }).on('mouseleave', function() {
  	jQuery('div').hide();
  });
});

флексы решают вопрос, но стоит учесть перенаполнение текста

пример

$('html, body').css({ 'overflow': 'hidden' });
setTimeout(function(){
  $('html, body').removeAttr('style')
}, 5000);

https://www.geeksforgeeks.org/how-to-disable-scrol...

при одинаковых входных данных (пропсах или данных, полученных через api, например) рендер не будет отличаться? не будет. значит, фк будет считаться чистой функцией, потому его можно и мемоизировать (здесь стоит упомянуть, что, если в компоненте переопределяется state, то react на memo обертку не обратит внимания и всё равно перерендерит)

window.onscroll = () => {
  const item = document.querySelector('itemSelector');
  (this.scrollY <= 10) ? item.className = 'initialState' : item.className = 'scrollState';
};

Один из вариантов: по событию клика тугглить класс с различными фоновыми изображениями.

Пример