Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not all tiles are loading on small window sizes #227

Open
Hyperchema opened this issue May 18, 2016 · 0 comments
Open

Not all tiles are loading on small window sizes #227

Hyperchema opened this issue May 18, 2016 · 0 comments

Comments

@Hyperchema
Copy link

Hyperchema commented May 18, 2016

I just got freewall up and running on my new website and it's working great if the first page load is at a large screen size (1024 or higher). However, if I start with a small viewport width and refresh the page, only the first 3 of my tiles appear. Even after expanding the window, still many of them are missing. If I load the page at a large viewport and shrink it down, all tiles load and stay visible down to the smallest screen size. I am very confused why this is happening. I thought it was simply a CSS thing but then the tiles that load should disappear after the viewport is shrunk down. The problem is only on the initial load. Here is the JS I'm using in my file. Other than that it's just the base freewall.js file. I haven't made any changes to it. Let me know if you have an idea why it's doing this. Thanks!

            var wall = new Freewall('#freewall');
            var start = new Date().getTime();
              wall.reset({
                selector: '.home-tile',
                animate: true,
                gutterX: 15,
                gutterY: 15,
                cellW: 125,
                cellH: 125,
                onResize: function() {
                    wall.fitWidth();
                },
                onComplete: function() {
                    console.log("Showup", new Date().getTime() - start);
                }
            });

            wall.addCustomEvent("onGridReady", function(container, setting) {
                start = new Date().getTime();
            });

            wall.addCustomEvent("onGridArrange", function(container, setting) {
                console.log("Arrange", new Date().getTime() - start);
                start = new Date().getTime();
            });

            var images = wall.container.find('.home-tile');
            images.find('img').load(function() {
                wall.fitWidth();
            });
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant