-
AuthorPosts
-
September 19, 2017 at 10:51 am #853787
Hi
Is there a way yet to do true Parallex on iOS similar to the way Apple does?
https://www.apple.com/macos/high-sierra/Works and looks awesome to me.
Regards
ChrisSeptember 21, 2017 at 2:04 pm #854858Hey Chris,
Yep, that’s great parallax effect. Ours is not as fancy but is good enough, so the answer would be no, unfortunately not like that. Have you tired our parallax sections?
Best regards,
VictoriaSeptember 21, 2017 at 2:18 pm #854870Hi
Thanks for getting back to me.
Yes I often use the enfold parallax on sites but I was hoping that now Apple are doing it on mobiles, Kriese might have sorted it out to or look into it.
Looking at Apple’s though, although it acts similar to your Parallax it’s not. It’s a Hero Animation, css?
I was hoping for a quick, easy way to make it work on mobile devices.Thanks anyway.
Kindest regards
ChrisSeptember 23, 2017 at 10:46 am #855764Hi Chris,
Well, there is not a “quick, easy way to make it work on mobile devices”, but we do adjust things for some of our customers to work on mobile, on a case by case basis.
Best regards,
VictoriaSeptember 23, 2017 at 3:21 pm #855808apple does it the easy way :lol. they have two images and the sharp one above increases its opacity by scrolling !
September 23, 2017 at 3:23 pm #855809It’s so much that, it’s the fact that it looks like parallax, with the type moving.
September 23, 2017 at 5:21 pm #855826my solution here: https://webers-testseite.de/blur-on-scroll/
- This reply was modified 7 years, 2 months ago by Guenni007.
September 23, 2017 at 7:44 pm #855878Hi Chris,
Well, you can hire Guenni007 to do it for you :)
@Guenni007 Nice implementation, but like you said, it’s not really parallax.Best regards,
VictoriaSeptember 23, 2017 at 7:48 pm #855883yes – like the sierra site too ! see source code . i tried to reproduce this.
September 23, 2017 at 7:55 pm #855886by the way – if you know a way how to select a background-image we can do that with parallax –
Edit : Oh i see that on parallax case the background-image goes to a new container!! then it is easier to do:
But parallax is always a bit buggy. on safarie it is not a smooth scroll
best is chrome and firefoxhttps://webers-testseite.de/parallax-on-scroll/
- This reply was modified 7 years, 2 months ago by Guenni007.
September 24, 2017 at 7:45 am #855973September 24, 2017 at 8:32 am #855993sharing on demand – i will wait with the solution description – last few weeks i recognized that a lot of participants have their requests – but no interest of looking what happend in it.
September 24, 2017 at 9:49 am #856003Hi Good Morning.
My question was
“Is there a way yet to do true Parallex on iOS similar to the way Apple does?
https://www.apple.com/macos/high-sierra/”Although guenn1007 has produced a very nice parallax style effect, even with the blur, which is not what I was talking about, it still doesn’t work on mobile.
Client asked me if it could be done like Apple have, I said everything can be done but it costs, I said I would check it out for him. I’ve found someone who said they can do it for $40? I’ll see what the client says beginning of next week and get back to you.
Kindest Regards
Chris
Many Thanks for all the input, nice having someone to talk to about these things and very nice work guenn1007.September 24, 2017 at 11:09 am #856014This is no parallax on apple site. They have to background-images above each other. One is blured the other is sharp.
on Scroll the addClass to the sharp one and change on that way the opacity ! (from 0.9999 to 0.0001) thats all – no parallax effect at all.September 24, 2017 at 11:23 am #856019Hi
The effect you’ve manage to get looks brilliant, what I was saying is that the lettering says stuck on a mobile. It doesn’t have the parallax effect like Apple as on mobile. It’s a animation of sorts I guess.Kindest Regards
ChrisSeptember 24, 2017 at 11:53 am #856023this is like apple does: but a bit more simpler:
https://webers-testseite.de/apple-blur
if you see the source code – it is the same transition as apple does – and on scroll there is a class added called active.
On that class the opacity is ruled with a transition effect.Parallax is if scroll position of background-image and foreground is not the same. The effect causes an impression of virtual room.
September 24, 2017 at 11:56 am #856024Hi sorry background not showing and my apologies, I’m not sure what you mean?
September 24, 2017 at 3:31 pm #856054delete the browser cache – on ipad/iphone this is a very obstinately thing – i can see the background on ipad and Safari 11/Sierra
- This reply was modified 7 years, 2 months ago by Guenni007.
September 25, 2017 at 10:45 am #856411Hi Good morning.
I downloaded Firefox on the mobile and I can see it now.
It looks great on a desktop and I see works correctly on a mobile.
There’s a bit of flickering and a white border on the left and the timing could do with adjusting but I think you’ve done a fantastic job.
What would it cost me to use this?Kindest Regards
ChrisSeptember 26, 2017 at 3:11 pm #856962first of all – i looked to it via ipad and iphone via guess safari mobile version – and i can see background. So please goto Settings / Safari / and erase the cache.
costs : What is worth it to you – if you think it is for less than it is ok for me too.
but if you want to reward the work – you fix the price.i believe that the version comes nearest to apple did: https://webers-testseite.de/apple-blur/
by the way the flickering comes not from my code.
Go and have a color-section alb element with background image set to parallax.
You will have that flicker too. Those mobile browserversions – with touch screens always are not able to handle it good!September 26, 2017 at 7:55 pm #857109Hi there
Looks great, on mobile too, still see the white on the left though, see pic h/w. http://www.chrisplace.uk/White-on-Left.jpg
Early in this thread I wrote this.“Client asked me if it could be done like Apple have, I said everything can be done but it costs, I said I would check it out for him. I’ve found someone who said they can do it for $40? I’ll see what the client says beginning of next week and get back to you.”
So what would you charge me to implement this on the site.
P.S. how did you get an image on here?
Regards
ChrisSeptember 26, 2017 at 9:25 pm #857145ok forgotton the .responsive class to set for the first container with the backgroundimages.
Empty your browser cache and have a look
don’t be to cheap to your customer – it is a lot of work to do – so go an get more for you
by the way: i have added a timer function that the scroll event don’t fires steadily.
but i will have a look if it is not best to implement the throttle function to enfold -
AuthorPosts
- You must be logged in to reply to this topic.