[JS] Bootstrap navbar werkt niet op iOS

[ThaAresX]

Beste tweakeraars.

Ik heb een websitetje draaien voor mijn stagebedrijf. Hierop zit een bootstrap navbar om er ook gebruik van te maken op de telefoon. Nou heb ik een probleempje. Wanneer in Safari op iOS de dropdown werkt niet. Open ik de website in Chrome, dan wel. Ik doe zelden tot nooit webdev en al helemaal geen front end. Kan iemand mij hierbij helpen?

Ik heb de volgende links al geprobeerd:

http://stackoverflow.com/...tton-dropdown-work-on-ios

HTML:

<div class="bs-example">
    <nav role="navigation" class="navbar navbar-default">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
           
        </div>

        <!-- Collection of nav links and other content for toggling -->
        <div id="navbarCollapse" class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li>Link 1</li>
                <li>Link 2</li>
                <li>Link 3</li>
                <li>Link 4</li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li>Link 5</li>
            </ul>
        </div>
    </nav>
</div>

EDIT: } weggehaald op r. 26

[DJMaze]

Welke iOS versie?
Verder is er een verschil tussen touch en click

[ThaAresX]

DJMaze schreef op dinsdag 22 december 2015 @ 11:29:
Welke iOS versie?
Verder is er een verschil tussen touch en click

Uhm, 9.2 geloof ik? Heb het bij mezelf getest en die is net geupdate. Welke iOS versie mijn collega's hebben is mij onbekend.

[Mebus]

} misschien de fout? @26

[ Voor 9% gewijzigd door Mebus op 22-12-2015 13:24 ]

[ThaAresX]

Mebus schreef op dinsdag 22 december 2015 @ 13:23:
} misschien de fout? @26

Nee het is een cshtml view in ASP.NET MVC5. Had alle code C# code er uit gehaald omdat deze alleen authenticatie en validatie bevat.

[Ruubster]

Wat bedoel je precies met dropdown? Dat het menu niet uitklapt als je op het hamburger-menu-icoontje klikt? Ik zie in het menu namelijk geen dropdown-knoppen staan. En welke versie van bootstrap heb je draaien? Lijkt alsof ie de JS niet uitvoert of kan uitvoeren.

[ThaAresX]

Ruubster schreef op dinsdag 22 december 2015 @ 13:44:
Wat bedoel je precies met dropdown? Dat het menu niet uitklapt als je op het hamburger-menu-icoontje klikt? Ik zie in het menu namelijk geen dropdown-knoppen staan. En welke versie van bootstrap heb je draaien? Lijkt alsof ie de JS niet uitvoert of kan uitvoeren.

Inderdaad, het menu klapt niet uit wanneer ik op het hamburger icoontje klik. Ik gebruik bootstrap 3.3.5 (?). Ik importeer in de betreffende pagina de volgende javascripts:

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

De javascript wordt wel uitgevoerd, want wanneer ik het op mijn pc test, of in een andere browser op me iPhone, doet het hamburger icoontje het wel.

[skate master]

heb je code even vergeleken met samples op de bootstrap website.
Ik mis een tweetal zaken in je button ten opzichten van de samples.

HTML:

aria-expanded="false" aria-controls="navbarCollapse"

Je button code wordt dan:

HTML:

  <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle" aria-expanded="false" aria-controls="navbarCollapse">
         <span class="sr-only">Toggle navigation</span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
</button>

Kan niet testen of dit werkt, heb geen iPhone / IOS device maar je zou het even kunnen proberen.