How to put a horizontal scroll in wordpress menu item - javascript

I got a problem with menu and adding scroll to it.
I dont want horizontal scroll, I want vertical scroll and then when I hover over lets say "GELOVI" in shop I want that sub menu to pop out like it does without a scroll.
If you didn't understand me clearly please ask I will do my best to explain a bit more.
This is the website:
Rich Nails
Item in menu for scroll to be added to is called shop.
Thank you in advance.

Related

Is there anyway to dynamically change the contents of a navigation menu when a user clicks a link?

I am trying to replicate the mobile menu navigation style on asos.com in such a way that when a user clicks on Men in the navbar it loads categories under man on that navbar. I really don't know what to call it but I have been stretching my heard around how to implement same with react. Please find below an illustration on how I want it to work. Thanks

Dropdown menu on navigation bar disappears behind when scrolled down

this is the website I am trying to set up: http://koralhassan.com
I have adjusted the template to make the CV section a hover-dropdown section. However, when I scroll down, the dropdown menu no longer appears when hovering. I am trying to find a way to either make the it appear, or make the dropdown expand to the right of the CV section instead of below it (which I think would also solve the problem). I have very little programming knowledge so please don't throw me in the deep end. Thank you!
Your class .w3-bar has property overflow: hidden.
Remove it and it should be fine.

Horizontal Scroll on click

Does anybody knows how to implement horizontal scrolling on event? I am trying to replicate this functionality: http://www.spotify-valentines.com/#/home
First, it scrolls fullpage to the right. Then, it scrolls half way to the right. Then it scrolls full page, also to the right, and finally it becomes a normal screen with vertical scrolling.
The site seems to be built with Angular, but I am not sure how this functionality is accomplished.
Thanks!
It can be accomplish by using fullPage.js.
Just create a single section with multiple slides in. Then you can create your custom buttons and associate them with the action $.fn.fullpage.moveTo() or $.fn.fullpage.moveSlideRight() or $.fn.fullpage.moveSlideLeft().

Menu hover effect when scrolling on the page

I created a site with a top navigation bar that has hyperlinks to anchors in the same page for different content.
I'm trying to create a hover effect on the navigation bar when a user scrolls past the corresponding anchor in the same page. For example, when I scroll past link1's anchor, I want the top navigation hyperlink for link1 to change to a different color.
I tried searching Google but can't find anything relevant to do this.
Can someone point me in the right direction or provide some code examples for how I might do this using HTML/CSS/Jquery/Javascript, etc?
Sounds like you want a ScrollSpy plugin.

dropdown menu stops working after page jump

My head is about to explode as I try to figure out the reason why my dropdown menu stops working as soon as the page jumps to an anchor. There is some JS involved in the jump, too, but the same problem existed even with a plain html anchor jump.
The page is at http://mincovlawyer.com/doc/euro-excellence
As you load the page, please hover over "The Law", "About" and "The Goodies" and see how the dropdown is supposed to operate.
Then click any of the links in the sidebox to the right, for example Alt. #1.
Then hover over the menu items again and observe that no dropdowns emerge anymore.
I would immensely appreciate any guidance in this regard.
The rollover breaks even if you just scroll down the page. The rollover menu is positioned absolute and the navigation is positioned fixed. You could add 'position:fixed' to your rollover menu or you could add the scroll offset in your drop down menu code.
To set 'position:fixed':
At line 8 of the anylinkmenu.css file, change the position:absolute to position:fixed.
It looks like they're working, but they are above the top of the page. Before clicking on any of the links, scroll down just a little bit. Then hover over "The Law" and you'll see your menu shifted vertically.
Now that's a lot of code...
Where's your menu created? The mouse-over stuff
Question1:
Why even using any javascript for an inline-anchor? Using #links scrolls to said position anyways, even without JS?!

Categories

Resources