{"action":"closed","issue":{"url":"https://api.github.com/repos/metafizzy/isotope/issues/944","repository_url":"https://api.github.com/repos/metafizzy/isotope","labels_url":"https://api.github.com/repos/metafizzy/isotope/issues/944/labels{/name}","comments_url":"https://api.github.com/repos/metafizzy/isotope/issues/944/comments","events_url":"https://api.github.com/repos/metafizzy/isotope/issues/944/events","html_url":"https://github.com/metafizzy/isotope/issues/944","id":91480230,"number":944,"title":"Start reveal animation when in viewport","user":{"login":"joshuaiz","id":1096738,"avatar_url":"https://avatars.githubusercontent.com/u/1096738?v=3","gravatar_id":"","url":"https://api.github.com/users/joshuaiz","html_url":"https://github.com/joshuaiz","followers_url":"https://api.github.com/users/joshuaiz/followers","following_url":"https://api.github.com/users/joshuaiz/following{/other_user}","gists_url":"https://api.github.com/users/joshuaiz/gists{/gist_id}","starred_url":"https://api.github.com/users/joshuaiz/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/joshuaiz/subscriptions","organizations_url":"https://api.github.com/users/joshuaiz/orgs","repos_url":"https://api.github.com/users/joshuaiz/repos","events_url":"https://api.github.com/users/joshuaiz/events{/privacy}","received_events_url":"https://api.github.com/users/joshuaiz/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/metafizzy/isotope/labels/How%20do%20I","name":"How do I","color":"ededed"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":0,"created_at":"2015-06-27T15:04:32Z","updated_at":"2016-06-17T18:40:23Z","closed_at":"2016-06-17T18:40:23Z","body":"I'm trying to have the reveal animation start once the isotope container is visible in the viewport (i.e. the page has been scrolled down to the container).\r\n\r\nMy isotope elements are not images so I tried using LazyLoad any: https://github.com/emn178/jquery-lazyload-any as well as .visible (https://github.com/customd/jquery-visible) or :in-viewport (https://github.com/zeusdeux/isInViewport).\r\n\r\nAny of those either break the layout completely, disable the reveal animation completely or don't work at all.\r\n\r\nThe isotope elements are hidden with css and then I'm using `reveal` to show them but I want to trigger that when the isotope container is in the viewport.\r\n\r\nHere is the code I'm using (with :in-viewport which doesn't delay the reveal animation):\r\n\r\n    jQuery(document).ready(function($){\r\n\t\r\n\tvar $container = $('.latest').isotope({\r\n\t\titemSelector: '.latest-li',\r\n      // options\r\n      getSortData: {\r\n      date: function ($elem) {\r\n        var dateStr = $('.latest-li').find('.latest-date').text(),\r\n            dateArray = dateStr.split('/'),\r\n            year = dateArray[2],\r\n            month = dateArray[0],\r\n            day = dateArray[1];\r\n        return new Date(year, month, day);\r\n   \t\t }\r\n\t},\r\n\tsortBy : 'date',\r\n\t  columnWidth: 341,\r\n\t  gutter: '16',\r\n\t  layoutMode: 'masonry',\r\n\t});\r\n\t// Animate on load\r\n\tvar iso = $container.data('isotope');\r\n\tvar $div = $( '.latest' );\r\n      if ( $div.is( ':in-viewport' ) ) {\r\n\t$container.isotope( 'reveal', iso.items );\r\n      }\r\n    });\r\n\r\nAny ideas on how to do this?\r\n\r\nThanks!"}}
{"actor":{"display_login":"desandro"}}