CODEWITHSUNDEEP
javascripthtmljquerybootstrap-4
Tortoise41
Tortoise41

Reputation: 45

Bootstrap buttons not working on mobile chrome

Basically I am making a website and it works all fine until you try press the button on mobile chrome however it does work on mobile safari and desktop chrome.

Here is my button code there pretty much all the same:

<button style="padding-top: 15px; padding-bottom: 15px;" type="button" id="MenuButton " class="btn btn-primary btn-lg btn-block" >Menu</button>

and here is my javascript/ jquery:

$("#MenuButton").click(function(){
    location.href = "menu.html";
});

Any help would be appreciated, thanks :).

Upvotes: 0

Views: 297

Answers (2)

Alaksandar Jesus Gene
Alaksandar Jesus Gene

Reputation: 6883

Try this

 $(document).on("click", "#MenuButton",function(){
        window.location.href = "http://www.yourdomain.com/menu.html";
    });

If you are rendering the button as dynamic element, it will not be captured on first load. So you need to use .on

If still not working, try below

$(document).on("click", "#MenuButton",function(){
            alert("ok")
        });

You should get an alert box.

If not, open inspect element -> console and post the error you see

Upvotes: 1

Vishal Kamlapure
Vishal Kamlapure

Reputation: 590

What I have found is Chrome Extensions don't allow you to have inline JavaScript Documentation. And its same for Firefox.

So try using external Javascript if you are using inline Js.

$("#MenuButton").click(function(){
    location.href = "menu.html";
    
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button style="padding-top: 15px; padding-bottom: 15px;" type="button" id="MenuButton" class="btn btn-primary btn-lg btn-block" >Menu</button>

Upvotes: 1

Related Questions