dcsimg
www.webdeveloper.com
Results 1 to 6 of 6

Thread: Crisp pictures

  1. #1
    Join Date
    Apr 2003
    Location
    Tidewater, Va.
    Posts
    9

    Crisp pictures

    Hi! Can anyone explain to me how I can take a digital photo saved as a jpg. 480x640 with a resolution at 300x300 and develope VERY CRISP thumbnails that load quickly which will point to the larger image, which I also want to be crisp and load quickly. Any thoughts as to which is the best image editing program to do this? Any special techniques I could tweak? Please help! Thanks! jnapier

  2. #2
    Join Date
    Jan 2003
    Location
    Peg City
    Posts
    638
    Try this, just edit it to meet your needs. Create thumbnails that are 50x50 pixels in a photo editor and place these images in the body tag. Then place your real images into the script.

    Havik

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Untitled</title>

    <script type="text/javascript">

    function popup(image) {

    switch(image) {
    case "image1":
    imagesrc='<img src="enter picture 1 url here (also enter the real width and height of the pictures)" width="480" height="600" border="0" alt="" onclick="window.close()">';
    imagewidth=480;
    imageheight=600;
    break;

    case "image2":
    imagesrc='<img src="enter picture 2 here (same for this width and height)" width="480" height="600" border="0" alt="" onclick="window.close()">';
    imagewidth=480;
    imageheight=600;
    break;

    default:
    imagesrc="Sorry, it appears the link is broken.";
    imagewidth=200;
    imageheight=30;
    break;
    }

    newwin = window. open('','','top=150,left=150,width='+imagewidth+',
    height='+imageheight+',resizeable=no');
    if (!newwin.opener) newwin.opener = self;
    with (newwin.document) {
    open();
    write('<html><head></head>');
    write('<body topmargin="0" leftmargin="0">' + imagesrc);
    write('</body></html>');
    close();
    }
    }


    </script>

    </head>

    <body>

    <a href="javascript::popup('image1')"><img src="picture 1 thumbnail" width="48" height="60" border="0" alt=""></a>
    <a href="javascript::popup('image2')"><img src="picture 2 thumbnail" width="48" height="60" border="0" alt=""></a>


    </body>
    </html>

  3. #3
    Join Date
    Apr 2003
    Location
    Tidewater, Va.
    Posts
    9

    crisp pictures

    WHEW! Thanks for your reply, even tho it's almost Greek to me. I'm pretty new at html, too. But I'll check it out. Another thing I really needed to know is how to make the thumbnails to be very clear and cris AND fast downloading, rather than the fuzzy versions I often see. Can you or someone also help me in that area?
    Thanks! jnapier

  4. #4
    Join Date
    Apr 2003
    Location
    Tidewater, Va.
    Posts
    9
    Hi Havik! I just tried the HTML code and couldn't get it to work. I did a print screen and am trying to send it with this reply. Can you see what the problem is? Thanks, jnapier
    Attached Images Attached Images

  5. #5
    Join Date
    Dec 2002
    Location
    Lake Havasu City, Arizona
    Posts
    527
    Your images will never be more crisp than the original. Changing its size larger or smaller either adds more pixels or takes some away. Meaning the detail is blurred one way, or lost the other way. The best digital images when taken, should be as close-up as needed to capture ezactly what you want to show. This way the pixels are not altered by sizing.

    The higher the resolution, the sharper the image and the longer it will take to load. So some sacrifices have to be made. You can't have them all. Which might be why you see what you do on the internet.
    You need good photos to start with, saved in the highest resolution, and a good program like PhotoShop to work with.

  6. #6
    Join Date
    Jan 2003
    Location
    Peg City
    Posts
    638
    Sorry, I haven't checked this post in awhile. I can't quite see what the error is (the picture isn't readable), but I know the code works so it's probably the way you entered the code.

    For some reason, the following line of code was automatically formatting incorrectly. There should be no spaces at all in this section:

    newwin = window. open('','','top=150,left=150,width='+imagewidth+', height='+imageheight+',resizeable=no');


    Havik

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles