sorry, lol. I thought I broke Glide for sure. 
Ok, I made a new container and re-entered the css. Looks like this:
It’s lining up the way we expect now.
Is there a way to increase the image size?
#main-root:has(.slide-Show).gp-xl.gp-xl.gp-xl.gp-xl .threeColumns:not(.pages-component-renderer.threeColumns) {
grid-template-columns: 2fr 4fr 2fr;
}
1 Like
this is great
@Himaladin the text overlay shows up on my other collections too. Can I just have them on the slide Show?
1 Like
Been trying to follow along, but not very closely. @Himaladin you tagged me for ideas on speeding up some javascript and @Sekayi_Liburd you sent me a private message regarding the same. I wasn’t sure if you were still looking for an answer from me or if you moved on to a different solution. Just wanted to double check before I try to see if I can find a solution.
1 Like
Still an unsolved problem Jeff.
Do you have an idea?
Ok. I have an idea. It’s similar to something I’ve done in the past for an unrelated project and had somewhat successful results.
Off the top of my head I’m thinking maybe something that involves two javascript columns.
- One that is triggered by the current time (so every 10 seconds it should run). All it would do is return a random value, such as a random number or GUID. However this javascript column would also include a 5 second sleep timer that will cause it to wait 5 seconds before it returns anything.
- When the return value changes, then it’s passed to a second javascript column as a trigger parameter. The second javascript column is the one that returns the counter number. In addition to the limit parameter and the current time parameter, it includes the random value from the first javascript column as a parameter.
The result should be that the final javascript runs every 5 seconds instead of 10.
So just to help me understand the javascript below, is the purpose to get unix time in milliseconds, divide by 10000 to effectively get a number that updates every 10 seconds, and then get the divisible remainder based on the limit?
Looks like on its own it only changes every 10 seconds, so I think I would change from 10000 to 5000 so it can change every 5 seconds.
let limit = p2;
let currentCounter = Math.floor((new Date().getTime() / 10000) % limit) + 1;
return currentCounter;
Unless someone else wants to take a crack at this, I’ll try it myself sometime tonight when I’m done with work.
(Writing this out, it almost seems feasible to create some sort of timer in glide that actually does update every second. It would probably require 10 columns at least, but seems like it could be possible.)
2 Likes
Hi @Jeff_Hager , I would like it to change every 5 seconds. 10 seconds is very long for my use case.
Is it possible to restrict the text overlays to only the header?
Oh… sorry, I missed your question.
You add the class name to the collection component again, for example: slide-card. Then change #main-root:has(.slide-Show) to .slide-card.
“Only regarding text-related code, not all code. Some of the code I provide works in containers, so don’t get confused again.”
1 Like
ok, thanks so much!
1 Like
I have tried this part before. Actually, the update time for Glide on the device I tested is around 7 seconds. When using the formula “currentCounter” divided by 10000, the counter number will count it stably. However, if it is changed to 5000, some numbers will be skipped in a few frames. Maybe using 7000 could work.
The idea of using additional columns may be a solution-oriented and manipulative idea, but I cannot imagine how to do it, while waiting for your brilliant idea.
2 Likes
I have another idea, which is to create an auto-slide carousel for the collection, which might move quickly. But I’m too lazy to delve into its CSS. 
1 Like
I wore you out this weekend. Sorry 
1 Like
No problem. Through our discussion, I have materials for exploration. I will try it in my spare time.
1 Like
If you want to see how it’s working, you can view the app here: https://hiptnt.glide.page
I’m not sure why the edge to edge image layout isn’t happening on the mobile view of the published app but I won’t fuss about it, lol.
As a temporary workaround for the slow image change speed, I’m using gifs that combine 2 images and switches them at the 5-second mark. Just for the sake of viewer interest.
OK, so here’s what I got.
There are two javascript columns:
- The first one is the javascript column with the 5 second delay. It is triggered by the current time. It waits 5 seconds (actually 4.5 seconds so it can finish before the next cycle runs) and then returns a unix time as the “random” value that is passed into the second column.
Current Time is pass as a parameter, but it is not used in the actual code. It is only there to be a trigger to force the javascript to run.
function resolveAfternSeconds() {
return new Promise(resolve => {
setTimeout(() => {
resolve(new Date().getTime());
}, 4500);
});
}
return await resolveAfternSeconds();
- This is the second column with @Himaladin’s javascript. Currently I have 10000 changed to 5000. Otherwise the math would only allow the value to change every 10 seconds regardless of how often the javascript runs. This change seems to allow it to update every 5 seconds instead. @Himaladin I understand what you are saying about the possibility of it skipping numbers. I’m still trying to determine if that is the case or not (haven’t put a lot of thought into the math that is happening). Would you maybe have an example of a Limit value where this could possibly be the case?
Limit is a parameter for obvious reasons. Current Time and the value from the previous javascript column are passed as parameters, but again, then are not used in the actual code. They are only there to be a trigger to force the javascript to run. Current Time changes every 10 seconds, and TriggerWithDelay also changes every 10 seconds, but with a 5 second offset.
let limit = p1;
let currentCounter = Math.floor((new Date().getTime() / 5000) % limit) + 1;
return currentCounter;
Give it a shot and see if it works. If not, let me know.
4 Likes
That’s really great @Jeff_Hager, it’s much faster now, maybe I didn’t really understand your explanation (the translator is not very reliable). 
What happens if we use more than 3 columns, is it possible for the counter to update every second?
What’s weird is if I change 5000 to 1000, then what happens is a countdown. I really hope you can make a countdown timer that issue has not been resolved yet.
1 Like
genius! you guys are so good!
Works like a charm @Jeff_Hager @Himaladin 
2 Likes
Have you tried it yet? The result is twice as fast.
1 Like