Scrolling Problem in iPhone

HTML & CSS
1

Hello,

This is my development site: martcol.co.uk/karban it’s a redesign for brightontherapyservice.co.uk and some of the links in the dev site still point there.

The problem is that when I scroll on my iPhone it’s a bit clunky but the worse thing is that the page flashes White as you scroll. I think it settles down after a while but it is quite off-putting. My iPhone is and iPhone 4 and I mostly use Chrome. It doesn’t happen on the iPad 2 or the iPad Mini.

Thanks

Martin

[I’ll confess I suspect this might not be the right place to ask this question so, happy for a Moderator to move it if not appropriate.]

2

Hi there,


.splashitem a {
    display: block;
}
/* Touch events on, from modernizr*/
.touch div.splashitem {
    -webkit-transition: none;
    transition: none;
}
.touch div.splashitem:hover,
.touch div.splashitem:active {
    -webkit-transform: none;
    transform: none;
    box-shadow: none;
}

Copy paste the code above, the image become white because you have some touch/active events on the images and we want to reset this on touch, because some users will scroll using the middle of the screen and there are located the images.

Online demo: http://mironc.com/freelancer/martcol_index.html

Hope that this solves your problem, for me it doesnt replicate it anymore !

3

Thank you for looking at this. I might not get to it for a day or so, but as soon as I can I will try it out

Thanks again

Martin

4

Ok, no problem

5

@mironcatalin That fixed it for me and I am very grateful. I confess that I was a bit dubious at first after convincing myself that my phone was the problem (trying to convince my wife that it’s time to upgrade to a 5s). But you have helped me with the difficulty but at the same time, made it harder argue for the upgrade!

Thanks