Je, hata hivi sasa, tunahitaji kusikia kwa sababu ya JavaScript?
- Makutano wa mawili Elementi ya HTML ambayo inaweza kutafsiriwa
- 下一页 语法高亮器
Tumia JavaScript kwa media query
Media query inatangazwa katika CSS3, inaonekana kama maelezo wa muundo wa tovuti inayoresha. Media query inatumiwa kuhakikisha ukurabu wa kijana na ukurabu wa kina kina, ili kumfanya tovuti inayozingatia kila kifaa (kompyuta ya mabaki, laptop, tab, simu zaidi).
window.matchMedia() Inaonyesha MediaQueryList kina kina ambako inaonyesha matokeo ya CSS media query string ya kina kina.matchMedia() Inaonekana kwenda uwanja wa kusikia kwa sababu ya CSS @media Mwongozo wa kina kina ya media kama min-height,min-width,Mwendo Na mengine mengine.
Mfano
Ikiwa ukoo la kijana unaenea kwa ukurabu wa 700 pekee, naona mabaki ya mbili ya ujumbe, kila muda inaonekana kama uwanja wa mawasiliano wa kusikia. Kama ukurabu unaenea kwa ukurabu wa kumi na nne, naona mabaki ya mbili ya ujumbe, kila muda inaonekana kama uwanja wa mawasiliano wa kusikia:
function myFunction(x) {
if (x.matches) { // If media query matches
document.body.style.backgroundColor = "yellow";
} else {
document.body.style.backgroundColor = "pink";
}
}
// Inaongea kuhakikisha MediaQueryList
var x = window.matchMedia("(max-width: 700px)");
// Inaongea kuhakikisha uwanja wa ufunzi wa kusikia kwenye muda wa kufungua
myFunction(x);
// Inaongea kuhakikisha uwanja wa ufunzi wa kusikia
x.addEventListener("change", function() {
myFunction(x);
});
Vigezo vya vijana
Mafunzo:Media query ya CSS
Mafunzo:Muundo wa tovuti inayoresha
Mwongozo wa kusoma:Method ya JavaScript window.matchMedia()
- Makutano wa mawili Elementi ya HTML ambayo inaweza kutafsiriwa
- 下一页 语法高亮器
