• 0
Sign in to follow this  
Followers 0

Citi Theme Citi Parallax wrapping image


Question

Posted · Report post

I'm using 5 images all are jpegs with dimensions 1600 x 600 (as recommended). When Parallax is turned off all the images view correctly. But when Parallax is turned on the first image (intro) appears correctly but all subsequent images (about, portfolio, contact, and blog) are wrapping the image with a portion of the bottom of the image displaying at the top. It appears that adjusting the width of the web browser (i've tried Safari and Chrome) has a direct impact on the degree of wrapping. I've attached a screen grap of the problem.

Share this post


Link to post
Share on other sites

7 answers to this question

  • 0

Posted · Report post

 What you're seing, isn't visible when your logged out. It seems the wp admin bar displaces the calculated positions of the backgrounds. Not to much of a big deal really because nobody else sees that.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I'm also seeing this when I'm logged out. I've tried it from Safari logged out and on an iPad which I never have logged into. All show the same issue.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I've reset citi theme to default settings and I still see the issue with the default images, tested in Safari not logged in. If the width of the Safari browser is greater then 1024px then there is no issue, but if it smaller (1015 px or less) the issue shows up and gets worse the smaller you make the width of the browser window.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

The demo and my local copy doesn't do this. I also haven't had any reports of this.

 

The background-size is set to background-size:cover, so it's always going to be different because the image scales and remains centered. If you want a different effect, try background-size:contain where the image breaks are at. I'm on vacation right now so I can't bring up the site and tell you the selectors, but you can identify them with inspector.

Share this post


Link to post
Share on other sites
  • 0

Posted (edited) · Report post

I would like to bring up this post because I have the same problem amergon has or had. I have made a workaround for this problem on my side, to make the lower part of the image white, like the background and the header. A demo can be found on www.test.opwolken.com. the picture is 768 pixels high and the section is 400px high. If you look closely you see the lower part of the image (all white) on top of the rest of the image.

 

Is there a solution for the lower part of the image to not show up on top when opening the website?

Edited by opwolken

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I just can't replicate this at all. When you are logged out, there is no issue.

 

http://citi.nichola.us/

 

The demo shows no spacing at the top.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I have the exact same issue... really need a fix

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0