Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Resiz images according to screen resolution

Status
Not open for further replies.
112345543211

112345543211

IS-IT--Management
Jul 6, 2011
1
AZ
Hi All!
I have a web application with an aspanel, users can add images, the program automatically make the thumbnail. when user click on thumbnail they can see a pop up modal page.

Images are in different sizes, so what I need to achieve is to get the screen resolution or browser visible area and re-size the image according to this resolution. (users could have different type of computer screen with different resolution), I need a JavaScript or jquery code.

Thanks in advance
 
Sort by date Sort by votes
Resize them for what?

If you are displaying them full screen why do you need to find the dimensions? Why not simply set them to be 100% of their container's width and height. Assuming that to be the <body> element a regular image tag will stretch to fit the browser window.

If the images are smaller than the screen size, or the the browser window in set to some extreme dimensions like 1200px by 40px the results would be a completely undefinable garble of pixels. Additionally the up scaling of images smaller than the browser window will cause pixelation, and unexpected artifacts.

I would suggest you rethink the need to have an image fill the browser window.

But if its absolutely necessary, you could attempt to use window.innerWidth, and window.innerHeight.









----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
383
Kennelbloke
Kennelbloke
lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
315
lexer
lexer
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
355
xwb
xwb
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
277
Rayj0000
Rayj0000
penguinspeaks
  • Locked
  • Question
How do I pass a classic asp variable to JS
Replies
1
Views
484
xwb
xwb

Part and Inventory Search

Sponsor

Back
Top