检测位置：使用javascript固定

我想从这里使用Kangax的脚本：http://kangax.github.com/cft/来检测那些“正常”实现位置的浏览器：与移动浏览器相比，这是固定的，因为我可以使用jQuery来伪装它移动浏览器。检测位置：使用javascript固定

Kangax的代码工作正常。但是，当我将它合并到我的页面时，它不会。我认为这肯定是一个明显的错误。任何帮助将非常感激！

////Detect whether position:fixed works (mobile browsers). Use JS to position #navwrap if not. 
    //Kangax's script - begins at "function" on the next line. 
function detected() { 
    var container = document.body; 
    if (document.createElement && 
    container && container.appendChild && container.removeChild) { 
     var el = document.createElement("div"); 
     if (!el.getBoundingClientRect) { 
      return null; 
     } 
     el.innerHTML = "x"; 
     el.style.cssText = "position:fixed;top:100px;"; 
     container.appendChild(el); 
     var originalHeight = container.style.height, originalScrollTop = container.scrollTop; 
     container.style.height = "3000px"; 
     container.scrollTop = 500; 
     var elementTop = el.getBoundingClientRect().top; 
     container.style.height = originalHeight; 
     var isSupported = elementTop === 100; 
     container.removeChild(el); 
     container.scrollTop = originalScrollTop; 
     return isSupported; 
    } 
    return null; 
}; 
if (detected()) { 
    alert ('non-mobile'); 
} 
    else { 
     alert ('mobile'); 
    }

万一有帮助，原代码（剥离尽可能多地）：

<body> 
<h2>Position Fixed Test</h2>  

<script>  
(function(__global){ 
// make sure `window` resolves to a global object 
var window = this; 
var features = { }; 
features.IS_POSITION_FIXED_SUPPORTED = (features.__IS_POSITION_FIXED_SUPPORTED = function() { 
var container = document.body; 
if (document.createElement && 
    container && container.appendChild && container.removeChild) { 
    var el = document.createElement("div"); 
    if (!el.getBoundingClientRect) { 
     return null; 
    } 
    el.innerHTML = "x"; 
    el.style.cssText = "position:fixed;top:100px;"; 
    container.appendChild(el); 
    var originalHeight = container.style.height, originalScrollTop = container.scrollTop; 
    container.style.height = "3000px"; 
    container.scrollTop = 500; 
    var elementTop = el.getBoundingClientRect().top; 
    container.style.height = originalHeight; 
    var isSupported = elementTop === 100; 
    container.removeChild(el); 
    container.scrollTop = originalScrollTop; 
    return isSupported; 
} 
return null; 
})(); 
__global.__features = features; 
})(this); 

(function(){ 
function detect() { 
for (var i=0; i<1; i++) { 
    var testResult = __features['IS_POSITION_FIXED_SUPPORTED']; 
    alert (testResult); 
    i++; 
} 
}; 
detect(); 
})(); 
</script> 

</body>

来源

2011-05-10 phil

什么是错误 – shevski 2011-05-10 11:02:03

http://kangax.github.com/cft/上的原始示例可以成功地区分桌面和移动浏览器，但我的不是。我想我没有测试null与isSupported正确？ – phil 2011-05-10 12:38:41

你看到什么，什么时候 – shevski 2011-05-10 12:45:04

Sorted。感谢您的意见。

原来我的代码版本运行良好，但它必须放在页面的主体中。如果它在Head中，即使在DOM Ready调用中也不会。

只需要找出为什么现在！但至少代码的作品。

来源

2011-05-11 20:47:47 phil

我猜你总是越来越non-mobile。您正在检查detected是否存在未执行该功能。更改JavaScript来

if (detected()) { 
    alert ('non-mobile'); 
} 
else { 
    alert ('mobile'); 
}

到底有没有你所创建的功能分配给一个变量，而不是作为命名功能例如对匿名函数的原因

function detected(){ 
    // Function content. 
}

来源

2011-05-10 11:12:56 detaylor

感谢您的回复。我并入，但没有变化:( 我也纠正了命名函数与var - 只是noob-ness。 – phil 2011-05-10 12:40:08

你会得到什么结果？你提供的代码对我来说工作正常[http://jsfiddle.net /seRr3/](http://jsfiddle.net/seRr3/）。你会得到什么样的提示？ – detaylor 2011-05-10 12:46:43

@phil - 将函数声明为一个变量没有任何问题，只是当函数是 – detaylor 2011-05-10 12:58:41

检测位置：使用javascript固定

回答

相关问题