基於媒體查詢縱向模式禁用JavaScript文件

Question

我想在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) 

Answer 1

我認為您不需要Java腳本即可執行此操作。 這是一個jsfiddle示例 ，下面是CSS：

@media only screen and (min-width : 768px) and (max-width : 1024px)
{
    .container {
        overflow-y: scroll;
    }
}

Answer 2

我相信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”

我希望這可以幫助您指出正確的方向。

Answer 3

我通過在外部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上進行測試。