Jump to content


Photo
- - - - -

Issues while trying to change width to collapse navbar

navbar

  • Please log in to reply
9 replies to this topic

#1 paulhibbitts

paulhibbitts

    Member

  • Members
  • 10 posts
  • Country: Country Flag

Posted 18 June 2013 - 09:00 PM

Hello,

 

I am trying to change the trigger for collapsing the navbar (fixed) and followed the instructions on this thread:

Please Login or Register to see this Hidden Content

 

I changed the two 767px values to 1000px, and pasted the relevant (I think) CSS into my custom CSS field. Here is the CSS I altered and pasted:

Please Login or Register to see this Hidden Content

 

However, as the width gets minimized the entire dropdown menu is displayed for a period of time, and then as the width gets further reduced the dropdown menu does disappear as expected, as can be seen here:

Please Login or Register to see this Hidden Content

 

I would greatly appreciate any suggestions on how I can fix this.

 

Thanks very much,

Paul



#2 James B

James B

    Advocate

  • Moderators
  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 18 June 2013 - 10:22 PM

Hi there

 

For the gap inbetween the two instructions try the below, this seems to work in firebug to hide the drop down in between the two widths.

 

#site .navbar .nav-collapse {
    height0;
}


#3 paulhibbitts

paulhibbitts

    Member

  • Members
  • 10 posts
  • Country: Country Flag

Posted 18 June 2013 - 11:21 PM

Hi James,

 

Thanks for the help. I added your CSS right after the last @media code but it did not seem to change anything.

 

I then added !important; and now the menu background hides as expected but the white text of the menu items (look carefully) still is visible, which can be seen at 

Please Login or Register to see this Hidden Content

 

Do I need to put the CSS somewhere else, or add something to also hide the text?

 

Thanks very much,

Paul



#4 James B

James B

    Advocate

  • Moderators
  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 18 June 2013 - 11:57 PM

Hi there,

 

Ok I've tested this by recreating your setup and that menu should stay hidden regardless until the menu is clicked, so it doesn't seem to be an issue with the css, so remove the previous code I gave you so the black background comes back so you can test. It looks like there's a js error which is causing it to stay present on the screen. Something from olark.com?

 

Please Login or Register to see this Hidden Content

 

Try deactivating your plugins, then test the menu again by resizing the screen, do you see the menu and does the drop down button the top left retract it when clicked?



#5 paulhibbitts

paulhibbitts

    Member

  • Members
  • 10 posts
  • Country: Country Flag

Posted 19 June 2013 - 12:21 AM

Hi James,

 

I use olark for the chat box on the site - I removed the html code I was including in a hook, and I removed your earlier code, but I still have the menu contents appearing when I narrow the Browser window (and view on an iPad, etc.).

 

I've also tried to disable all the plugins, except for the PageLines ones, and still get that unexpected full display of the dropdown menu :-(

 

Any other ideas?

 

Thanks very much,

Paul



#6 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 20 June 2013 - 12:31 PM

Paul, do you have a cache plugin (active or not)?



#7 paulhibbitts

paulhibbitts

    Member

  • Members
  • 10 posts
  • Country: Country Flag

Posted 20 June 2013 - 01:56 PM

Hi Rob,

 

Thanks for the follow-up. Yes, I had a deactivated cache plugin which I now completely removed but still no luck :-(

 

Any other thoughts? The earlier CSS tweak suggested by James partially solved the issue, but the text of the dropdown menu was still visible.

 

Thanks,

Paul



#8 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 21 June 2013 - 11:10 AM

Paul,

 

I didn't ask you to remove the cache plugin. Please don't move faster than we do.  If a cache plugin was activated, it's very likely the cache file is still functioning, even if you've completely deleted the plugin. My recommendation was going to be to clear the cache within the cache plugin's settings.  By deleting the cache plugin, you may well have locked the cache file in place.

 

Reinstall the cache plugin.  Clear the cache and then deactivate but do not delete.



#9 paulhibbitts

paulhibbitts

    Member

  • Members
  • 10 posts
  • Country: Country Flag

Posted 21 June 2013 - 01:01 PM

Hi Rob,

 

Sorry about that - I followed your instructions to reinstall the cache plugin (which was W3 Total Cache), cleared all caches, and then deactivated the plugin.

 

Still no change in the unexpected behaviour so far.

 

Thanks,

Paul



#10 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 21 June 2013 - 08:19 PM

Paul, that's okay, but at least now we know nothing's locked into the cache.







Also tagged with one or more of these keywords: navbar