Jump to content


Photo
Citi Theme

Citi Parallax wrapping image

citi parallax

  • Please log in to reply
7 replies to this topic

#1 amorgen

amorgen

    Newbie

  • Members
  • 5 posts
  • Country: Country Flag

Posted 18 March 2013 - 09:11 PM

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.

Attached Files



#2 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 18 March 2013 - 11:58 PM

 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.



#3 amorgen

amorgen

    Newbie

  • Members
  • 5 posts
  • Country: Country Flag

Posted 19 March 2013 - 12:50 AM

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.



#4 amorgen

amorgen

    Newbie

  • Members
  • 5 posts
  • Country: Country Flag

Posted 19 March 2013 - 03:17 AM

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.



#5 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 19 March 2013 - 01:46 PM

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.



#6 opwolken

opwolken

    Member

  • Members

  • 22 posts
  • Framework Version:DMS 2.0
  • Country: Country Flag

Posted 12 August 2013 - 08:48 PM

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, 12 August 2013 - 08:49 PM.


#7 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 14 August 2013 - 02:43 PM

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.



#8 andyaddis

andyaddis

    Newbie

  • Members

  • 5 posts
  • LocationHutchinson, Ks
  • Framework Version:DMS
  • Country: Country Flag

Posted 22 August 2013 - 11:03 AM

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







Also tagged with one or more of these keywords: Citi Theme, citi, parallax