2017-01-12 12 views
0

Как бы вы отображали div/класс, который уже был скрыт кнопкой после того, как указанная кнопка была скрыта из-за разрешения экрана css, используя @media. Это код кнопки:Как повторно отобразить div после того, как скрытая кнопка скрыта?

<script> 
var button = document.getElementById('answer'); 

function showDiv() { 
    var div = document.getElementById('displayfilter'); 

    if (div.style.display !== 'none') { 
    div.style.display = 'none'; 
    } 
    else { 
    div.style.display = 'block'; 
    } 
}; 
</script> 

Это css для экрана res;

@media only screen and (max-width: 1026px) { 

    .displayfilter { 
    display: none; 
    } 

    .answer { 
    display: block !important; 
    } 
} 

Вышеуказанное работает нормально до тех пор, пока экран не будет возвращен до нормального размера. Благодаря!

+1

Вы, сударь, получили «самый запутанный вопрос, который является грамматически правильной» наградой! –

+0

Было очень сложно сказать! Ха-ха извинения .. – Midas

+0

Как насчет того, чтобы вы сказали нам о ожидаемом поведении? Как бы то ни было, мы можем только догадываться, что вы намереваетесь сделать. –

ответ

1

Если я правильно понял вопрос, если страница изменяется шире, чем 1026 и DIV скрыт затем показать:

window.onresize = function(event) { 

    if (window.innerWidth > 1026 && div.style.display == 'none') { 
    div.style.display = 'block'; 
    } 

}; 
+0

Да, это то, что я хочу сделать, мне нужно изменить div, чтобы он работал? – Midas

+0

Вы должны назначить переменную вне функции showDiv(), чтобы ее можно было использовать в других функциях, как в этом случае. – Alvaro

+0

Большое спасибо @ Альваро отлично работал. Рад, что вы поняли мой запутанный вопрос! – Midas

0

Если вы хотите, чтобы отобразить DIV по умолчанию на больших экранах, которые необходимо взять displayfilter класс и добавить display:block; к нему, но за пределами запроса средств массовой информации, например, так:

.displayfilter { 
    display: block; 
} 

на данный момент вы говорите Если [ширина устройства] меньше или равно [указанного #], то делать {...} , Ваша указанная ширина устройства 1026px. Вы не указываете таблицу стилей, чтобы отображать ее по умолчанию, чтобы она не отображалась.

+0

Он уже отображается по умолчанию, но я имею в виду, если кнопка скрывает его, а затем экран изменяет его размер, кнопка будет скрыта, но затем «displayfilter» по-прежнему скрыт – Midas

+0

@Midas It звучит так, как будто вам нужно что-то еще, чтобы снова включить div, например, другую кнопку, чтобы вызвать div и отобразить его снова. Вы хотите, чтобы кнопка отображалась при изменении размера экрана без ввода пользователем? –

+0

Нет, только div не кнопка – Midas