Скрыть фиксированный div с непрозрачностью 0,9 на свитке

Question

в последнем шаблоне у меня есть заголовок в div, который я скрываю при прокрутке, используя этот код:

<script>
$(window).scroll(function(){
    $(".title").css("opacity", 0.9 - $(window).scrollTop() / 5);
  });
</script>

В Safari у меня есть проблема, заключающаяся в том, что при прокрутке вверх в Safari через div добавляется непрозрачность, которая превышает стандартное значение 0,9. Это не выглядит хорошо в моем шаблоне, потому что div является частью заголовка с непрозрачностью 0,9. Я хочу, чтобы оно показывалось максимально с непрозрачностью 0,9, а не 1 или 1,2 и т. Д.

Эффект виден только в Safari через эффект отскока прокрутки. Я попытался добавить это в свой CSS без какого-либо положительного эффекта:

html,
body {
  height: 100%;
  width: 100%;
  overflow: auto;
}

Есть идеи?

Ты, пока!

Answer 1

Вы можете проверить значение, прежде чем применять его, и убедиться, что оно не выше 0,9, например:

$(window).scroll(function()
{
   var opacity = 0.9 - $(window).scrollTop() / 5;
   if (opacity > 0.9)
   {
      opacity = 0.9;
   }
   $(".title").css("opacity", opacity);
});

Answer 2

Вы можете использовать условную троицу, чтобы ограничить ее:

var opacity = 0.9 - $(window).scrollTop() / 5;
$(".title").css("opacity", opacity > 0.9 ? 0.9 : opacity);