Hi Anita,
Hmmm, it should work right out of the box but might fail if you there are any JavaScript errors on the page, either caused by this plugin or something else on your site. If you post a link to your site, I’ll be happy to take a look for you. If not, I’d recommend using your Chrome or Firefox’s built-in developer tools to check for JS errors.
Either way, curious to hear more. Thanks!
Hey! Please take a look at dizzybees.net while you are at it- I am using various combinations of :
#menu-main.sf-menu.sf-js-enabled,
#menu-middle.sf-menu.sf-js-enabled
or
#menu-main, #menu-middle
and I’ve tried a few others.
The width is set at 800px- so it should kick in pretty early.
Thanks for any time you can lend this.
-CE
Hi there yelloworange,
After looking at your site, I can tell you a few things are going on here. . .
First of all, your theme appears to have a built-in responsive menu, so there’s really no need for you to use this plugin. You can see what I mean by going to the following live preview of the theme you’re using and dragging the window narrower to see the responsive menu behavior: http://www.kadencethemes.com/product/virtue-free-theme/
Secondly, I’ve taken a look at your theme’s HTML and the jQuery selectors you’ve specified are the <ul> element itself, not the menus parent container as specified in the plugin instructions. The plugin is looking for the first <ul> inside the selector you specify, and in this case it can’t find one. This causes the jQuery to throw an error, since it’s attempting to process a non-existent selector – in fact, this is something I should fix and will work on ASAP. That said, this may prevent the normal behavior of your theme’s responsive menu, and I recommend disabling JRSM (since you don’t need it anyway).
Lastly, your theme has the following CSS built in:
@media (max-width: 979px) {
#nav-second ul.sf-menu {
display: none;
}
...
This CSS exists to work in conjunction with your theme’s built-in responsive navigation, hiding the full-size menu and displaying the mobile menu below 980px. Even if you specified the correct selector above, the JRSM might still not be visible if your theme CSS is hiding other containing elements – just something to keep in mind going forward.
Anyhow, thanks for the heads up. I hope this helps, and I’ll get to working on the jQuery error as soon as I can. Thanks!
– Mickey
Hi again yelloworange,
If possible, could you please tell me how you’ve set up JRSM so I can try to debug the issue you’re having. What settings do you have in place right now via Settings > jQuery Responsive Select Menu?
Thanks!
