Hi, I have a question about the scroll scene, I’d like to change the image background in a pinned DIV during scrolling, is possible?
Thanks
Chris
Ok, I’m a stupid (path issue) now “background-image:” work fine, but there is a terrible blank-blink frame between every frame. Can anybody help me?
This issue happens in both case (set or tween)
Thanks
Hi @c_sassano welcome to the forum.
If I’m not mistaking what you are saying, you have a section (pinned DIV) with a CSS background-image, when scrolled you wish to swap that reference to other background images? You mention a ‘blink’ do you mean there is a blink/gap/flicker/delay when the new image(s) are loading as its being swapped out for a new ones?
If so then its probably due to the images not being preloaded and already available when called. I don’t think Pinegrow Interactions has a direct gui setting for preloading in such cases, I would guess not. So you would need to handle that yourself through various methods and approaches. You can search to find discussions about various approaches to handle that across the web and should be able to find something relative to your setup and criteria that would help you.
But its hard to fully grasp your setup and situation so perhaps I’ve entirely mistaken what you have described and maybe what I’ve mentioned in not your issue. 
Along this topic, I’ve created my first scrolling/scene-change website (I don’t know what else to call this) as a template for future development. But since this my first attempt, which I built by grabbing tidbits here and there from various website and trying to re-assemble them into a working model (Frankenstein style), I’m wondering if I created a monster or a child of beauty. Since I want this template to be a near-perfect coded sample for future use would someone in this forum take a few minutes to review my efforts at “https://rjrwebz.com/outdoorsy” and let me know if “monster” or “beauty” is your verdict. Any/all suggestions for improvement are absolutely welcomed.
Otherwise, I hope all are safe, healthy and still following this forum.
Basically I would call it “Parallax Scrolling”.
Known issue since years is difficult behaviour of fixed-positioned elements on mobile devices.
Good news is: The fixed elements simply behave as divs, so no weird things happen - they simply scroll with the entire body.
Monster or beauty?
Parallax is nothing special and nothing new - perhaps even a bit old fashioned (kind of).
Additional infos:
Some inspirations on Scroll effects:
Cheers
Thomas
1 Like
@randyrie & @Thomas, those used terms are relative to the Pinegrow Interactions Plugin. So I’m not sure that its basic parallax which was being discussed in this thread.
With basic parallax you generally would not encounter the blink issue that was mentioned.
But again I could be mistaken since @c_sassano never responded further.
@Pinegrow_User , apologise - you’re basically right. I answered exclusively to @randyrie and his page example (which hasn’t got much to do with the OPs problems). My mistake.
Cheers
Thomas
@c_sassano
Just a thought… did you try reducing the file size of your images so they load faster? I had a similar issue which was resolved when I downsized the resolution of my images… even though I wasn’t using PG’s Interactions.
@Thomas
Yeah… I like the term “Parallax Scrolling”… I know this web effect has been around for awhile but this is my first attempt at using it on one of my sites and am wondering if I’m coding this correctly and efficiently? I do like this effect (“Parallax Scrolling”) and also LOVE the wild ride effect of the ‘Travelshift’ site you suggested in your post (did you build that site?). Someday, when I’ve nothing else to do, I’m going to try and create this effect on one of my websites. 
If an image src is being swapped dynamically and not yet cached then image size would not really guarantee removing the discussed blink upon replacing. Of course a 10k image would load faster than a 10mb image but there would still be a blink regardless, unless all relative images pre-loaded/cached. Another option would be stacking and swapping z-index so all images would be loaded and just cycled through when scrolled. Many other approaches could also be facilitated as well through code.
No worries @Thomas, we may never hear back from the OP to fully understand.