Sponsor Message:
Non Aviation Forum
My Starred Topics | Profile | New Topic | Forum Index | Help | Search 
Any Html Experts Out There?  
User currently offlineANITIX87 From United States of America, joined Mar 2005, 3292 posts, RR: 13
Posted (7 years 5 months 4 weeks 21 hours ago) and read 2144 times:
Support Airliners.net - become a First Class Member!

Hey guys!

I am in the process of creating a website to display all my photography, since I have recently entered the DSLR world.

I have most of my site set up (albeit a preliminary version) and have found many very useful scripts online (from www.dynamicdrive.com). There is one thing, however, that I cannot figure out how to do, and there are no scripts for it.

Everybody uses different screen resolutions and browser window sizes. If I have my images set to a certain size (i.e. 1024x768) the images may not fit in a user's browser window, and/or may be too small for their screen. How can I make my images re-size themselves automatically so that they fit on the user's browser screen? Is it a browser-specific thing or is there code I can use?

Thanks!

TIS


www.stellaryear.com: Canon EOS 50D, Canon EOS 5DMkII, Sigma 50mm 1.4, Canon 24-70 2.8L II, Canon 100mm 2.8L, Canon 100-4
17 replies: All unread, jump to last
 
User currently offlineIFEMaster From , joined Dec 1969, posts, RR:
Reply 1, posted (7 years 5 months 4 weeks 21 hours ago) and read 2136 times:

Image resizing with HTML alone can't be done. It's possible to add scalability using Flash or Shockwave, but inefficient and effective only to a point. It can also be done using some javascript - there are example class scripts all over the place if you google.

However, most major browsers resize images automatically...

In Internet Explorer:

1. On the Tools menu, click Internet Options.

2. Click the Advanced tab, and then scroll down to the Multimedia section.

3. Select the "Enable Automatic Image Resizing" check box.

In Firefox:

1. On the Tools menu, click Options

2. Click the Advanced button

3. Select the "Resize large images to fit in the browser window" check box.

Not sure where it is Sahara or Opera or some of the others, but I'm sure they call contain the capability.


User currently offlineRichardPrice From , joined Dec 1969, posts, RR:
Reply 2, posted (7 years 5 months 4 weeks 21 hours ago) and read 2136 times:

Quoting ANITIX87 (Thread starter):
Everybody uses different screen resolutions and browser window sizes. If I have my images set to a certain size (i.e. 1024x768) the images may not fit in a user's browser window, and/or may be too small for their screen. How can I make my images re-size themselves automatically so that they fit on the user's browser screen? Is it a browser-specific thing or is there code I can use?

If you have the image open on its own, with no HTML on the same page, IE will resize it for you automatically. Firefox has an extension to do it and most sane people will have it installed.


User currently offlineNoUFO From Germany, joined Apr 2001, 7917 posts, RR: 12
Reply 3, posted (7 years 5 months 4 weeks 21 hours ago) and read 2109 times:

While you can resize you images, I suggest not to do so since it heavily spoils the quality. A browser is not Photoshop or similar, and does not know interpolation.

More important than the size (1024 x 768 is indeed very big) is

a) how good you are in using the JPG file format in order to significantly reduce the file size without reducing the quality too much.
Are you familiar with adding "noise" to your pictures to protect gradient colours?

b) The overall layout of your website. Many non-professionals add too many gimmicks and tinsel that distract from the pictures. Plus, the buttons are often too big, the colours too colourful the used fonts too arbitrarily chosen.

Even professional photographs generally don't present their pictures as big as you plan to do it.



I support the right to arm bears
User currently offlineNighthawk From UK - Scotland, joined Sep 2001, 5093 posts, RR: 35
Reply 4, posted (7 years 5 months 4 weeks 21 hours ago) and read 2105 times:

Quoting RichardPrice (Reply 2):

If you have the image open on its own, with no HTML on the same page, IE will resize it for you automatically. Firefox has an extension to do it and most sane people will have it installed.

You dont need to install an extension, firefox also automatically resizes images. I would create an HTML page with some thumbnail images, when you click on the image open the fullsize image (and not a page containing the image, ie your URL will be [a href="image.jpg"]link[/a]. That way the users browser will resize it automatically.

Alternatively I would design the page to be viewed fine on 1024x768, as almost 95%+ of users are using this resolution or higher.



That'll teach you
User currently offlineANITIX87 From United States of America, joined Mar 2005, 3292 posts, RR: 13
Reply 5, posted (7 years 5 months 4 weeks 21 hours ago) and read 2105 times:
Support Airliners.net - become a First Class Member!

Quoting RichardPrice (Reply 2):
If you have the image open on its own, with no HTML on the same page,

So you mean have the file in the folder for that be literally just the image? Something like:

html
head
!--blah blah blah--!
/head
body
center img src="aviationGEUPW.jpg" /center
/body
/html

(I have omitted the "<" and ">" as a.net reads it as code and shows nothing if I use them.)

??

TIS



www.stellaryear.com: Canon EOS 50D, Canon EOS 5DMkII, Sigma 50mm 1.4, Canon 24-70 2.8L II, Canon 100mm 2.8L, Canon 100-4
User currently offlineANITIX87 From United States of America, joined Mar 2005, 3292 posts, RR: 13
Reply 6, posted (7 years 5 months 4 weeks 21 hours ago) and read 2098 times:
Support Airliners.net - become a First Class Member!

Quoting NoUFO (Reply 3):
b) The overall layout of your website. Many non-professionals add too many gimmicks and tinsel that distract from the pictures. Plus, the buttons are often too big, the colours too colourful the used fonts too arbitrarily chosen.

I tried to be very basic while still having a striking look that's east on the eyes. The only colors I use are black, red, and white (Black for the background, red for title fonts, and white for other fonts). My buttons are simply text links, and are size 14 font. My thumbnails are 200 pixels wide, and the full-size images are .jpg format, uncompressed in PS2 (quality value 12), resized to 1024x768, and the pages they are displayed on have no links or anything, just the main title of the site and a small text item declaring that the images are copyrighted to me. Sound good? I've never tried making a site before.

TIS



www.stellaryear.com: Canon EOS 50D, Canon EOS 5DMkII, Sigma 50mm 1.4, Canon 24-70 2.8L II, Canon 100mm 2.8L, Canon 100-4
User currently offlineRichardPrice From , joined Dec 1969, posts, RR:
Reply 7, posted (7 years 5 months 4 weeks 21 hours ago) and read 2094 times:

Quoting Nighthawk (Reply 4):
You dont need to install an extension, firefox also automatically resizes images. I would create an HTML page with some thumbnail images, when you click on the image open the fullsize image (and not a page containing the image, ie your URL will be [a href="image.jpg"]link[/a]. That way the users browser will resize it automatically.

The default image manipulation routines in Gecko suck something chronic, which is why I and everyone I know have an ImageMagick extension installed. I must have mentally blocked the fact that FF does do it built in  Smile

Quoting ANITIX87 (Reply 5):
So you mean have the file in the folder for that be literally just the image? Something like:

No, just point a link at the image, dont have a page pulling the image in.

Eg:

Click Here!


User currently offlineANITIX87 From United States of America, joined Mar 2005, 3292 posts, RR: 13
Reply 8, posted (7 years 5 months 3 weeks 6 days 23 hours ago) and read 2041 times:
Support Airliners.net - become a First Class Member!

Quoting RichardPrice (Reply 7):
No, just point a link at the image, dont have a page pulling the image in.

Eg:

Click Here!

The link doesn't do anything, at least not for me. It just re-loads this page, haha. So I'm still a little bit confused on just how to do it.

Thanks for the advice, guys.

TIS



www.stellaryear.com: Canon EOS 50D, Canon EOS 5DMkII, Sigma 50mm 1.4, Canon 24-70 2.8L II, Canon 100mm 2.8L, Canon 100-4
User currently offlineRichardPrice From , joined Dec 1969, posts, RR:
Reply 9, posted (7 years 5 months 3 weeks 6 days 23 hours ago) and read 2036 times:

Quoting ANITIX87 (Reply 8):
The link doesn't do anything, at least not for me. It just re-loads this page, haha. So I'm still a little bit confused on just how to do it.

Whoa, thats just ... wierd.

That link was supposed to be code, not a link. Very much like this:

<a href="image.jpg"> Click here! </a>

[Edited 2006-10-24 20:15:20]

User currently offlineANITIX87 From United States of America, joined Mar 2005, 3292 posts, RR: 13
Reply 10, posted (7 years 5 months 3 weeks 6 days 20 hours ago) and read 2020 times:
Support Airliners.net - become a First Class Member!

Quoting RichardPrice (Reply 9):
Very much like this:

Thanks. It works just as I wanted it to, but there is one minor issue. One of the things I'm worried about it people stealing images off the site. I don't want to ruin them with watermarks or text on them, so I have found scripts online to disable right-clicking. If I tag images this way to open them by themselves, I can no longer disable right-click, can I? I assume not, since there would be nowhere to place the script.

Any advice?

Thanks.

TIS



www.stellaryear.com: Canon EOS 50D, Canon EOS 5DMkII, Sigma 50mm 1.4, Canon 24-70 2.8L II, Canon 100mm 2.8L, Canon 100-4
User currently offlineRichardPrice From , joined Dec 1969, posts, RR:
Reply 11, posted (7 years 5 months 3 weeks 6 days 20 hours ago) and read 2015 times:

Quoting ANITIX87 (Reply 10):
Thanks. It works just as I wanted it to, but there is one minor issue. One of the things I'm worried about it people stealing images off the site. I don't want to ruin them with watermarks or text on them, so I have found scripts online to disable right-clicking. If I tag images this way to open them by themselves, I can no longer disable right-click, can I? I assume not, since there would be nowhere to place the script.

Right clicking protection is trivial to get around. Unless you are going to go the whole hog of encapsulating the entire gallery in Flash, theres no foolproof way of protecting those images that cant be bypassed in less than 30 seconds.

Dont bother, is my advice.

If you want to protect them that bad, put the gallery behind a password protected entry barrier and only allow trusted people in.


User currently offlineCaptainJon From , joined Dec 1969, posts, RR:
Reply 12, posted (7 years 5 months 3 weeks 6 days 17 hours ago) and read 1996 times:

If you have a server with PHP you can use a tool called Gallery which can automatically generate thumbnails and resizes for you and show it full size for those that what to see the full size. http://gallery.menalto.com

User currently offlineANITIX87 From United States of America, joined Mar 2005, 3292 posts, RR: 13
Reply 13, posted (7 years 5 months 3 weeks 4 days 18 hours ago) and read 1973 times:
Support Airliners.net - become a First Class Member!

Thanks for the help, guys.

Here's the website, if you're interested. Not complete, but close to it.

http://www.tisdigital.com

TIS



www.stellaryear.com: Canon EOS 50D, Canon EOS 5DMkII, Sigma 50mm 1.4, Canon 24-70 2.8L II, Canon 100mm 2.8L, Canon 100-4
User currently offlineNoUFO From Germany, joined Apr 2001, 7917 posts, RR: 12
Reply 14, posted (7 years 5 months 3 weeks 4 days 17 hours ago) and read 1970 times:

Your thumbnails are no real thumbnails but the actual, big picture scaled down. Better make real thumbnails so the page will load much faster.


I support the right to arm bears
User currently offlineANITIX87 From United States of America, joined Mar 2005, 3292 posts, RR: 13
Reply 15, posted (7 years 5 months 3 weeks 4 days 17 hours ago) and read 1966 times:
Support Airliners.net - become a First Class Member!

Quoting NoUFO (Reply 14):
Your thumbnails are no real thumbnails but the actual, big picture scaled down. Better make real thumbnails so the page will load much faster.

I did it intentionally for the sole reason that if they are the full-sized images scaled-down, then when the user clicks on the thumbnail the large one is already loaded and shown instantly. Rather than having the user wait for the large image to load.

So you think having actual thumbs and waiting for the large one would be better?

TIS



www.stellaryear.com: Canon EOS 50D, Canon EOS 5DMkII, Sigma 50mm 1.4, Canon 24-70 2.8L II, Canon 100mm 2.8L, Canon 100-4
User currently offlineNoUFO From Germany, joined Apr 2001, 7917 posts, RR: 12
Reply 16, posted (7 years 5 months 3 weeks 4 days 14 hours ago) and read 1953 times:

Quoting ANITIX87 (Reply 15):
So you think having actual thumbs and waiting for the large one would be better?

Yes, that's the purpose behind thumbnails. Let's say you display twenty pictures and I want to see only five in full-size, I still have to wait for the twenty pics to load.



I support the right to arm bears
User currently offlineANITIX87 From United States of America, joined Mar 2005, 3292 posts, RR: 13
Reply 17, posted (7 years 5 months 3 weeks 4 days 3 hours ago) and read 1945 times:
Support Airliners.net - become a First Class Member!

Quoting NoUFO (Reply 16):

Yes, that's the purpose behind thumbnails. Let's say you display twenty pictures and I want to see only five in full-size, I still have to wait for the twenty pics to load.

Ok. I'll do that, then. Thanks for the advice!

TIS



www.stellaryear.com: Canon EOS 50D, Canon EOS 5DMkII, Sigma 50mm 1.4, Canon 24-70 2.8L II, Canon 100mm 2.8L, Canon 100-4
Top Of Page
Forum Index

This topic is archived and can not be replied to any more.

Printer friendly format

Similar topics:More similar topics...
Any Arisaka Experts Out There posted Sat Sep 17 2005 05:38:12 by L-188
Any Outlook Express Experts Out There? posted Fri Nov 25 2005 18:06:19 by 9VSPO
Any "Popular Mechanics" Experts Out There? posted Thu Nov 28 2002 07:37:50 by Tsv
Any Gay Pilots Out There Care To Chat posted Sat Aug 26 2006 07:08:26 by Swaguy27
Any Gringos Fans Out There? posted Fri May 26 2006 05:09:43 by Newark777
For All You Computer Experts Out There..... posted Sun Apr 30 2006 13:04:07 by Leigh pilgrim
Any Godzilla Fans Out There? posted Fri Apr 21 2006 18:52:56 by Alberchico
Any A-HA Fans Out There? posted Sat Apr 1 2006 04:06:16 by Alberchico
Any Spanish Speakers Out There? posted Wed Mar 22 2006 18:41:38 by Airlinerfreak
Any A.Net Musicians Out There? posted Sun Mar 6 2005 03:30:48 by PMN