[英]Disable javascript file based on media query portrait mode
我想在ipad纵向模式下从一个javascript文件切换到另一个javascript文件(因此我可以在纵向模式下从水平滚动切换为垂直滚动)。
我发现了类似的东西: http : //wicky.nillia.ms/enquire.js/
但是我找不到任何可以基于此查询禁用/启用javascript文件的内容:
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)
我认为您不需要Java脚本即可执行此操作。 这是一个jsfiddle示例 ,下面是CSS:
@media only screen and (min-width : 768px) and (max-width : 1024px)
{
.container {
overflow-y: scroll;
}
}
我相信CSS媒体查询可用于样式和响应式设计。
我将使用JavaScript本身来动态更改包含的脚本文件。
http://www.javascriptkit.com/javatutors/loadjavascriptcss2.shtml举一个例子
function removejscssfile(filename, filetype){
var targetelement=(filetype=="js")? "script" : (filetype=="css")? "link" : "none" //determine element type to create nodelist from
var targetattr=(filetype=="js")? "src" : (filetype=="css")? "href" : "none" //determine corresponding attribute to test for
var allsuspects=document.getElementsByTagName(targetelement)
for (var i=allsuspects.length; i>=0; i--){ //search backwards within nodelist for matching elements to remove
if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(filename)!=-1)
allsuspects[i].parentNode.removeChild(allsuspects[i]) //remove element by calling parentNode.removeChild()
}
}
removejscssfile(“ somescript.js”,“ js”)//删除页面上所有“ somescript.js”出现removejscssfile(“ somestyle.css”,“ css”)//删除页面上所有“ somestyle.css”
我希望这可以帮助您指出正确的方向。
我通过在外部javascript文件本身中的javascript中使用媒体查询来使其工作(这只是引起垂直/水平变化的一行):
var mq = window.matchMedia('only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)');if(mq.matches) {$(document).ready(function () {$.localScroll.defaults.axis = 'y'; $.localScroll(); });} else {$(document).ready(function () {$.localScroll.defaults.axis = 'x'; $.localScroll(); });}
更多信息: http : //krasimirtsonev.com/blog/article/Using-media-queries-in-JavaScript-AbsurdJS-edition
尽管我必须刷新页面才能工作,但是我还没有在真正的iPad上进行测试。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.