Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Aurelian Spodarec
Aurelian Spodarec
10,801 Points

Window scroll and zoom

I need my heading, I mean my name and front-end developer etc.. what is in center, to have this code at starting

    opacity: 1;
    transform: translate3d(0px, 0px, 0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale3d(1, 1, 1);
}

and as i scroll down, gradually make the opacity go from 1 to 0, same as scale3d to 1 from 0 gradually. 

opacity: 0;
translate3d(0px, 0px, 0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale3d(0.2, 0.2, 0.2)

I know you can use JS window.scroll fucntion whatever...

But not sure how to update this on scroll and make it go from 1 to 0

and that's my site

https://aurelianspodarec.github.io/hcOriginalAurePortfolio/

Jacob Mishkin
Jacob Mishkin
23,118 Points

Okay, so what is your question?

Aurelian Spodarec
Aurelian Spodarec
10,801 Points

How to I update the code above? the last three values 

 scale3d(0.2, 0.2, 0.2)

So it goes from 1 to 0 as I scroll down by some %?

Jacob Mishkin
Jacob Mishkin
23,118 Points

I would look into the CSS transitions selector. Sorry but I haven't used translate3d all that much.

Aurelian Spodarec
Aurelian Spodarec
10,801 Points

Oh, and that opacity from 1 to 0.

I think this is done with JavaScript, when an event, in this case scroll, is made, with JS things you update the opacity and the other values however you wish. If Im right. Unless CSS got so advanced you don't need JS for that : d

Btw, could you help me to customize WordPress theme? They bough a theme, but I enver customized any piad theme and I did figure out quite a bit stuff.. but that's still not enough.. and Was wondeing.. if I was to do the front-end of the next two sites I stupposed to do, and you could do etc.. If you ud be interested in this? I just strugle with WordPress a bit : p