Parallax in SD 4, how do I make it work?

User 2040390 Photo


Registered User
86 posts

Parallax looks good on other people's sites but will not work for me. Neither the example from the Materialize framework I bought nor Inger's build show more than about 5% differential movement between text and image on my computer using 4 different browsers under "Preview on.." Some of Inger's images get clipped top and bottom. Searching in CoffeeCup's website yields, "Sorry, we couldn't find any articles for you."

"Share your websites" forum has an example by Sergey Losev from last October 19, (http://tayaclass.me/travel.html) where Cyrillic titles scroll neatly down his second image. But this was posted well before version 4 and maybe, even, 3.5.

My website sucks SO bad, I need something to spiff it up.
User 122279 Photo


Senior Advisor
12,676 posts
Online Now

The Russian website you mention does not use Parallax, it uses fixed background images, which is sometimes called 'parallax effect'. Also, it was made with Bootstrap in SD3.0.
The Parallax example I have is based on the Materialize component, and of course I also used the Materialize frame work to build it.

A site with 'parallax effect' is easy to build in any frame work. I could put together a mock-up for you, only I'm a bit under the weather at the moment from an accident last week. Give me some days to recover, then I can do that. You are using Foundation, aren't you?
Ha en riktig god dag!
Inger, Norway
My new honey site, built with RFF: https://eikweb.com/horgenhonning/
Component sharing for RFF, RBB, RSD and SD: https://eikweb.com/sharing/


User 2699991 Photo


Registered User
2,564 posts
Online Now

Stonecherub wrote:
Parallax looks good on other people's sites but will not work for me. Neither the example from the Materialize framework I bought nor Inger's build show more than about 5% differential movement between text and image on my computer using 4 different browsers under "Preview on.." Some of Inger's images get clipped top and bottom. Searching in CoffeeCup's website yields, "Sorry, we couldn't find any articles for you."

"Share your websites" forum has an example by Sergey Losev from last October 19, (http://tayaclass.me/travel.html) where Cyrillic titles scroll neatly down his second image. But this was posted well before version 4 and maybe, even, 3.5.

My website sucks SO bad, I need something to spiff it up.

Hi Stonecherub
A while ago I made a "Parallel Effect" demonstration site for you, with a video showing the effects
I don't have your site url anymore, but whilst Inger is under the weather if you let me know your url, I can take a look and maybe come up with something for you to see.
The Help You Need: When You Need It The Most
User 2040390 Photo


Registered User
86 posts

Wayan: I have that video and will take a look at it. Let's suspend this for a couple of days while Inger recovers.
User 122279 Photo


Senior Advisor
12,676 posts
Online Now

Well, I'm 'over the hump', so I have been messing a bit with something that might interest you. I found the site you have on the S-drive, and since it was in Materialize, I also used that framework. I grabbed a couple of your images to use with it, hoping I have understood what you are after.
Attachments:
Ha en riktig god dag!
Inger, Norway
My new honey site, built with RFF: https://eikweb.com/horgenhonning/
Component sharing for RFF, RBB, RSD and SD: https://eikweb.com/sharing/


User 166871 Photo


Registered User
185 posts

Inger
Are you making this theme available to everyone. In other words can I use it too?
Tom
Vista Tom


User 122279 Photo


Senior Advisor
12,676 posts
Online Now

Tom, be my guest! :) But you need to use other images, then the ones in the theme are not mine.
Ha en riktig god dag!
Inger, Norway
My new honey site, built with RFF: https://eikweb.com/horgenhonning/
Component sharing for RFF, RBB, RSD and SD: https://eikweb.com/sharing/


User 166871 Photo


Registered User
185 posts

Assumed that thanks...for all that you do to make web design easier!
Vista Tom


User 379556 Photo


Registered User
952 posts

Just for fun I tried to use the principles here in SD4 without adding any custom CSS or JavaScript. The result may be of interest, though perhaps others have already done this in a better way.

Firefox wouldn't show the right-hand side of the text box until scrolling occurred, which is why I created the firefox-kickstart layer to create a quick scroll on loading.

Frank
Attachments:

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.