Как запустить код jQuery, когда область просмотра устройства превышает 1000 пикселей - PullRequest
0 голосов
/ 13 февраля 2020

У меня есть работающий код jQuery, который мне нужно запускать только на устройствах с областью просмотра больше 1000 пикселей. Я начинающий. Я установил этот код для запуска только на главной странице, но не могу запустить его для указанного окна просмотра. Я должен также упомянуть, что я использую это внутри WordPress. Я добавил код php в свои функции. php и работает как положено, за исключением этого бита. Если кто-то может помочь, спасибо.

Код выглядит следующим образом: jQuery (документ) .ready (function ($) {$ (окно) .on ('scroll', function () {* 1003) *

var y = $(window).scrollTop();
if(window.location.pathname == '/'){
if( y > 0 ){
        $('#top').fadeIn();
        $('#header-space').fadeIn();
    } else {
        $('#top').fadeOut();
        $('#header-space').fadeOut();
    }
}
else {}

});
});

Я предпринял эту попытку вместе с CSS, но потерпел неудачу:

$(document).ready(function() {
// run test on initial page load
checkSize();

// run test on resize of the window
$(window).resize(checkSize);
});

//Function to the css rule
function checkSize(){
if ($(".sampleClass").css("float") == "none" ){
    if(window.location.pathname == '/'){

if( y > 0 ){
        $('#top').fadeIn();
        $('#header-space').fadeIn();
    } else {
        $('#top').fadeOut();
        $('#header-space').fadeOut();
    }

}
 else {}
}
}

Мой CSS выглядит так: Пожалуйста, не обращайте внимания на мои случайные имена классов.

.sampleClass {float:left;}
@media only screen and (min-width: 1000px){
.sampleClass {float:none;}
}

Я сейчас застрял.

1 Ответ

0 голосов
/ 13 февраля 2020

Получите ширину окна:

 var width = $(window).width();

Тогда вы можете поиграть как:

if (width > 1000) {
// dosomething big
} else {
// stay low
}
...