Help
cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Pilot Lvl 2
Message 1 of 7

The Parallax is Blank, There's No Photo Like I Coded It To

Solved! Go to Solution.

Hi guys!

 

I started to update my resume and then came across the problem that my parallax images were not working for the Portfolio and Contact Me.

 

The code is in Github: https://github.com/infinite-dreams/infinite-dreams.github.io

 

If you need more explanation, please reply!

 

Thank you!

- Zoe K.

6 Replies
Commander Lvl 2
Message 2 of 7

Re: The Parallax is Blank, There's No Photo Like I Coded It To

Hi @infinite-dreams,

 

This is your resume for me:

 

Screenshot from 2019-10-14 14-07-09.png

 

What do you mean for problem with parallax?

 

-Gabriele-

 

Mark helpfull posts with Accept as Solution to help other users locate important info. Don't forget to give Kudos for great contents!

Pilot Lvl 2
Message 3 of 7

Re: The Parallax is Blank, There's No Photo Like I Coded It To

Hi @Wabri !

 

I mean if you scroll down, you would see this:

 

Capture.PNG1.PNG

 

So what I was asking was, how do I fix this? And I don't know how to do it.

Commander Lvl 2
Message 4 of 7

Re: The Parallax is Blank, There's No Photo Like I Coded It To

... and this is what I see in Brave (Chromium) and Windows 10.

Capture.PNG

I have no idea what you mean by a "Parallax Image": you want to use an image format (webp, jpeg, png, gif) which works for most browsers.

 

As the images in your portfolio section are all .webp files, you may be facing a limitation of your browser of choice. When authoring web pages, it's always wise to try to use features that will work in the browser(s) you want to support. See, for instance, https://caniuse.com/ for information on what CSS, HTML, etc are supported in specific browsers or versions.

 

Another piece of free advice: make your page smaller. Your header image is pretty large - try it on a mobile device (e.g. iphone, android phone/tablet) and see how it looks.

 

Please follow-up to let us know how you made out. For good karma, mark a reply as the answer if it helped!

Pilot Lvl 2
Message 5 of 7

Re: The Parallax is Blank, There's No Photo Like I Coded It To

Hi @fire-eggs !

 

I have already tried on Kindles, phones, ipads, and laptops and they look fine. I'll change it to jpeg or png images; and if you see the code on my GitHub, there is a parallax. I'm using the w3schools template as well.

Solution
Commander Lvl 2
Message 6 of 7

Re: The Parallax is Blank, There's No Photo Like I Coded It To

OK, my ignorance was showing. I had to research "parallax scrolling effect" to understand what you were referring to.

 

I'm guessing here, but looking at the W3schools example , I'm not sure you've got it quite right. They mention that the body, html and image styles must have the same height value, which you did not do.  You might be trying to accomplish something else, in which case you need to provide more details.

 

Please follow-up to let us know how you made out. For good karma, mark a reply as the answer if it helped!

Pilot Lvl 2
Message 7 of 7

Re: The Parallax is Blank, There's No Photo Like I Coded It To

Oh, now I see. Thanks @fire-eggs ! The problem is solved now!