I would like to know if there is the possibility to set screen resolution when debugging web application.
For instance, I usually work with a 1600x900 screen size, but the customer requirement is fixed on 1024x768 resolution.
My desire is to start debugging in the browser setted to this resoluton, for the time of the debug.
Is it possibile ? Or there is some tool that allow this kind of behaviour ?
Thanks
You can try a browser plugin like https://addons.mozilla.org/en-US/firefox/addon/web-developer/ that will allow you to quickly change the resolution of the the browser your are debugging in. There's one for Chrome too (https://chrome.google.com/webstore/detail/idhfcdbheobinplaamokffboaccidbal) and I'm sure other browsers allow you to do this too.
This may not work automatically, but you can quickly switch back an forth between resolutions.
You can leverage the Windows API to try to set screen resolution from your program, if the DEBUG constant has been defined: http://dotnet.mvps.org/dotnet/faqs/?id=setscreenresolution&lang=en. However, if you have to terminate the debugger, your screen will remain set to the debug resolution. You also shouldn't release the "debug" configuration of your app without first commenting out the resolution change.
Usually, changing the screen res is something a desktop app should never do. However, it makes a certain amount of sense here, so just make sure the released builds don't do this.
Firefox offers a plug-in to test a website in different resolutions, but this is just testing it with one particular browser. http://www.makeuseof.com/tag/3-firefox-plugins-test-website-resolutions/
Related
I am developing website and it has to be viewed in tablet pc. Please suggest me what are things to be considered ? technology wise ?
also i need to know what are the tools i need to have to view in my intranet as well as.
A major issue: in many tablets there is no moving pointer - at least not in a fully usable form. That means that tooltips may not really work, and image maps must be really clear, since there is no highlighting until the user actually "clicks" on the link.
Well, actually that's not fully accurate - if the user drags the pointer, it should work like a regular mouse pointer. The problem is that most users avoid dragging and just tap where they want to click directly.
Best piece of advice I can offer: get an actual tablet PC and try browsing your site. Most major issues will be evident almost immediately. If you are able, get a regular tablet/pad user to beta-test your site without trying it out on a desktop PC - they would be able to see issues that you would miss due to your prior knowledge of the site.
The Tablet PC is a standard Windows machine, therefore it has the same browser support as any other Windows box. So there isn't any special technology required.
There are however some design considerations:
First, make sure your layout has plenty of empty space surrounding iterative elements. Crammed pages are tough to navigate with a stylus, and if it is one of the newer models that also support touch it is even more of an issue.
Second, most Tablet PCs are configured with the default font size set for 125%. You want to make sure that your web pages scale correctly and don't end up requiring horizontal scrolling to see the full width of the page.
A second point regarding scaling, Tablet PC supports both Landscape and Portrait modes. In other words, it can be 1024x768 OR 768x1024. You'll want to make sure that your user experience is acceptable in both modes.
One thing i can think of : there is no 'hover' on most tablets, and if it's there at all, likely nobody will see it.
Not all tablets support flash, but they do all support javascript, and Prototype.JS or jQuery will run on them in most cases
Im trying to implement a mini browser in adobe air. The browser should work in the same ways as a mobile phone browser, i.e. fit the width of the website to a certain width(specified within the html component) and leave the height to be scrollable.
I have managed to do a mini browser by using the scaleX,scaleY properties of the mx:HTML component however these make the websites look unreadable.
I have also tried setting the css3 zoom property, and that works fine, but it only zooms out certain elements, therefore messing up the site layout.
My question is: Is there a way to make a mini web browser which shows the full content of the website?
Thanks for your help
Air browser cannot be scaled without have an horrible look (no anti-aliasing).
A few years later but here is what I ended up doing:
The requirement was to show the full website that person B was looking at so that person A could guide them through the site. Due to all the limitations of the Adobe AIR Browser we ended up using IECapt (http://iecapt.sourceforge.net/) within an external process to capture the screenshot and send it back to AIR.
This is all well and good, but IECapt is quite out of date as well so recently we have started to look at the using Chromium (http://www.magpcss.net/cef_downloads/) as an ANE within our application and with that we can alter the zoom and dimensions of the page while still being able to keep it up-to-date.
how can I replace screen resolution when accessing some site from script? Is it possible to acces such data when own script connects to the server?
To give a very definitive answer:
You cannot change a user's screen resolution via the browser.
You cannot retrieve a user's resolution as part of any ordinary HTTP request. (i.e.: in PHP's $_POST superglobal)
You can retrieve a user's screen resolution using JavaScript, which can then be passed back to the server via AJAX.
As a best practice, your website should be resolution independent by means of a fixed, fluid, or elastic layout. Changing a user's resolution is a frustrating experience for users and makes a project operate badly.
Keep in mind, also, that many platforms cannot have their resolutions altered. Most mobile devices, embedded platforms, and video game consoles have fixed resolutions. Also, projectors and televisions usually have very specific resolutions at which they function properly, so adjusting the resolution on these devices would likely wreak havoc.
As an alternative to adjusting screen resolution, check out em-driven layout. An em is a unit of measure in CSS that is relative to the current font. This allows you to dynamically adjust the sizing of your layout and its contents by adjusting the font size of the document (a larger font size will increase the pixel-for-pixel sizes of everything else on the page).
It should be noted that adjusting resolution can be accomplished via ActiveX on Windows, but only after multiple security warnings (and it only works on Windows in IE). This should not be attempted under any circumstances.
Here is my answer if I understood your question correctly. It is not possible to change screen resolution for a user when he/she accesses your site.
Are you saying that the site is changing its behavior based on what it thinks the user's screen resolution is? That's a) bad behavior, and b) client-side, so done with JavaScript or an ActiveX control or the like.
If you want your script to mimic that, it'll have to interpret the JavaScript, run the ActiveX, or whatever.
Sites don't have their own "screen resolution". They're rendered to whatever size the browser is at. That's part of the beauty of HTML.
Back in the past,
i found a third party webpage that was able to capture and save images of my website in different resolutions and browsers. Of course i have no more that bookmark...
So is there any webpage or application where i can see how my webpage looks like in different resolution?
And here are the resolutions i would like to check for..
1. 1024x768 24.56%
2. 1280x800 22.06%
3. 1280x1024 13.42%
4. 1366x768 7.10%
5. 1440x900 6.68%
Perhaps you're thinking of http://browsershots.org/ ?
Note that the screen resolution of the computer running the browser is only half of the truth. If the browser isn't maximized, it will be a lot smaller than the resolution you see there, and on non-Windows operating systems (Mac OS X, Linux) it's a lot more common to run applications non maximized.
It's simply best to make sure that your site is viewable in anything from small windows (just resize your browser down) to large.
If you want to check various resolutions and browsers, then BrowserShots may have been what you came across before, give it a look.
For viewing which percentage of people sees how much of your web page:
http://browsersize.googlelabs.com/
Also: Web Developer plugin for Firefox (Resize menu).
Chrome Extension and Firefox add-on to resize your browser to various standard resolution sizes...
There is one more online tool called ScreenFly which is very good and you can even check for tablets, TVs, mobiles.. screenfly
There are many utils available for watching your website in different resolutions.
Some are installed on PC, some are online services like these:
Adobes "render browser" - you'll need to create a free Adobe account:
http://browserlab.adobe.com
Nice, but not free if you want it fast as I recall it:
http://browsershots.org/
Google - shows what part of your website is visible based on statistics from Google:
http://browsersize.googlelabs.com/
But as far as I know, todays most commonly design resolution is 1024x768, eventhough the height isnt that important because of the popular scrollwheel on most mice/pads.
If you design to design for this resolution there is a lot of design help in the "growing standard" called 960 grid, which is based upon how many professional designers build a design.
You always make an invisible "grid" and then you use the cells to arrange the contents. Much like the old "table" system, but much more focused on professional designs.
Regarding your question, the % you list, seems like you would have most use of the "Google" link above.
Lastly, always remember to test how your website looks with the most used browsers. For me those 4 will be:
Internet Explorer (latest and previous version, use more than one computer to test if you cant do a double installation of it)
Mozilla Firefox (latest and perhaps previous.. but they make less changes in the render, so latest would be ok)
Google Chrome (awesome debugging tools too, and a very stable browser)
Safari (so you make sure that you support MacOSX)
Thats my opinion.
The Multibrowserviewer is a great (paid for) tool for multi browser support, I know it's not free, bt worth looking into even just for the trial period.
I'm working on something that needs a webpage to go full screen. The screen must become completely white.
Is there anyway that I can do this without flash or silverlight?
Thanks in advance
edit: Im not trying to force anybody into fullscreen, this will be mainly used by a couple of people. Even so I'll give proper feedback on how to get in and out of fullscreen .
You cant do full screen, because of security reasons the title bar is still there and so on in different browsers.
But a way could be to make the window larger than the screen, lets say 100 pixels wider and 100 pixels higher and position the window at -50, -50. I havent tried that but if there is no restrains against window size being bigger than screen size it could be a solution.
With JavaScript:
window.open ("http://stackoverflow.com", "","fullscreen=yes");
The size of the window varies between browsers, but actually in IE, you will have the desired behavior...
Please dont resize the user's web browser. I use the rest of my screen for other things, and I think many users do too. A respectful website stays where the browser puts it.
"Something like ajax for example?"...
Ajax != Javascript.
Your responsibility as a web site operator is to have some manners and allow the user to control the size.
You could read the screen.width and screen.height and if they are far off the document.body.clientHeight or document.body.clientWidth, alert the user that the page should be viewed in fullscreen mode and how to make it fullscreen (F12 for IE - i think, F11 for FF).
No, you can't control the browser in that way with javascript.
You can instruct your users to use firefox 3, and press F11 to enter full screen mode. the title bar will go away if the mouse isn't near the top of the screen.
Yes, it requires user interaction, but if they want to go into full screen then it's easy for them to do so under their own power, and to leave again when they want to.
-Adam
Well, I see that you are trying to simply have a button that will make the page full-screen; similar to the youtube full screen mode.
As well, I do NOT suggest using the "just hit F11" method, as people on Safari, or Mac in general, will be excluded.
You can use C#, which can be done by downloading Visual Studio or MS Visulal C#, or even CosmosBoot. There is plenty of code for full screen applications in C#. Another good thing about full screen in C# is that it can be easily embedded into a webpage, through some simplye ASP code.
You can use java, which can be painfully slow, and require a lot of coding, but it is attainable. You can use one of several hundred IDEs or JDKs, but I don't really use java, so I can't give you much in the way of advice on programming it, but it is EVEN EASIER to embed than C#, all you need is the tag.