Why does JavaScript display a width of 800px for the Motorola Atrix MB860 4G? Shouldn't it actually be 540px?

When developing my Mobile Web App, I encountered an issue with getting the screen width of different devices to fit the views dynamically.

I am puzzled by the fact that the Motorola Atrix MB860 is reporting a width of 800px despite having a resolution of 540x960. This inconsistency has left me confused as to why JavaScript is returning 800px instead. I conducted a test using this page: http://www.quirksmode.org/m/tests/widthtest.html

Testing the above page on various devices revealed that most of them reported the width correctly, except for the Motorola Atrix. For example, the Galaxy S2 showed 480px and the Nexus 7 displayed 1280px.

javascriptandroidweb-applicationsmotorolascreen-size

Answer №1

Discovering a strange quirk in the behavior of Android 2.3 led me to this insightful article:

Android v2.3, when viewed in a standard browser environment, exhibits some rather peculiar tendencies. Initially, its screen.width is fixed at 800 – indicating a virtual viewport instead of the actual physical screen size. However, once the document includes an XHTML-MP doctype or a restricted viewport (with any doctype), the width value will transition to the expected 320 or 480 by the time the document load event occurs.

To address this issue, try using window.outerWidth or setting the viewport width to device-width:

<meta name="viewport" content="width=device-width, user-scalable=no" />

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Encountered a communication error (1001) with Android Restlet HTTPS due to connection processing issues

I am facing an issue while trying to execute a get request using a servlet. I receive a Communication Error (1001) which says "Error while processing a connection." Here is the simplified code snippet I am using: Engine.getInstance().getRegisteredCli ...

androidgoogle-app-enginehttpsrestlet

Encountered a NodeJS error while attempting to locate information in a mongo DB: UnhandledPromiseRejectionWarning

In my MEAN stack application, I am working on implementing a login feature that includes social login functionality. When a new user attempts to log in using Facebook, I need to verify if their Facebook account is already registered in my MongoDB database. ...

javascriptnode.jsangularexpressauthentication

Press on the div to reveal its content at the clicked position

Hello, I have a query that I need help with. I currently have a basic table with buttons in columns that act as filters. When you click on one of these buttons, it opens up a form. https://i.sstatic.net/nuEpq.png What I am trying to achieve is to make t ...

javascriptjquerycssbootstrap-4

Having trouble getting the jQuery ajax POST method to function properly

Whenever I change the type to 'GET' in the following code, everything works perfectly. However, when I try to use 'POST', it just won't cooperate. ajaxPostTest.html... <html> <head> <script type="text/javascript" s ...

javascriptjqueryajaxpost

Should a lengthy process be initiated upon the beginning of the web server?

After being away from web development for about 6/7 years, I find myself quite lost on how to proceed. While going through tutorials on HTML5 and such, I was hoping to receive some guidance here. Currently, I am working on creating a proof of concept (POC ...

c#asp.netasp.net-mvcweb-applicationsweb

What is the best method for retrieving environment variables within a React JS web application?

Within my render method, I am trying to access a specific environment variable. However, because it is a custom ENV variable, I cannot utilize (process.env.NODE_ENV). According to this source, React filters all process.env access. What would be the best w ...

javascriptnode.jsreactjswebenvironment-variables

Leveraging the outcome of a for loop in order to set a condition within an else if statement

How can I condition my third else if statement based on the result of a for loop? //If player clicks centre on first move go in corner square if (current[4] === playerToken && this.state.stepNumber === 1) { let move = c ...

javascriptloopsif-statement

The challenge of Cross-Origin Resource Sharing with AjaxSubmit compared to a traditional Ajax request

My dilemma involves two applications interacting on Google's App Engine, each operating within its own domain. To enable communication between them, I have successfully implemented CORS in Python using the following code: self.response.headers.add_he ...

javascriptjqueryajaxcors

Retrieving variables from a function within a structured framework

I am attempting to create a custom "struct" and utilize it in a similar way as I would in another programming language such as Swift. Below is the definition of the "struct": var myStruct = function (prop1) { this.prop1 = 30; } My attempt to access p ...

javascriptjquerycss

How about incorporating a loading animation for form submission?

While my code is running some calculations, I want the submit button to change from the current "RUN" state to a loading gif that I have. Clicking the RUN button should trigger a specific script to run and calculate various data, returning the results to t ...

javascriptjqueryhtmlajax

Validate selected checkbox using JavaScript

Is there a way for me to achieve real-time updates when checking and unchecking multiple checkboxes in a list? Here's the code snippet I currently have: window.onload = function () { var input = document.getElementById('listTaxi'); fu ...

javascriptjquerycheckbox

I am currently dedicated to enhancing my background transitions and experimenting with creating smooth fade-ins

I'm almost done with my Weather Forecast page for the FCC challenge. However, I'm not satisfied with how the code for swapping the background works. It just doesn't feel right to me. Unfortunately, I can't figure out how to fix it. Addi ...

javascriptjqueryhtmlcss

Running Windows commands from Node.js on WSL2 Ubuntu and handling escape sequences

When running the following command in the CMD shell on Windows, it executes successfully: CMD /S /C " "..\..\Program Files\Google\Chrome\Application\chrome.exe" " However, attempting to run the same comman ...

javascriptnode.jsbashcmdwindows-subsystem-for-linux

What is the best way to showcase data in a linear HighChart format?

I've been attempting to generate a linear chart using highChart, but despite multiple attempts, the chart remains blank. Here's what I've tried so far: <script> $(document).ready(function() { var options={ chart: { ...

javascriptajaxhighcharts

Why does the image return an Undefined Value when clicked? Is there a solution to this issue?

Every time I click on an image, I encounter the error message "undefined." Can someone please shed some light on why this is happening and provide guidance on how to successfully retrieve and pass the value to the onclick function in this particular scen ...

javascriptjquerynode.jsjquery-ui

Problem Parsing JSON String Containing Backslashes in JavaScript

I recently converted a C# class to a JSON object and then proceeded to stringify the JSON Object. However, during this process, the string was converted with backslashes as escaping characters. Subsequently, when attempting to read the JSON string using th ...

javascriptjsonescapingbackslash

`Can you teach me how to dynamically load HTML elements using input JSON data?`

What is the best way to iterate through an input array of objects? I currently have data for only 2 people included. However, there are more than 50 people's information in the input and I need to loop through all of them. Here is a sample code snip ...

javascriptjqueryhtmljsonecmascript-6

Events related to SVG elements

I have a unique situation where a div containing multiple SVG elements that act as buttons is added to the page after the user interacts with it. I am trying to add events to these SVG elements using event delegation, where I inspect the target of the even ...

javascripthtmlsvg

I'm currently working on storing my data in a Node.js REST API, but I keep encountering an issue with the error message "req.status is not a function"

router.post('/savedata',function(req, res){ console.log(req.body); var data={ firstname:req.body.firstname, lastname:req.body.firstname, password:req.body.password, email:req.body.email, created:req ...

javascriptnode.js

AngularJS traditional navigation rather than using $location.path

While working in controller A, I used $location.path('/home') for redirection. However, I realized that I needed a normal redirect as $location.path does not reload the page. I am aware that in ui-route, we have $state.go({reload:true}) for this ...

javascriptangularjs