The skeleton component keeps showing after page loaded, however after y scroll and left that section and then turn back it shows the component that should show initially component show some skeletons
Sometimes it show in 2 - 3 - 4 items from an array map with more items but the rest of them shows normally
i tried to search some issues in the library but apparently it only happens to me, lmao
Related
I have a UI which looks like this"
I have tabs on the left and product showcase on the right, in one of the sections of a page. The issue is, I want the default browser scroll to stop when it reaches this section in page until all the tabs are shown one by one. Once all tabs are complete, I want the default window scroll to continue.
Is there any react.js (or javascript/jquery) library for this type of functionality?
In my vuetify app I am using the vuetify virtual scroller for requesting more content as the user scroll down the list. Now, when the user makes a new request I would like to load the new list and make the virtual scroller scroll back to the top.
Currently, the new list is loaded in the virtual scroller but I cannot find a way to scroll back to the top, the scroller stays in the middle of the list. I want my method, which is called whenever a new query is made, to also make the virtual scroller scroll to the top.
What I've tried so far:
Setting the parameters of the virtual scroller, first and last to 0 and 11 (size of what is to be displayed)
Reloading the component with a v-if to reset it.
Looked into the vuetify documentation, nothing seems to be related to my problem.
Thank you for your help.
I have a side bar and a container when i click on any link on side bar the container loads its component and renders its data.
on clicking sidebar links there is an animation happen on side bar which stuck when data being rendered i figured out while rendering all UI stop responding for some milliseconds how to solve these type of problems any help ???
I have tried using React.Memo() to optimize rendering but none work i thought its single threaded issue but dont know how to solve it
See Animation Stuck when data being Rendered
I have a modal dialog where I show 3 fusion charts in it, but only 2 are displayed when the modal opens. To see the 3rd one we have to scroll down. Now I have a print icon and on its click I export all three graphs to create a PDF.
The code is like this (using CoffeeScript):
#primaryChartObject = getChartFromId("fusionChartsInstanceCompareCurrent");
if #primaryChartObject && #primaryChartObject.hasRendered()
#primaryChartObject.exportChart({});
#upstreamChartObject = getChartFromId("fusionChartsInstanceCompareUpstream");
if #upstreamChartObject && #upstreamChartObject.hasRendered()
#upstreamChartObject.exportChart({});
#differenceChartObject = getChartFromId("fusionChartsInstanceCompareDifference");
if #differenceChartObject && #differenceChartObject.hasRendered()
#differenceChartObject.exportChart({});
The charts start exporting, but on the modal dialog, the progress bar is shown only for the visible charts. When I scroll down, the 3rd one's progress bar is shown, but 1st one's is paused. I have to move up and down a couple of times to make sure all the graphs are exported. And then the exported pdf appear properly.
The problem is if user doesn't know about this scrolling, then he/she is never going to get the PDF of the chart. How can this be solved ?
The exporting of the charts, which are not in the viewable portion of the browser naturally does not take place as the Flash charts are not rendered.
I have a page which has like many panels or boxes inside it. left side navigation, world map in the center, 3 small charts below it. When this page is loaded, it loads the data inside the containers in a very haphazard manner, the center world map moves down and up and then loads the map and similarly the 3 charts below. when I click a particular location on the map again the 3 charts below are updated as they should be but thier containers move around up and down when refreshed with new data.
I am using Grails for front end pages and html, with js, jquery with ajax calls on clicks. there are divs with classes used inside html tables to for the containers.
the locations of all components and containers is finally proper, but when anything is refereshed or page is loaded the containers juggle around a lot until the data is loaded..
making the page load animation very distorted.
How do I make all the containers fixed in position even when there is any refresh to a part of the page..
Regards
Priyank
There are 2 ways you might tackle this problem, which you could use in combination:
1) use css to give all the containers a fixed width and height. This way the layout won't jump around as the content loads.
2) hide the contents of the containers, and only show them after everything has loaded. You could have each ajax call set a flag when it completes and then check to see if all the other flags are set. If so, unhide all the content.