HTML trick for changing font color at certain scrollbar height?

  • Resolved christyfppc

    (@christyfppc)


    10 years, 9 months ago

    I am wondering if you can set up some snippet of code so that when a person on my site is scrolling down, at a certain place on the page/certain scrollbar height, the font color will change?

    I have a background image that is light at the top and dark at the bottom and the font color is currently white but when they scroll down, the text moves up into the light area and becomes illegible. Any help is much appreciated!

Viewing 2 replies - 1 through 2 (of 2 total)

  • I don’t know of a way to do this with pure HTML, but if you’re able to use jQuery, this might do the trick:

    $(window).scroll(function () {
    if ($(window).scrollTop() + $(window).height() > **whatever height you want** {
    $(‘body’).css.(‘background’, ‘url(**your background image you want to use at this height**)’);
    });

    Thread Starter christyfppc

    (@christyfppc)

    Thanks! I’m trying parallax scrolling out and I’m not completely comfortable with jQuery yet but am just diving into it.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘HTML trick for changing font color at certain scrollbar height?’ is closed to new replies.