Drop Down Navigation
Permalink Browser Info Environment
Hi - We are building out the website and noticed that the drop-downs do not show on hover. They only show on the click... is there a setting somewhere that I can change this. We are worried people won't know to click.
Thanks!
Thanks!
Type: | Ticket |
---|---|
Status: | Archived |
Attention: Since there has been no activity on this issue for two weeks, this issue has been automatically archived.
To re-open this issue, reply to this message.
To re-open this issue, reply to this message.
Attention: Since there has been no activity on this issue for two weeks, this issue has been automatically archived.
To re-open this issue, reply to this message.
To re-open this issue, reply to this message.
Attention: Since there has been no activity on this issue for two weeks, this issue has been automatically archived.
To re-open this issue, reply to this message.
To re-open this issue, reply to this message.
This is the standard Bootstrap dropdown menu behaviour, and is built this way to be more accessible for touch devices. I would suggest leaving it the way it is, as I believe that people are very familiar with this type of menu, due to the popularity of Bootstrap websites.
If you search on the internet for Bootstrap 3 dropdown hover, you will find several solutions. Because the styles for the Juniper menu are quite complicated, it is probably easier to use a javascript solution, rather than CSS. For example the solution provided by adhi below:
https://stackoverflow.com/questions/16214326/bootstrap-dropdown-with...
You can add the javascript
in the footer.php file just before the </body> tag. You will need to keep a copy of this modified file saved elsewhere to upload if you update the theme, as theme updates will overwrite your changes. This file is located here: juniper\themes\juniper\elements . Alternatively, you could add the script to the Footer tracking codes in the dashboard,if you go to the dashboard > Systems and Settings > SEO and Statistics > Tracking codes.
I haven't tested this thoroughly, and we can't provide support for customisations of the theme, so you may need to check that it works well in different devices.
If you would prefer to use CSS to modify the menu, the CSS file is called topmenu.less and is located here:
juniper\themes\juniper\css\build
You can use this file to see what CSS is being used, but we would recommend you make changes to the CSS in the dashboard design panel.
Thanks,
Jennifer