Red Bag

I tried using UIKit's "uk-scrollspy-nav" to control the staggered cards. It successfully scrolls to the respective sections, but when clicking the Section 1 menu to scroll back to Section 1, Section 2 will overlap Section 1. Anyway to add the navigation menu to control the staggered cards?

Thanks for your help~

https://codepen.io/redbad/pen/YzZRYvd the number 248 and 64 without decimal and comma, the animated not workable

Great, that's what i need. But i found out if the number without decimal or comma, the counting animated was not workable.

Do i still need to edit the code after to insert the above code? https://codepen.io/redbad/pen/YzZRYvd I'm trying to do the counting by on scroll but it's seem to scroll once to trigger the animation, how to let it to animated again when scroll to each number?

How to include comma and decimal?

Sorry as I english not good to explained what i mean. Anyway, thanks for your help.

That's great, but if the number without decimals or some of number we wish not to have more than 1 decimals, how can we hide it ?

Sorry Jack, I found out when the number had " , " (comma), the horizontal scroll will broken and the below code will change the comma to dot. onUpdate() { count.innerText = parseFloat(count.innerText).toFixed(2); } https://codepen.io/redbad/pen/MWJPxgO

Thanks a lot~

How to display running number (having zero in decimals) as now the code not able detect the zero. example: 1.60 and the code only able to display 1.6 https://codepen.io/redbad/pen/poRxgLo

Yes, the codepen not show the issue? or you can refer this link http://novafusion.asia/development/tm/test.html Here is my codepen demo same with the above link. https://codepen.io/redbad/pen/gOgXKdJ If CSS issue, i can't set the overflow: hidden for whole container because it will affect the horizontal scrolling.

Thanks for your reply. I did do a demo in codepen, but it can't view the problem what i ask. Perhaps you can refer this (https://cdpn.io/redbad/debug/gOgXKdJ/yokZEpDeVzmA) to view the problem when scroll horizontally from start to end, the website not fit to the browser. The problem was just happen in Google Chrome and Safari. As you still not understand, here's the reference, when scroll till the end, it's seem still can scroll over to see the white space. https://codepen.io/redbad/full/gOgXKdJ

Hi, As an example : https://www.manuport-logistics.com/en we have checked and this website is not fixing a width for those section, however, the content still able to display nicely in frontend. But for our project, the content will distorted if we do so. Besides, we come across another issue in Google Chrome , when we try to scroll horizontally from start to end by using mouse, the screen will be abit jumpy. You may please refer to attached sample site : http://novafusion.asia/development/tm/test.html This issue happen in Google Chrome and Safari only. Firefox seems fine. Appreciate if you can advice on above issues. Thank You

Hi, I facing a problem, due to the number's length, the counter number animation in slider become not stable and seems like "vibrating". Any solution ? https://codepen.io/redbad/pen/xxRYOBr