Canvas Support

Duplicate ID problem

6 replies · opened Dec 8, 2016

IivanpossDec 8, 2016

I have a duplicate id problem which I cant figure out how to solve.

www.achieva.us

I used the primary menu code as a framework for creating an icon menu down lower on the page. I want to keep both menu's but that creates a duplicate ID (nav id="primary-menu" ). So I copied all of the primary-menu code from "style", created a new custom css stylesheet and pasted in code, changed all of the Primary-menu references to primary-menu2, linked new stylesheet last, and changed nav id to primary-menu2.

and it worked!- no more duplicate ID. Icon menu bar looked fine... until I went to try a submenu. No submenu. My submenu list in the HTML is still there. But doesn't work. So I lost some code in the translation to the new stylesheet but cant figure out what.

The live site still has the duplicate ID code and a working submenu on first icon. I only changed my testing site.

So... Which css code did I break that would cause me to lose the dropdown menu even though the dropdown list is still part of the html?

IivanpossDec 8, 2016

I posted my attempt at a fix so you could review live.

The original with duplicate ID is live at www.achieva.us/index.html

The attempt at a fix is at www.achieva.us/index2.html

My attempt: I renamed the bottom nav/menu id to <nav id="primary-menu2">...
...then I took all of the primary menu code from styles.css and pasted it into a new custom css file and linked it to the page.
I changed all of the references to "primary-menu" in the custom css file to "primary-menu2". No more duplicate ID... except the drop down menu no longer works. So I must be missing some primary menu code because my drop down list hasn't changed.

SSemicolon WebSTAFFDec 9, 2016

Hello,

We have checked out your Codes and to make the #primary-menu2 Submenus work, you will need to add the reference to it in the superfish: function() Function Block inside the js/functions.js File.

Hope this Helps! Thanks for your Patience.

Do let us know if we can help you with anything else or if you find any further issues with Canvas.

IivanpossDec 10, 2016

Ok Thanks - that worked- dropdown menu is back and I no longer have duplicate id's... but I have lost background color of dropdown box. Dropdown box has turned white. Where is code that controls color of dropdown box? I suppose I need to add primary-menu2 reference to that color style.

www.achieva.us/index2.html

thanks

SSemicolon WebSTAFFDec 10, 2016

Hello,

We tried checking out your Website but it does not seem to be updated.

Nonetheless, the thing is that there are many complications involved with Duplicating a ID such important as the Primary Menu as it has been referenced many times in the different JS/CSS Files for different functionalities and you will need to duplicate it to make the functionality seamless across the codes.

Please comb through the other JS/CSS Files and duplicate the #primary-menu Codes to #primary-menu2 just in the way you did in CSS and this should fix the issue.

Hope this Helps!

Do let us know if we can help you with anything else or if you find any further issues with Canvas.

IivanpossDec 10, 2016

www.achieva.us/index2.html is and was absolutely updated when you looked. I had replaced the function.js file with an updated file function.js that had the changes to the entire superfish function block. When I tested it live online before submitting that reply the changes online had indeed taken place.

if you go to the link www.achieva.us/index2.html and go to the lower menu 1st picture icon (cap and gown) a sub-menu will open. The menu that opens means that indeed I did update that function block (since it wasnt opening before). But you will notice that the submenu background is now white.

IivanpossDec 10, 2016

never mind I found it - in dark.css

but again- the function.js had indeed been updated prior to your looking

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard