jquery nav with sub menus in RN theme

Posted: Mon Dec 17, 2012 9:28 am

Hi all...
I'm using a modified Anagram theme and have successfully added a css horizontal nav menu in theme php, using include_once 'menu.htm'; which includes the finely styled lists and their submenus. It works fabulously except on an old version of firefox and most importantly it doesn't work at all on any mobile devices due to a lack of support for the "hover" element on these devices, ie: ipad.

So, I'm looking for a jquery solution and just about have it working except on the first refresh of any page the nav disappears. It works fine as standalone html, but fails when I try to include it in theme.php.

So, should I add my .js to some other RN .js file and call it from something other than the menu.htm? In other words, I'm trying to figure out the best way to include a custom jquery nav into my RN theme.

I've searched the forums and was surprized I've not found the answer, but I tried.

Posted: Mon Dec 17, 2012 11:21 am

If you are only running 1 theme I would create a head-anynameyouwant.php file and upload to includes/addons/

It might look something like so, adding a CSS and JS file, replacing "somefile" with your actual files.

Code:

if (realpath(__FILE__) == realpath($_SERVER['SCRIPT_FILENAME'])) {


   header('Location: ../../index.php');


   exit('Access Denied');


}





addCSSToHead('themes/MyTheme/style/somefile.css', 'file');


addJSToHead('themes/MyTheme/js/somefile.js', 'file');

Then make sure no of the JavaScript is included in your menu.htm page. See what happens after trying that Smile

If you are running multiple themes there are some other approaches...

Posted: Mon Dec 17, 2012 2:42 pm

Just one theme ... I'll give it a try and let you know. Thanks.

Posted: Mon Dec 17, 2012 2:52 pm

Code:

<?php





if (realpath(__FILE__) == realpath($_SERVER['SCRIPT_FILENAME'])) {


   header('Location: ../../index.php');


   exit('Access Denied');


}





addCSSToHead('themes/Anagram/jquerycssmenu.css', 'file');


addJSToHead('themes/Anagram/jquerycssmenu.js', 'file');


?>

Didn't work for me. Do I need to call the addon in the theme file?

what is realpath?

Thanks for the help.

Posted: Mon Dec 17, 2012 5:59 pm

If you view the source of the page are these scripts added to the head of the document?
themes/Anagram/jquerycssmenu.css
themes/Anagram/jquerycssmenu.js

When you say it doesn't work, is the menu styled at all and just broken JavaScript functionality? Just guessing here, but also make sure the menu.htm file does not include any head or body tags.

the realpath code is just protection to keep the file from being accessed directly and potentially revealing server info

If you can't get it figured out you're welcome to zip up the theme and post/pm a link.

Posted: Sat Dec 29, 2012 4:36 pm

Hi ... finally had a moment between eggnogs and cookies to revisit this issue. Thank you for helping. Yes, I can see the files in view source. But I still can't get the menu to display at all. A nice old fashioned vertical RN Menu exists on the site so I'm not loosing too much sleep, atm. And the client hasn't said anything, yet. I hope to get it all back in my head after the holidays.

Happy Holidays to all.

Posted: Sun Jan 06, 2013 12:41 pm

Back at it... and a solution to my issue to horizontal nav and ithingies. I used a free download of css3 menu. I can't find any js or jq in their output, only css and html, and the ui was easy peasy. I'll likely buy the full version sooner or later. It all works just fine on my istuff and the client didn't notice a thing wrong when it wasn't working.

Of course, the left column A-Z Menu thing remains on all pages because I'm pretty sure this horizontal nav isn't working on IE6!

yea!

Happy New Year!