2016-04-04 15 views
0
Ben iki yan paneller (panel_Left ve panel_Right) sadece if (window.innerWidth> 800) ama her zaman yalnızca bir

açık sol ve sağ yan panel if (window.innerWidth> 800)

açık panel olmak açmak istediğiniz

window.onresize = function (event) { 
    if (window.innerWidth > 800) { 
     window.setTimeout(openPanel, 1); 
    } 
    if (window.innerWidth < 800) { 
     window.setTimeout(closePanel, 1); 
    } 
}; 


function closePanel() { 
    $("Panel_left").panel("close"); 
    $("#Panel_right").panel("close"); 
} 

function openPanel() { 
    $("#Panel_left").panel("open"); 
    $("#Panel_right").panel("open"); 
} 


$("#Panel_left").on("panelcreate", function (event, ui) { 
    if (window.innerWidth > 800) { 
     openPanel(); 
    } 
    if (window.innerWidth < 800) { 
     closePanel(); 
    } 
}); 

kullandığım bilerek (jquery.mobile-1.4.5.min.js)

+0

buradan html ekleyebilirsiniz bi @mo mı? –

+0

Metin yeniden düzenleyin ve biçimlendirin – iberbeu

cevap

0

window.onresize = function(event) { 
 
    if (window.innerWidth > 800) { 
 
     console.log("hi"); 
 
     document.getElementById("left").style.display = "block"; 
 
     document.getElementById("right").style.display = "block"; 
 
     // window.setTimeout(openPanel, 1); 
 
    } else { 
 
     document.getElementById("right").style.display = "none"; 
 
     document.getElementById("left").style.display = "none"; 
 
     console.log("hello"); 
 
     // window.setTimeout(closePanel, 1); 
 
    } 
 
}; 
 
window.onload = function() { 
 
    if (window.innerWidth > 800) { 
 
     console.log("hi"); 
 
     document.getElementById("left").style.display = "block"; 
 
     document.getElementById("right").style.display = "block"; 
 
     // window.setTimeout(openPanel, 1); 
 
    } else { 
 
     document.getElementById("right").style.display = "none"; 
 
     document.getElementById("left").style.display = "none"; 
 
     console.log("hello"); 
 
     // window.setTimeout(closePanel, 1); 
 
    } 
 
}
#left, 
 
#right { 
 
    width: 10%; 
 
    display: inline-block; 
 
} 
 

 
#left { 
 
    float: left; 
 
} 
 

 
#right { 
 
    float: right; 
 
}
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>stack</title> 
 
    
 
    <link rel="stylesheet" type="text/css" href="style.css"> 
 
</head> 
 

 
<body> 
 
    <div id="left">hi</div> 
 
    <div id="right">hello</div> 
 
    <script type="text/javascript" src="controller.js"></script> 
 
</body> 
 

 
</html>
sen? Bu ihtiyaç

+0

** evet ** gerçekten Yapmak istediğim şey budur ** Yardımınız için teşekkürler. ** –

+0

hoş geldiniz :) .Lütfen cevabımın yanındaki yukarı ok düğmesini tıklayabilirsiniz? – Batman

+0

birşey değil ... evet ok –

İlgili konular