در حالت عادی ارتفاع تصویر در دستگاه‌های قابل حمل بیشتر از عرض است ولی در وصورتی که دستگاه را در بچرخانید و آن را به حالت `landscape` ببریم عرض تصویر بیشتر از اتفاع آن خواهد بود، این ویژگی میتواند در ایجاد وب‌سایت‌ها یا برنامه‌های موبایل به کمک برنامه نویسان بیاید و آنها را به ایجاد رابط کاربری بهتر هدایت کند، روش‌های مختلفی برای بدست آوردن سمت قرار گیری دستگاه‌های همراه وجود دارد که در اینجا به آنها اشاره میکنید

` orientationchange `

``` window.addEventListener("orientationchange", function() { // Announce the new orientation number alert(window.orientation); }, false); ```

` resize `

در برخی دستگاه‌ها رویداد ` orientationchange ` فراخوانی نمی‌شود ولی رویداد ` resize ` فراخوانی می‌شود، در این حالت میتوان هنگام فراخوانی این رویداد با بررسی طول و عرض صفحه به سمت قرارگیری دستگاه پی برد

``` window.addEventListener("resize", function() { // Get screen size (inner/outerWidth, inner/outerHeight)

}, false);


<h2>`CSS`</h2>
<p>مدیا کوئری در سی‌اس‌اس روشی ساده برای تشخیص سمت دستگاه است</p>

/* portrait /
@media screen and (orientation:portrait) {
/
portrait-specific styles /
}
/
landscape /
@media screen and (orientation:landscape) {
/
landscape-specific styles */
}


<h2>` matchMedia `</h2>
<p>تابع ` matchMedia` امکان بررسی فعال بودن مدیا‌کوئری بصورت آنی را فراهم می‌کند و با استفاده از این تابع میتون با استفاده از کد‌های سی‌اس‌اس فوق سمت دستگاه را تشخیص داد</p>

// Find matches
var mql = window.matchMedia("(orientation: portrait)");

// If there are matches, we're in portrait
if(mql.matches) {
// Portrait orientation
} else {
// Landscape orientation
}

// Add a media query change listener
mql.addListener(function(m) {
if(m.matches) {
// Changed to portrait
}
else {
// Changed to landscape
}
});


<h2>بی‌ربط به داستان اصلی</h2>
<p>بحث تشخیص سمت دستگاه‌های همراه شد، بد نیست روشی ساده برای کسب اطلاعات بیشتر از دستگاه را نیز با هم ببینیم، مثلا اینکه آیا دستگاه حاضر از سری دستگاه‌های رتینای اپل است یا نه؟</p>

var deviceFix = function()
{
var pixelRatio = window.devicePixelRatio;
var screenWidth = screen.width;

//Retina
if( pixelRat >= 2 ){}

//iPhone 3gs, 3g, Edge
if( pixelRat < 2 && screenWidth === 320 ){}

}