Page 1 of 1

JS make image screen size upto a certain size. (Solved)

Posted: Thu 04 Feb 2016, 17:13
by chapchap70
I embedded a script into my website so I can have a rotater. The script is located at http://www.htmlgoodies.com/beyond/javas ... b-Site.htm

My website is http://www.globalwarmingllc.com

The script unmodified works well on large screens but doesn't fit in mobile devices. I had trouble modifying it I am using a templated design with CSS and the metatags I found to fit across all devices didn't work. I finally used something like "image: full" and it works nicely on mobile devices now. The problem is it doesn't need to be that big on desktop monitors. (Although I have to say, my artwork is exquisite) :!: :lol:

Is there a simple way to use the image full idea only up to the actual size of the image (say 500X600 pixels) and have it centered on the page?

Posted: Thu 04 Feb 2016, 19:56
by gcmartin
Hello @ChapChap70

As far as I know, and that's very little in web design, at the server side you detect the device on the other side where you will then generate the appropriate format; mobile/non-mobile. This is often seen where a "some-site" URL you type on your mobile device is changed to 'm.some-site.." because of that detection sequence.

Hope that helps.

P.S. Your participation is requested, here.

Posted: Fri 05 Feb 2016, 07:10
by gungsukma
<img src="..." style="max-width:500px; max-height:600px;"/> ?

Posted: Fri 05 Feb 2016, 16:56
by L18L
I would try

Code: Select all

<img src="..." style="max-width:500px;"/>
or

Code: Select all

<img src="..." style="max-height:600px;"/>
or
em
or
%

Posted: Sun 07 Feb 2016, 03:42
by chapchap70
Thanks guys.

I used the max-height option to squish the images so people don't have to scroll up and down to see the whole image. I was putting max-height in the wrong spot.

The images stretch across the page but they are stick figures. Good enough!