Please can someone point me in the right direction - ddsmoothmenu missing image

**napcs** · 07-30-2013, 04:04 PM

1) Script Title: Smooth Navigational Menu (v2.1)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...smoothmenu.htm

3) Describe problem: http://napcomputersolutions.co.uk/index.html

If you take a look at the above link, you will notice that next to each header of the menu there is what appears to be a missing image. I cannot work out where it is trying to pull this image from.

I have a feeling it is trying to pull in one of the arrow gifs but i've placed them in both the same directory and the images directory and this doesnt appear to have resolved the issue.

It would be great if someone could help me out. I can supply codes but not sure exactly which file is calling this link.

Thank you for your help in advance.

Regards

Neil

**napcs** · 07-30-2013, 04:08 PM

Don't worry about formatting or colours its just a test site.

Looks like the issue only happens on Safari and Chrome

**Beverleyh** · 07-30-2013, 04:19 PM

Your page is in violation of Dynamic Drive's usage terms, which, among other things, states that the credit notice inside script must stay intact. Please reinstate the notice first.

Also, please provide the link to the script demo page on DD so we can easily see which script you're working with.

**napcs** · 07-30-2013, 05:07 PM

An ex colleague originally set this up, so i apologise with regards to the missing content i will get this re-added

attached is the style.css sheet

**Beverleyh** · 07-30-2013, 06:34 PM

No worries - open this file; "wp-content/themes/figero/js/ddsmoothmenu.js", and scroll down to the Global Configuration Options. Look for the line that defines arrowimages, and just add a slash at the start of the image path - so, '/images/down.gif' and '/images/right.gif' instead of 'images/down.gif' and 'images/right.gif'. And to load in the changes, make sure you do a hard refresh (CTRL+F5 in Windows)

**jscheuer1** · 07-31-2013, 12:36 AM

If that doesn't help (probably won't), add this to one of the stylesheets:

Code:

#menu li a:after {
	content: none !important;
}

like to the http://napcomputersolutions.co.uk/style.css file.

And while you're at it, you probably will want to add this as well:

Code:

#menu .ddsmoothmenu li li {
	background-color: rgb(36, 36, 36) !important;
}

Oh, and you should add a standards invoking DOCTYPE like:

Code:

<!DOCTYPE html>

as the first thing in the page's source code.

The browser cache may need to be cleared and/or the page refreshed to see changes.

**napcs** · 07-31-2013, 09:08 AM

Thank you Beverley and John.

Unfortunately making an amendment to the ddsmoothmenu.js didn't resolve the issue, but thank you for the advice.

John, your solutions worked perfectly and I've implemented all of your changes, i really appreciate that.

Now just got to work out how to get highlight the menu for the page that I'm on, and remove the images from the footer in the same way!! Thank you both for your quick responses.

**napcs** · 07-31-2013, 11:00 AM

Thank you for your help its been a godsend!!

Would it be possible to ask 2 further questions.

Still using the page

http://www.napcs.co.uk/index.html

You will notice that when you use the header ddsmoothmenu that wherever the mouse hovers the text changes to orange which is great. Can you make the header also be highlighted or change colour to make it obvious to the user which menu they are hovering over?

As an example if you hover over IT Support and then filter down to Business IT Support. Business IT Support will be orange which is great but can we also do someithing with the words IT Support?

Finally last question at the bottom of the page in the footer there are missing images next to the headings, could you tell me how i get rid of these i cant find them in the code?

Thank you ever so much for your help, love the menu!!!

**Beverleyh** · 07-31-2013, 12:31 PM

To keep the parent <li> highlighted when a child is hovered over;

Code:

#menu ul li:hover > a {
background:red; 
}

Although, as John already said, you must make sure that a standards invoking doctype appears as the first thing in your markup. Your page currently looks like this;

Code:

<html>
<!-- http://napcomputersolutions.co.uk/ -->
<!DOCTYPE html>
<html lang="en-US">
    <head>

But is should just look like this;

Code:

<!DOCTYPE html>
<html lang="en-US">
    <head>

I've tested my CSS above and it will not work until you fix the doctype as indicated.

As for the broken images in the footer - the stylesheet is only showing this;

Code:

.footer h5:after { content: url(); }

So I would guess that the images paths are probably being generated dynamically in a php file somewhere - I cant say where exactly because that's the nature of a dynamic file. You could try doing some more detective work in your template files (or ask at the Wordpress forums) to locate what/where they are and then replace them with a blank gif/png or a jpeg that matches the background colour. Or can you delete the code that is generating the CSS block from the stylesheet (if that's what is happening)? If you can't remove that block from the stylesheet completely, how about editing the HTML to change the heading tags in the footer from <h5> to <h6> maybe, and then apply some styles to match them to the way they currently look? Its a bit of a workaround/cheat, but if the tags aren't there in the markup, the CSS (dynamically generated or otherwise) can't be applied to them.

**napcs** · 07-31-2013, 01:37 PM

Thank you Beverley, that is spot on. Worked like a dream and you saved me a lot of pain with that solution.

Also I just removed the lines you mentioned calling the image and that worked.

Thread: Please can someone point me in the right direction - ddsmoothmenu missing image

Thread Tools

Search Thread

Please can someone point me in the right direction - ddsmoothmenu missing image

Thank you

The Following User Says Thank You to jscheuer1 For This Useful Post:

The Following User Says Thank You to Beverleyh For This Useful Post:

Similar Threads

a image point to document text sizer script combine

Image Description is Missing

Image to repeat vertically starting at certain point ?

how to get clicked image to take to new page and point to info?

Please point me in the right direction

Bookmarks

Bookmarks

Posting Permissions