Hey there! I am creating my portfolio site (which is due by the end of the month) and I’ve hit a small problem with my anchors/scrolling. I understand the problem and why it exists, I’m just not sure how to code the solution. Basically I have a side menu on one half of the screen (which is fixed to the screen) and scrolling page content on the other half, which just consists of a few pictures. I have it set up so that if you hover over a menu option, it automatically scrolls to that image on the page content using a corresponding anchor, which works just fine. The problem arose when I also added a feature that when you are scrolling through the page content, as an image enters the viewport, it automatically snaps to the corresponding anchor (for the sake of visual appeal but it also allows me to code it so that the menu option that corresponds to each image changes colors depending on what image is displayed so you know which project you’re looking at). That function works just fine too. The issue is that if I’m currently viewing Project 1 and I want to view project 5, when I hover over the Project 5 menu option, because the code says that anytime an image enters the viewport it snaps to that anchor, it can’t skip images and go straight to project 5. Instead, it stops at every project anchor on the way and you have to keep moving your mouse off the Project 5 menu option and back on over and over until it finally shows up. I figured part of the problem is that Wix Code uses “MouseIn” instead of “Hover”? The only way I can think of getting around this may be to use parameters of some kind but I’m not sure which ones or how to write them in Wix Code (if this was normal java, it’d be more familiar to me). Any ideas? I’ve provided a picture of that specific code below. Any ideas would be much appreciated!
By the way, the menu I’m working with is the submenu, the one starting with “Muted Chaos” as Project 1 and ending with “Häagen-Dazs” as Project 5.
Hi mypurdy,
Can you share a link to your site? It is a bit hard to imagine how all this connects from text. I can try and figure out how to resolve this problem given that.
sure, it’s marisaypurdy.com/work
For the record, I’ve disabled the line of code that makes it so that it stops at each anchor when the image is in viewport. What I’ve done is place a little box behind the center of each image so that when that enters the viewport, it changes the text color in the submenu and the first line of that code used to say $w(“#Image1Anchor”).scrollTo(); or whatever anchor corresponds to that image, but I turned it into a comment until I figure out how to get it to work. If you want me to re-enable it so you can take a look at it, let me know:)