Question:
I would like to create a dynamic page that automatically loads a new page defined in the CMS at the bottom of the page.
I would like to have the effect you see on this page:
Is there a way to realise this in Wix Studio?
The support says NO, if then only with code.
I have tried it and unfortunately could not achieve any result.
What I want exactly is the following:
The first and the last section of the dynamic page should each have 100% vh and when I scroll down to the bottom of the page, a further page defined in the CMS should be loaded by a kind of trigger.
The last section of the first page should be visually and content-wise identical to the first section of the second page.
As a result, no page change is noticeable and there is an endless scroll through the pages.
Does anyone have an idea if and how this could be realised?
Many thanks
+
Greetings from Vienna, Tomas
The Infinity website is very impressive. I can see having part of a website using the endless scrolling feature being attractive. For me, the scrolling became tiresome.
I am sorry I cannot supply a fix for you. I am only giving you my opinion as a retired website designer from the early days before Google. It was a time of dial up broadband when almost any website that had more than text would be a pain to load. The feature you are wanting may be a drain on computer resources for some viewers.
I have seen a site template on WIX where it has elements that slide up or down as the page is scrolled. It might be possible to modify that feature.
Thank you for your reply. I was recently able to solve the problem thanks to WIX IDE with AI!
This is the code and it works really well…
import wixData from 'wix-data';
import wixLocation from 'wix-location';
$w.onReady(function () {
$w('#trigger').onViewportEnter(handleObjectEnter);
async function handleObjectEnter() {
// Fetch the current item of the dynamic page
const currentItem = $w('#dynamicDataset').getCurrentItem();
// Fetch the URL from the CMS
const results = await wixData.query('projects')
.eq('_id', currentItem._id)
.find();
// Check if a result was found
if(results.items.length 0) {
const url = results.items[0].nextUrl;
// Navigate to the URL after a delay of 1 second
setTimeout(() = {
wixLocation.to(url);
}, 1000);
}
}
});
I am sure the code will be useful to others, i never managed to be proficient, although I could read code and see errors. But that was 10 years ago.
I am pleased you managed to solve the problem. Since your reply AI is where I remember seeing some sliding effects in a few of the AI I tried before settling on the website I am building at the moment.
You seem to know more about WIX than I do. I would appreciate, if you have time, having a look at my problem.