html5自動橫屏的方法


html5自動橫屏的方法
<pre>
var evt = "onorientationchange" in window ? "orientationchange" : "resize";
 
 
 
window.addEventListener(evt, function() {
 
console.log(evt);
 
var width = document.documentElement.clientWidth;
 
var height = document.documentElement.clientHeight;
 
$print = $('#print');
 
if( width > height ){
 
 
 
$print.width(width);
 
$print.height(height);
 
$print.css('top', 0 );
 
$print.css('left', 0 );
 
$print.css('transform' , 'none');
 
$print.css('transform-origin' , '50% 50%');
 
}
 
else{
 
$print.width(height);
 
$print.height(width);
 
$print.css('top', (height-width)/2 );
 
$print.css('left', 0-(height-width)/2 );
 
$print.css('transform' , 'rotate(90deg)');
 
$print.css('transform-origin' , '50% 50%');
 
}
 
 
 
</pre>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM