How to AUTO ReSize an <IMG.../> element on a web page?

T

thisis

Hi All,

My problem is:

i have a web page/html that uses <img src="some img larger than the web
browser width/height ok" .../>.

the <img src="" ../> is very large in width/height than the web broswer
width/height.

i want to auto resize the <img src="" ../> so, when the pages finishes
to load,
the <img src="" ../> will fit/get in/show in the web browser.

- eg. in internet explorer, on some web sites when an image is greater
in width/height than the ie page a "thumb nail" is displayed
autonatically on the image itself, enabling the client to size up/down
the image in the ie web browser.


My Question is:

How to AUTO ReSize an <IMG.../> element on a web page?
 
B

Ben C

Hi All,

My problem is:

i have a web page/html that uses <img src="some img larger than the web
browser width/height ok" .../>.

the <img src="" ../> is very large in width/height than the web broswer
width/height.

i want to auto resize the <img src="" ../> so, when the pages finishes
to load,
the <img src="" ../> will fit/get in/show in the web browser.

- eg. in internet explorer, on some web sites when an image is greater
in width/height than the ie page a "thumb nail" is displayed
autonatically on the image itself, enabling the client to size up/down
the image in the ie web browser.

I suspect that's a feature of the website, not of Internet Explorer.
How to AUTO ReSize an <IMG.../> element on a web page?

You can just do

<img src="something.png" style="width: 100%">

which will fit the image's width to that of the viewport, and give it a
height that preserves its aspect ratio.

<img src="something.png" style="max-width: 100%">

is also possible.
 
D

dorayme

"thisis said:
Hi All,

My problem is:

i have a web page/html that uses <img src="some img larger than the web
browser width/height ok" .../>.

the <img src="" ../> is very large in width/height than the web broswer
width/height.

i want to auto resize the <img src="" ../> so, when the pages finishes
to load,
the <img src="" ../> will fit/get in/show in the web browser.

- eg. in internet explorer, on some web sites when an image is greater
in width/height than the ie page a "thumb nail" is displayed
autonatically on the image itself, enabling the client to size up/down
the image in the ie web browser.


My Question is:

How to AUTO ReSize an <IMG.../> element on a web page?

You can, by setting the width you want.

<img src="" width="600">

Better is

<img src="" width="600" height="400">

But, generally, it is a bad idea. Everyone has to download the
huge image (which the browser then sizes according to your dim
instructions) and this uses up the earth's resources (bandwidth),
it slows things down (especially for dialup) and the results are
probably not as good as the better alternative:

To prepare your image at the viewing size in an image editor,
thus making it smaller in file size. The superior quality is due
to that browsers have inferior algorithms (cruder) for resizing
than most image software.

The circumstance in which a larger pic is worth posting is where
you want to have images scale with text size. Let me put this
another way: The circumstance in which a larger pic is worth
posting is where you really want to have images scale with text
size.
 
D

dorayme

dorayme said:
You can, by setting the width you want.

<img src="" width="600">

Better is

<img src="" width="600" height="400">

But, generally, it is a bad idea. Everyone has to download the


Damn! You said auto... sorry! I will keep my text for when
someone does ask the appropriate question. I have read Ben's
reply by now and realised!

I am sure your very question was asked recently. And I recall
saying, to just <img src="" width="100%">... and the asker being
happy with this...
 
F

freemont

I suspect that's a feature of the website, not of Internet Explorer.

Nah, I remember what he's talking about. IE6, when displaying a large
image, will resize it to fit in the window, and when you hover over it,
several buttons appear for saving, printing, etc, including a button to
show the full size with scrollbars. I think there's an option to turn this
behavior on/off. Good ol' IE. ;-)
 
T

thisis

freemont said:
Nah, I remember what he's talking about. IE6, when displaying a large
image, will resize it to fit in the window, and when you hover over it,
several buttons appear for saving, printing, etc, including a button to
show the full size with scrollbars. I think there's an option to turn this
behavior on/off. Good ol' IE. ;-)

Hi All,

i did try testing the suggestion given here for element <img .../>
with attribute width=XXX% or/and height=XXX%, and non of them are
applicable in my case.

