How to get bootstrap 3 responsive navbar working in IE7?

if you open IE7 (or IE10 in emulation mode) and visit http://getbootstrap.com and then resize your browser to less than 700 pixels, the top navigation menu does not appear until you hover over the content.

How can this be fixed?

PS: I know that bootstrap is not officially supported in IE7. I don’t mind if my site is ugly, I just want the functionality to work in ie7 (and right now, the lack of a navigation menu is useless!)

PPS: I know that usa ie7 uses less than 1%. Here in Thailand it is more than 5%, so I need to support ie7 yet

+4
source share
2 answers

I just did some tests, and I think I found a way to solve the problem, this is a javascript solution that listens for the collapse show event and sets the z-index of list items and anchor elements inside navbar

 $('.nav-collapse').on('show.bs.collapse', function () { $(this).find('li,a').css({'z-index':'auto'}); }) 

I don’t know for sure that the problem is with IE7, but I think that somehow setting z-index forces redrawing elements of some type.

Here's a test script http://jsfiddle.net/7jmNu/31

+2
source

You can find this IE7 for the Bootstrap 3 CSS boot file. https://github.com/coliff/bootstrap-ie7

It fixes the window size and adds glyphicon support among other fixes.

+1
source

Source: https://habr.com/ru/post/1494880/


All Articles