{"action":"created","issue":{"url":"https://api.github.com/repos/dazld/react-on-visible/issues/26","repository_url":"https://api.github.com/repos/dazld/react-on-visible","labels_url":"https://api.github.com/repos/dazld/react-on-visible/issues/26/labels{/name}","comments_url":"https://api.github.com/repos/dazld/react-on-visible/issues/26/comments","events_url":"https://api.github.com/repos/dazld/react-on-visible/issues/26/events","html_url":"https://github.com/dazld/react-on-visible/issues/26","id":346215495,"node_id":"MDU6SXNzdWUzNDYyMTU0OTU=","number":26,"title":"Trigger event on scroll another dom element (not window)","user":{"login":"gWarrior","id":6149833,"node_id":"MDQ6VXNlcjYxNDk4MzM=","avatar_url":"https://avatars0.githubusercontent.com/u/6149833?v=4","gravatar_id":"","url":"https://api.github.com/users/gWarrior","html_url":"https://github.com/gWarrior","followers_url":"https://api.github.com/users/gWarrior/followers","following_url":"https://api.github.com/users/gWarrior/following{/other_user}","gists_url":"https://api.github.com/users/gWarrior/gists{/gist_id}","starred_url":"https://api.github.com/users/gWarrior/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/gWarrior/subscriptions","organizations_url":"https://api.github.com/users/gWarrior/orgs","repos_url":"https://api.github.com/users/gWarrior/repos","events_url":"https://api.github.com/users/gWarrior/events{/privacy}","received_events_url":"https://api.github.com/users/gWarrior/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":2,"created_at":"2018-07-31T14:33:28Z","updated_at":"2018-08-03T16:22:18Z","closed_at":null,"author_association":"NONE","body":"I have div element. It contain chields data (messages in chat block). If I scroll this block, onVisible not trigger. Can you add this functional?"},"comment":{"url":"https://api.github.com/repos/dazld/react-on-visible/issues/comments/410304852","html_url":"https://github.com/dazld/react-on-visible/issues/26#issuecomment-410304852","issue_url":"https://api.github.com/repos/dazld/react-on-visible/issues/26","id":410304852,"node_id":"MDEyOklzc3VlQ29tbWVudDQxMDMwNDg1Mg==","user":{"login":"gWarrior","id":6149833,"node_id":"MDQ6VXNlcjYxNDk4MzM=","avatar_url":"https://avatars0.githubusercontent.com/u/6149833?v=4","gravatar_id":"","url":"https://api.github.com/users/gWarrior","html_url":"https://github.com/gWarrior","followers_url":"https://api.github.com/users/gWarrior/followers","following_url":"https://api.github.com/users/gWarrior/following{/other_user}","gists_url":"https://api.github.com/users/gWarrior/gists{/gist_id}","starred_url":"https://api.github.com/users/gWarrior/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/gWarrior/subscriptions","organizations_url":"https://api.github.com/users/gWarrior/orgs","repos_url":"https://api.github.com/users/gWarrior/repos","events_url":"https://api.github.com/users/gWarrior/events{/privacy}","received_events_url":"https://api.github.com/users/gWarrior/received_events","type":"User","site_admin":false},"created_at":"2018-08-03T16:22:18Z","updated_at":"2018-08-03T16:22:18Z","author_association":"NONE","body":"for parent branch i wrote this logic (onScroll method):\r\n\r\n```\r\n    let parent = this.props.parentRef;\r\n    let parentBox = parent.getBoundingClientRect()\r\n\r\n    const child = this.holder.getBoundingClientRect();\r\n    const visbleTriggerRatio = (this.props.percent && this.props.percent / 100) || 0.5;\r\n\r\n    const top = child.top + (child.height * visbleTriggerRatio);\r\n    const bottom = child.bottom - (child.height * visbleTriggerRatio);\r\n\r\n    const isVisible = (bottom >= parentBox.top && bottom <= parentBox.bottom) && (top <= \r\n    parentBox.bottom && top >= parentBox.top);\r\n```\r\nperent - ref of component, from props \r\n\r\nin _componentDidMount_\r\n\r\n```\r\n   if (this.props.parentRef != null) {\r\n      this.props.parentRef.addEventListener('scroll', this.onScroll);\r\n    } else {\r\n      window.addEventListener('scroll', this.onScroll);\r\n    }\r\n```\r\nmaybe it will help you"}}
{"actor":{"display_login":"gWarrior"}}