Resizing Pictures

This is a discussion on "Resizing Pictures" within the Web Page Design section. This forum, and the thread "Resizing Pictures are both part of the Design Your Website category.


 Subscribe in a reader

Go Back   Webforumz.com > Main Forums > Design Your Website > Web Page Design

Notices




Reply
 
LinkBack Thread Tools
  #1  
Old Dec 13th, 2006, 15:55
Reputable Member
Join Date: May 2006
Location: Northampton, UK
Posts: 399
Thanks: 0
Thanked 0 Times in 0 Posts
Resizing Pictures

Im calling some pictures from my database with the following code;

Code: Select all
echo "<ul id='thumbs'><li><a href='#nogo'><img src='". $row['picture']. "'></a></li></ul>";
The problem is that the pictures display at full size, and i want to display them at a smaller "thumbnail" size.

How would i go about styling this list to display the images at a smaller size?

Thanks guys
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote

  #2  
Old Dec 13th, 2006, 16:02
Reputable Member
Join Date: May 2006
Location: Northampton, UK
Posts: 399
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Resizing Pictures

sok i got it

Code: Select all
ul#thumbs {
    padding:0;
    margin:0;
    width:64px;
    height:48px;
    position:relative;
  }
#thumbs li {
  list-style-type:none; 
  width:64px; 
  height:48px; 
  float:left; 
  z-index:100;
  }
 #thumbs a {
  position:relative; 
  width:64px; 
  height:48px; 
  display:block; 
  float:left; 
  z-index:100; 
  cursor:default;
  }
#thumbs a img {
  position:relative; 
  width:62px; 
  height:46px; 
  border:1px solid #FFFFFF; 
  z-index:100;
  }
does the trick
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #3  
Old Dec 13th, 2006, 18:02
Elite Veteran
Join Date: Aug 2005
Location: That Place
Posts: 2,044
Blog Entries: 1
Thanks: 0
Thanked 37 Times in 37 Posts
Re: Resizing Pictures

You should have a thumbnail version of each image also in the database with a link to the full size one.
__________________

Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #4  
Old Dec 13th, 2006, 19:33
Reputable Member
Join Date: May 2006
Location: Northampton, UK
Posts: 399
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Resizing Pictures

I dont need one if i use the above method.... saves on disk space
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #5  
Old Dec 13th, 2006, 20:15
Reputable Member
Join Date: Jul 2006
Location: Scotland
Age: 22
Posts: 357
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Resizing Pictures

ooh, but it's bad web practice!

Generally - if it's an image that they have to click/perform an action on, to make bigger then you should provide a thumbnail to save user load time...

It's all about the users time/storage, not ours!


Snow
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #6  
Old Dec 13th, 2006, 23:51
Ryan Fait's Avatar
Elite Veteran
Join Date: May 2006
Location: Las Vegas
Posts: 3,787
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Resizing Pictures

Yeah, it's very bad not to have thumbnails. Besides, they're only a few Kb.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #7  
Old Dec 14th, 2006, 08:16
Reputable Member
Join Date: May 2006
Location: Northampton, UK
Posts: 399
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Resizing Pictures

Remember, these pictures are uploaded by the users themselves .. not me...... and i really dont fancy the idea of editing and resizing every pic that everybody uploads into a thumbnail..... besides the pics all need to be used dynamically, i cant think of an instance where these particular images will be used in plain html.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #8  
Old Dec 14th, 2006, 10:44
Ryan Fait's Avatar
Elite Veteran
Join Date: May 2006
Location: Las Vegas
Posts: 3,787
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Resizing Pictures

PHP could do that for you easily. Do a google search on PHP resize.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #9  
Old Dec 14th, 2006, 11:23
Reputable Member
Join Date: May 2006
Location: Northampton, UK
Posts: 399
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Resizing Pictures

yeah i looked into that.

I might change it eventually ....... but ive got so much to do right now its gonna have to move down the list, just below designing a logo.

Bugger .... gotta register a domain

/me runs off
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #10  
Old Dec 14th, 2006, 18:05
Ryan Fait's Avatar
Elite Veteran
Join Date: May 2006
Location: Las Vegas
Posts: 3,787
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Resizing Pictures

It seems like it would be so much less work to do it now, rather than later. In fact, I take it back, you don't even need to upload a thumbnail, you can just use PHP to resize the full one as the thumbnail on the fly. A 10 line PHP script and you're done.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Reply

Tags
img

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Pictures VanessaJW Webforumz Cafe 36 May 22nd, 2007 16:15
resizing.... jjgamepro17 Web Page Design 3 Apr 18th, 2007 20:22
php uploading pictures Accurax PHP Forum 16 Dec 18th, 2006 11:20
gap between pictures maksinx Graphics and 3D 9 Aug 15th, 2006 17:19
Postin Pictures franknu PHP Forum 5 Jun 24th, 2006 15:51


All times are GMT. The time now is 15:30.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42