Question

My site has a fixed menu at the top, I used the sticky plugin however I want to disable this function in mobile.

Is it possible to hide or disable the function with Jquery? To da to do only with the javascript

This is my html code

 <div id="fixed-search" class="fixed-search">
                        <div class="col s12 m6 l2 center-align">
                            <select id="localizacao" multiple class="dropdown-select">
                                <option value="" disabled selected>Finalidade</option>
                                <option value="1">Venda</option>
                                <option value="2">Aluguel</option>
                                <option value="3">Aluguel Temporada</option>
                            </select>
                        </div>
                        <div class="col s12 m6 l2 center-align">
                            <select id="localizacao" multiple class="dropdown-select">
                                <option value="" disabled selected>Localização</option>
                                <option value="1">Capão da Canoa</option>
                                <option value="2">Torres</option>
                                <option value="3">Tramandaí</option>
                            </select>
                        </div>
                        <div class="col s12 m6 l2 center-align">
                            <select id="bairro" multiple class="dropdown-select">
                                <option value="" disabled selected>Bairro</option>
                                <option value="1">Centro</option>
                                <option value="2">Zona nova</option>
                                <option value="3">Guarani</option>
                            </select>
                        </div>
                        <div class="col s12 m6 l2 center-align">
                            <select multiple class="dropdown-select">
                                <option value="" disabled selected>Dormitórios</option>
                                <option value="1">1</option>
                                <option value="2">2</option>
                                <option value="3">3</option>
                                <option value="4">4 ou +</option>
                            </select>
                        </div>

                        <div class="col s12 m6 l2 center-align">
                            <select multiple class="dropdown-select">
                                <option value="" disabled selected>Dormitórios</option>
                                <option value="1">1</option>
                                <option value="2">2</option>
                                <option value="3">3</option>
                                <option value="4">4 ou +</option>
                            </select>
                        </div>

                        <div class="col s12 m6 l2 center-align">
                            <select multiple class="dropdown-select">
                                <option value="" disabled selected>Dormitórios</option>
                                <option value="1">1</option>
                                <option value="2">2</option>
                                <option value="3">3</option>
                                <option value="4">4 ou +</option>
                            </select>
                        </div>
                    </div>

And this is my Jquery

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
  $("#fixed-search").sticky();
}

$("#fixed-search").sticky({topSpacing:10});

Example

In this image you can see the fixed menu above the other items

I solved the issue with

 if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {

}else{
  $("#fixed-search").sticky({topSpacing:10});

}

Answer 1

我不会使用用户代理。您可以使用媒体查询。 https://www.w3schools.com/howto/howto_js_media_queries.asp

Answer 2

使用BOM对象查找基于设备的设备，并应用您要实施的更改在js

中写下面的代码

if(window.innerWidth < 767) {
   $("#fixed-search").sticky();
} else {
   $("#fixed-search").sticky({topSpacing:10});
}

How to disable a function in Mobile with Jquery

2 个答案: