Name of a technology

fulio pen

unread,

May 9, 2013, 8:03:43 AM5/9/13

to

When opening a web page, there are many small pics. in it, and
clicking one of them will get it enlarged, so can be viewed better.
Closing this large pic. will bring the page with many small pics.
back, so another one can be selected.

What is the name of this technology? Thanks for the information.

fulio pen

Jukka K. Korpela

unread,

May 9, 2013, 9:03:47 AM5/9/13

to

The small pics are commonly called "thumbnails", though the idea is just
that a small version of an image is a link to the full version, in a
broad sense of the word "link". So it could open the full image in a new
window, or in a frame (possibly inline frame), or in the same window (so
that the user needs to use the Back function of his browser).

Usually the smoothest setup is that the thumbnails have just a simple
JavaScript code associated with them, code that changes a larger image
on the same page simply by changing the src attribute of an <img> tag.

--
Yucca, http://www.cs.tut.fi/~jkorpela/

fulio pen

unread,

May 9, 2013, 11:00:39 AM5/9/13

to

Thanks a lot for the information. Further appreciate for recommending
some online tutorials on the skills. I like to learn it. Thanks
again.

fulio pen

fulio pen

unread,

May 9, 2013, 1:21:38 PM5/9/13

to

On May 9, 9:03 am, "Jukka K. Korpela" <jkorp...@cs.tut.fi> wrote:

> 2013-05-09 15:03, fulio pen wrote:
>
> > When opening a web page, there are many small pics. in it, and
> > clicking one of them will get it enlarged, so can be viewed better.
> > Closing this large pic. will bring the page with many small pics.
> > back, so another one can be selected.
>
> > What is the name of this technology? Thanks for the information.
>

> Usually the smoothest setup is that the thumbnails have just a simple
> JavaScript code associated with them, code that changes a larger image
> on the same page simply by changing the src attribute of an <img> tag.
>
> --
> Yucca,http://www.cs.tut.fi/~jkorpela/

Hi, Yucca:

I found a piece of software on the internet for this purpose, Its
name is IrfanView. Your method seems even simpler than IrfanView.
Change the size of image with Javascript. This is wonderful. Thanks.

fulio pen
.

Jukka K. Korpela

unread,

May 9, 2013, 3:48:40 PM5/9/13

to

2013-05-09 20:21, fulio pen wrote:

> I found a piece of software on the internet for this purpose, Its
> name is IrfanView. Your method seems even simpler than IrfanView.
> Change the size of image with Javascript.

What I meant was changing the src attribute value. You would still have
each image in two sizes, full size and thumbnail size, and IrfanView is
one way of creating the thumbnails.

If you have just the full-size images and let browsers construct the
thumbnails, then all the full-size images would have to be downloaded
before the thumbnails can be shown. This would make sense in an
application-like setup where the full images are always downloaded (or
available as part of delivered application), but not otherwise.

--
Yucca, http://www.cs.tut.fi/~jkorpela/

Ray_Net

unread,

May 9, 2013, 7:05:44 PM5/9/13

to

In article <kmgubr$lfp$1...@dont-email.me>, jkor...@cs.tut.fi says...

Perhaps a bad id is to change by javascript
from <img src="smiley.gif" alt="Smiley face" height="42" width="42">
to <img src="smiley.gif" alt="Smiley face">

So there is no need of Irfanview to contruct a thumbnail.

richard

unread,

May 9, 2013, 8:54:06 PM5/9/13

to

are you thinking perhaps of a "modal window"?

Gus Richter

unread,

May 10, 2013, 4:54:19 PM5/10/13

to

fulio pen

unread,

May 11, 2013, 3:18:37 PM5/11/13

to

Hello, Gus,

The websites are wonderful. Only html and css are employed. I really
like to learn the skills.

fulio pen

fulio pen

unread,

May 17, 2013, 6:58:24 AM5/17/13

to

Please open the following web page. The thumbnails and large pics.
are good enough for me.

http://sports.yahoo.com/photos/odd-and-premature-retirements-1368643658-slideshow/

fulio pen

Gus Richter

unread,

May 17, 2013, 7:59:01 PM5/17/13

to

On 5/17/2013 6:58 AM, fulio pen wrote:
>> Hello, Gus,
>> >
>> >The websites are wonderful. Only html and css are employed. I really
>> >like to learn the skills.
>> >
>> >fulio pen
> Please open the following web page. The thumbnails and large pics.
> are good enough for me.
>
> http://sports.yahoo.com/photos/odd-and-premature-retirements-1368643658-slideshow/

So, just use as per:
<http://www.cssplay.co.uk/menu/clickgallery.html#pic6>

Look at the source of the page - it's all there:

The stylesheet is in the Style element, within the head section.

The markup is in the div id'd as "info", within the body section.

Edit to your needs and using your pics.

--
Gus