{"action":"created","issue":{"url":"https://api.github.com/repos/metafizzy/isotope/issues/1201","repository_url":"https://api.github.com/repos/metafizzy/isotope","labels_url":"https://api.github.com/repos/metafizzy/isotope/issues/1201/labels{/name}","comments_url":"https://api.github.com/repos/metafizzy/isotope/issues/1201/comments","events_url":"https://api.github.com/repos/metafizzy/isotope/issues/1201/events","html_url":"https://github.com/metafizzy/isotope/issues/1201","id":194926090,"number":1201,"title":"Isotop overlaps when resizing browser from full width to small( around 420px) width","user":{"login":"vishy93","id":9990517,"avatar_url":"https://avatars.githubusercontent.com/u/9990517?v=3","gravatar_id":"","url":"https://api.github.com/users/vishy93","html_url":"https://github.com/vishy93","followers_url":"https://api.github.com/users/vishy93/followers","following_url":"https://api.github.com/users/vishy93/following{/other_user}","gists_url":"https://api.github.com/users/vishy93/gists{/gist_id}","starred_url":"https://api.github.com/users/vishy93/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/vishy93/subscriptions","organizations_url":"https://api.github.com/users/vishy93/orgs","repos_url":"https://api.github.com/users/vishy93/repos","events_url":"https://api.github.com/users/vishy93/events{/privacy}","received_events_url":"https://api.github.com/users/vishy93/received_events","type":"User","site_admin":false},"labels":[{"id":98021,"url":"https://api.github.com/repos/metafizzy/isotope/labels/support%20request","name":"support request","color":"ededed","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":2,"created_at":"2016-12-12T09:28:30Z","updated_at":"2017-01-03T17:09:56Z","closed_at":null,"body":"Hi Guys,\r\n\r\nI have a strange issue: I am using isotope in my bootstrap based theme. Now, it works fantastic for all other sizes. But, when I go from either md view or even lg down to xs view via browser resize the isotope items are overlapping. Only in this situtation it happens. Going from and between any other sizes works well. On normal page load works well across all sizes. \r\n\r\nNow, I am aware unloaded images can throw off Isotope layouts and cause item elements to overlap. But, on browser resize the images will already be loaded. Nonetheless, I tried:\r\n\r\n`$container.imagesLoaded().progress( function() {\r\n  $container.isotope('layout');`\r\n\r\nResulting in the error:\r\n\r\nUncaught TypeError: $container.imagesLoaded is not a function\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/metafizzy/isotope/issues/comments/270166381","html_url":"https://github.com/metafizzy/isotope/issues/1201#issuecomment-270166381","issue_url":"https://api.github.com/repos/metafizzy/isotope/issues/1201","id":270166381,"user":{"login":"vishy93","id":9990517,"avatar_url":"https://avatars.githubusercontent.com/u/9990517?v=3","gravatar_id":"","url":"https://api.github.com/users/vishy93","html_url":"https://github.com/vishy93","followers_url":"https://api.github.com/users/vishy93/followers","following_url":"https://api.github.com/users/vishy93/following{/other_user}","gists_url":"https://api.github.com/users/vishy93/gists{/gist_id}","starred_url":"https://api.github.com/users/vishy93/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/vishy93/subscriptions","organizations_url":"https://api.github.com/users/vishy93/orgs","repos_url":"https://api.github.com/users/vishy93/repos","events_url":"https://api.github.com/users/vishy93/events{/privacy}","received_events_url":"https://api.github.com/users/vishy93/received_events","type":"User","site_admin":false},"created_at":"2017-01-03T17:09:56Z","updated_at":"2017-01-03T17:09:56Z","body":"Sorry about the late reply. I loaded imagesLoaded and followed the code example on your site for overlapping images fix. But, it did not do the trick. \r\n\r\nThis is my current code for isotope isolation:\r\n` var $container = $('.grid-items');\r\n        $container.isotope({\r\n            filter: '*',\r\n\t\t\tpercentPosition: true,\r\n            animationOptions: {\r\n                duration: 350,\r\n                easing: 'linear',\r\n                queue: false\r\n            }\r\n        });\r\n        \r\n        $('.cat a').click(function() {\r\n            $('.cat .active').removeClass('active');\r\n            $(this).addClass('active');\r\n            var selector = $(this).attr('data-filter');\r\n\t\t\t$(\"#TechFilter\").val(selector);\r\n            $container.isotope({\r\n                filter: selector,\r\n                animationOptions: {\r\n                    duration: 350,\r\n                    easing: 'linear',\r\n                    queue: false\r\n                }\r\n            });\r\n            return false;\r\n        });`\r\n\r\nWeirdly, the overlapping only occurs when I resize from either md view or even lg down to xs view. In bootstrap terms. When I refresh or resize again there is no overlapping."}}
{"actor":{"display_login":"vishy93"}}