let me simplify my question into this:

i want to write a code just for internet explorer ok ?!

i want to fire/trigger the automatic resizing event for an <img .../>
element,
without using the height/width = xxx%, ok?!

i have a picture/image that is larger in height/width than the maxium
height/width of the ie, ok ?!

i want that the ie will display on the left side/down a small tab nail,
that allows resizing of the image, ok?!

an example:

http://www.fumettomania2000.com/Donal Duck .jpg

wait a few sec untill the page loads, and then move your mouse over the
down/left side of the image in order to see the resize thumb nail, ok?!

MY QUESTION IS:

HOW DO I DISPLASY THE "THUMB NAIL" in an HTML PAGE? OK?!!!

note: if you must be using microsoft internet explorer version 5.5 and
up, OK?!!!
 
F

freemont

MY QUESTION IS:

HOW DO I DISPLASY THE "THUMB NAIL" in an HTML PAGE? OK?!!!

note: if you must be using microsoft internet explorer version 5.5 and
up, OK?!!!

Dunno.

Hope this helps! OK?!!!
 
J

Jonathan N. Little

thisis said:
Hi freemont,

sorry, but the hopes didn't help me with this case.
any other suggestions>?


Write a Windows Application, that is what your really want anyway and
flip the bird to a third of your visitors. Look into MS's "wonderful"
ActiveX SDK
 
S

Steve Pugh

thisis said:
i did try testing the suggestion given here for element <img .../>
with attribute width=XXX% or/and height=XXX%, and non of them are
applicable in my case.

let me simplify my question into this:

i want to write a code just for internet explorer ok ?!

Don't expect much help from folks round here. We're more concerned with
writing code for the WWW.
i want to fire/trigger the automatic resizing event for an <img .../>
element, without using the height/width = xxx%, ok?!

Can't be done. The auto-resizing feature only works on images loaded by
themselves, not on images embedded in web pages.
i have a picture/image that is larger in height/width than the maxium
height/width of the ie, ok ?!

What is the maximum height and width of IE? Is it the same on my screen
as it is on yours?
i want that the ie will display on the left side/down a small tab nail,
that allows resizing of the image, ok?!

Can be done by throwing some JavaScript at the problem, but isn't as
easy as it may seem at first.
an example:

http://www.fumettomania2000.com/Donal Duck .jpg

wait a few sec untill the page loads, and then move your mouse over the
down/left side of the image in order to see the resize thumb nail, ok?!

That's not a page. That's loading a single image on its own. That is
what triggers the auto-resize behaviour in some browsers.
MY QUESTION IS:

HOW DO I DISPLASY THE "THUMB NAIL" in an HTML PAGE? OK?!!!

You can't with just HTML. And if you could then what would happen to
the rest of the page when the image was resized to its full size?

Think about the whole process that you want to create and then ask
yourself if it will really be useful for your users.

The simplest thing you can do is create separate thumbnail images for
embedding in web pages and link them to the full image on its own which
will be auto-resized in those browsers that support auto-resizing.
note: if you must be using microsoft internet explorer version 5.5 and
up, OK?!!!

Not okay.

Steve
 
T

thisis

Steve said:
Don't expect much help from folks round here. We're more concerned with
writing code for the WWW.


Can't be done. The auto-resizing feature only works on images loaded by
themselves, not on images embedded in web pages.


What is the maximum height and width of IE? Is it the same on my screen
as it is on yours?


Can be done by throwing some JavaScript at the problem, but isn't as
easy as it may seem at first.


That's not a page. That's loading a single image on its own. That is
what triggers the auto-resize behaviour in some browsers.


You can't with just HTML. And if you could then what would happen to
the rest of the page when the image was resized to its full size?

Think about the whole process that you want to create and then ask
yourself if it will really be useful for your users.

The simplest thing you can do is create separate thumbnail images for
embedding in web pages and link them to the full image on its own which
will be auto-resized in those browsers that support auto-resizing.


Not okay.

Hi Steve Pugh,

so much shit on this group, what a waste.













thanks for the answer.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
474,265
Messages
2,571,071
Members
48,771
Latest member
ElysaD

Latest Threads

Top