I want give Timeline this refer Scrollbars of Group name CGI.
By that not about Scrollbars main of Browser.
Help look Code give I bit.
var navbar1 = hypeDocument.getElementById( 'navbar1');
navbar1.style.position = "fixed"; // fixed position for Navbar group
window.addEventListener('scroll', function (e) {
hypeDocument.goToTimeInTimelineNamed(scrollY * 0.01, 'SC_LINE')
});
Please post an example of your "Scrollbars of Group" Hype project here for the Forum to see - like You did for your question about "Parallax work normally.YY"
You could try to also post along with the english your native language .
Someone on the forum may speak both and have a better understanding of english and be able to give us a better idea of what you want to do .
Here is the file that @book.ratthanan provide above, I include it here again for convenience: Sc_mh.hype.zip (94.2 KB)
I think the issue is that no scroll bars are appearing on the main group "CGI" (even though specified) and the scroll bar is needed to run a timeline.
There is a function "scrollto" in the project that matches this set-up:
navbar2.style.position = "fixed"; // fixed position for Navbar group
window.addEventListener('scrollto.onscroll', function (e) = {
hypeDocument.goToTimeInTimelineNamed(scrollY * 0.01, 'scroll')
});
The timeline named "Scroll" (uppercase "S") that drops down a rectangle named "Bar" (potential menu?).
============================================
Additional Edit:
@book.ratthanan you wish the "CGI" group to scroll separately from the rest of the page - is this right?
If so the "scrollY" in your "scrollto" function will not work. "scrollY" is used in reference to the browser window so scrolling the "CGI" group will not register any change in "scrollY".
You will need to use something different - maybe use a "scrollTop" calculation for the "CGI" group scrolling, so as the group scrolls you need to continually calculate the distance from the top of the"CGI" and control the timeline accordingly.
@book.ratthanan You seem to also be asking another question which has shown up in another post as well:
The “File” group now has scrollbars, and scrolling this group animates the “Bar” element to slide down.
This “File” group now has a class name of “noHorizScrollBar” which is used in a bit of CSS inserted into the “Head HTML” to get rid of the horizontal scrollbar that otherwise would appear on the “File” group:
I’ve moved the (nav?) “Bar” outside of the “File” group so it does not need to be sticky - nor could I get it to be sticky inside the “File” group (which is why I moved it outside ).
I found the below “scrollTop” code created just for us by @MarkHunte in this post.
@MarkHunte’s adapted code is used in the function “animateMenu” replacing “scrollto()”:
/* we don't need these any more
var navbar = hypeDocument.getElementById('navbar2');
navbar.style.position = "fixed";
*/
var file = hypeDocument.getElementById('fileHolder');
file.addEventListener('scroll', function (e) {
hypeDocument.goToTimeInTimelineNamed(file.scrollTop * 0.004, 'animateBar')
//console.log(file.scrollTop);
});