search

vivkay / ffi

Redesign of Fauna & Flora nonprofit website
http://vivkay.github.io/ffi
0 stars 0 forks source link

help with javascript navigation #33

Closed sara-clayton2 closed 8 years ago

sara-clayton2 commented 8 years ago

@thomasjbradley

for the navigation I used javascript to generate the list items and theres an issue now that when it is in larger desktop screen I have the mobile nav hidden but javascript is still generating the list items so its interfering with the desktop navigation. Is there any way I can fix this or do you know of any tutorials where I don't have to use javascript to have the same effect I want on the mobile nav ?

thomasjbradley commented 8 years ago

How is it interfering with the desktop navigation? I can’t really pick out the problem.

sara-clayton2 commented 8 years ago

when it switches to desktop and you inspect it you can still see the mobile nav even though it is set to display: none. and when you click on the navigation on desktop it doesnt go to the right section/ show the content on the page, like when you click on the blog page it doesnt show content or link to the blog page even though it is properly linked.

sara-clayton2 commented 8 years ago

@thomasjbradley

thomasjbradley commented 8 years ago

It's probably because you’re using fadeToggle() in the Javascript file. It's going to add display: block onto the element in a real brute-force way that you can’t overwrite in your CSS file with media queries..

I think it'd be better to remove the fading from Javascript and instead add a transition in CSS. Then trigger that with toggleClass() like you’re doing for the menu button.

sara-clayton2 commented 8 years ago

thanks , fixed it!