ipad header background disappears scrolling - Support | Kriesi.at

Tagged: disappears, Header Background, iPad, Scrolling

Viewing 10 posts - 1 through 10 (of 10 total)

Author

Posts
June 17, 2015 at 9:41 am #460604

Linden_Mobile
Participant

Hey,

On an iPad the header background disappears when you scrol. Because when you scroll the image also scrolls up.

How can I fix this?

June 17, 2015 at 4:58 pm #460873

Yigit
Keymaster

Hi Linden_Mobile!

Can you please post a screenshot of the issue you are getting? I do not have an actualy ipad but i checked your website on ipadpeek.com and header looks fine.

Best regards,
Yigit

June 17, 2015 at 5:15 pm #460883

Linden_Mobile
Participant

Hey,

The problem of this morning solved it self. Maybe it was still in the cach of my ipad.

An other with the header is still here. See the screenshot.

https://www.dropbox.com/s/kp1q98i5wpi943n/IMG_0014.jpg?dl=0

How can I only make the header smaller on a landscape iPad so it will fit the image?

Best regards

June 18, 2015 at 12:22 pm #461220
Ismael
Moderator
Hey!

Why do you have this css code?
```
@media only screen and (max-width: 1025px) and (min-width: 768px) {
.header_color .header_bg {
  background-size: 100% 10%;
}}
```
This will adjust the background width to 100% and use only 10% of the actual container height. You can use this instead:
```
@media only screen and (max-width: 1025px) and (min-width: 768px) {
.header_color .header_bg {
  background-size: cover;
}}
```
Cheers!
Ismael
June 18, 2015 at 12:54 pm #461238

Linden_Mobile
Participant

Hey,

I have that CSS because it works on it’s best on an iPad. Your css zooms in on the middle picture of the header. So your css doesn’t work.

Here is what happens with your css:
https://www.dropbox.com/s/mja4bmiwgdh10wy/IMG_0015.jpg?dl=0
https://www.dropbox.com/s/1oikay95013wjtw/IMG_0016.jpg?dl=0
https://www.dropbox.com/s/jdd64yldyastjg8/IMG_0017.jpg?dl=0

Hopefully you can still help me fix this.

Best regards!

June 19, 2015 at 1:07 pm #461840
Andy
Inactive Moderator
Hi!

I can’t reproduce and see the issue. Does it happen for you when testing it on ipadpeek.com as well?

Best regards,
Andy
- This reply was modified 9 years, 5 months ago by Andy.
June 19, 2015 at 1:10 pm #461843

Linden_Mobile
Participant

Hi,

No it doesn’t only on a real iPad.

best regards.

June 19, 2015 at 3:12 pm #461963
Ismael
Moderator
Hi!

What if you use this?
```
@media only screen and (max-width: 1025px) and (min-width: 768px) {
.header_color .header_bg {
  background-size: 100%;
}}
```
Did you follow our suggestion to use another image only for mobile? https://kriesi.at/support/topic/full-image-header-on-top-off-menu/#post-455584

Cheers!
Ismael
June 19, 2015 at 3:53 pm #462003

Linden_Mobile
Participant

Hey,

It looks better, but the header is still to big. The hight show shrink because it is a tablet.

And yes I have a different header for a mobile.

Best regards!

June 21, 2015 at 11:56 am #462322

Ismael
Moderator

Hi!

Please provide a screenshot so that we know what to fix. Use imgur or dropbox.

Best regards,
Ismael
Author

Posts

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.