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.
Related
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.
I have encountered this strange issue where the dropdown will jump to the top left if scrolling with overflow: scroll or if it's bigger than the body.
I'm trying to "dynamically" change a dropdown button to an input on keypress, and have it share the same dropdown box. The content of the dropdown changes as you type.
I think it's better to illustrate the issue by showing a direct example, (because it's a bit big): https://jsfiddle.net/eno4v9kL/
The issue occurs if you scroll down, and then start typing something. It will then jump to the top left.
I have kind of tried to control the behavior of the dropdown but I don't understand how it should be handled;
dropdown = new bootstrap.Dropdown(elm);
I'm not quite sure how to handle this properly in JavaScript, because bootstrap initializes the dropdown automatically. How does one control this automatic behavior?
I think a possible solution would be to have 2 dropdowns, one for each element instead of sharing the same dropdown, but I would like to only use this one dropdown if possible
I have been searching for a way to make a menu rise up from a menu bar underneath an image
I want it so when you click on an arrow the menu will open up and partly cover the image without affecting the position of other elements in the page.
I'm struggling to find a way to do this. The reason for posting in here is not for a complete solution but thought that maybe someone could point me in the right direction. For example does this have a name? Any jQuery plugins that might help?
I have tried to recreate this affect using slideUp() and slideDown() but i am unable to get it to do the desired affect. I also tried using accordion but was unable to get that to produce the desired affect.
Any help would be much appreciated.
If initially the menu with submit button need to be present at the bottom of the page:
try setting position: absolute; and bottom:0px; with defined height.
Then for the arrow mark, bind a click event.
In the click event callback function:
Use jQuery.animate function and change the height and top properties of css.
Even better if you don't want any animation, just toggle CSS class for the bottom bar.
Not sure if the title made sense, but I noticed in the wordpress 3.8.1 admin panel, If you resize your window to where the sidebar has menu items blocked from view, it is normal positioning, which allows the sidebar to scroll.
If all the items are visible, then the sidebar has fixed positioning so that only the content to the right of the sidebar will scroll.
Neat little effect.
I was thinking it requires jQuery to add a class or change css. Maybe if the last item in the sidebar is visible then add the class, else leave it alone.
Not sure how to actually code that though.
Can someone help out, maybe even a basic fiddle?
You can do this with simple CSS.
.div_name {
position:fixed;
}
check W3schools Position fixed property for tags
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?!