Working with ddsmoothmenu Smooth Navigation Menu by Dynamic Drive for a WordPress project I encountered a stupid lack of setting to provide image paths dynamically. This is a jQuery-based dropdown menu which seems and works fine but requires a static path to the images. Only two images though, for the arrows down and right, but it would be a serious issue when releasing a website or migrating to a new server.
So I decided to add a new setting configurable through the JavaScript call in your call-menu file where you could use php/java/python/whateva to retrieve the correct path dynamically and just pass it. I'm using v.1.5 and I did 2 corrections:
- in the ddsmoothmenu.js file replaced all smoothmenu.arrowimages strings with setting.arrowimages (just changing 'smoothmenu' to 'setting' in these three lines). There are 5 strings to be replaced at lines 75 to 77. What I do is add a new setting for them in the next section.
- Adding the paths to the images as a setting. So at the end my call includes the dynamic path to be used in the menus. Since I'm using WordPress, here there is my code for calling the menu:
I've had an issue running IE7/IE8 as well but the problem was using nav tag from HTML5 so changing to div or adding the html5.js solved it.
I like ddsmoothmenu but have never understood why the arrow images need to be hard coded into the js file when there's a CSS file that comes with the script anyway. CSS is where style elements belong and since those images do not effect functionality (unless they're missing) they have no place is the js. Your workaround is an improvement at least.
It has lots of imperfections but after all is a good script. Haven't had the time to explore something drastically better.
Thank you for this wonderful javascript, I've used it with great success on many websites. The only problem I've had was integrating it into WordPress. I used the fix you posted here to give the full image path of the arrows but the arrows are not picking up the downarrowclass for some reason that I can't figure out. The arrow images are being stretched to the size of the list item above it. Any help you could give me would be greatly appreciated. Here is the link to the blog where you can see the problem: http://collincountyhumanesociety.org/blog/
Thank you!
Add this at the bottom of your CSS:
#branding img {
width: 12px;
}
That worked! Can I say I Love You!
You're welcome.
thanks, this solved my problem with the arrows path!!
I know this post is old, but nevertheless, I would really really really appreciate some help. I am a beginner in wordpress and currently I am in the stage of deleting and repasting various lines of code to understand how the themes work. I want to use ddsmoothmenu for twentyten theme (have used it succesfully for a static site as well for a wp blog which navigation menu is static, however, I wanted to know if it is possible to apply this ddsmoothmenu dynamically, that means that if I add as an administrator new pages for my wordpress site, the smoothmenu applies to them. Again, I would appreciate the help… thanks
This help me solve the problem. Thanks.
But, now I have still 2 problems:
- Can Smooth Navigation Menu be integrated with TinyNav or SelectNav.js and how?
- Centering the menu horizontally (the theme is 100% width, I found the solution only if the theme using a fixed width).
I’m sorry and thanks for your help.
Just want to say your article is as amazing. The clearness in your
post is just nice and i can assume you are an expert on this subject.
Well with your permission allow me to grab your RSS feed
to keep updated with forthcoming post. Thanks a million and please keep up the gratifying work.