Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Aug 2007
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    How do i scale image to fit to page width ?

    Ive seen this on imagehosting sites like imagevenue & imageshack. I have a html page in which i need to have it done. Currently i have to define the image width & height which i do not actually want to do as i want to have large images on the page (its a picture gallery) .

  • #2
    New Coder
    Join Date
    Jul 2007
    Location
    USA
    Posts
    83
    Thanks
    6
    Thanked 7 Times in 7 Posts
    You can define height and width as percentages. Ex:

    img {height: 60%; width: 60%;}

    I googled and found the following examples so you can see it in action:
    Scalable Figures (http://rjohara.net/server/css-figures-captions/)

  • Users who have thanked lithriel for this post:

    bollywoodguru (08-20-2007)

  • #3
    New to the CF scene
    Join Date
    Aug 2007
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    thanks for the response buddy but i guess you missed my point, i want the images to be shown full sized , however i want them to scale to page as then the people can see the ads on the page, when clicked on image it blows up to its original size.

    take a look here

    http://img15.imagevenue.com/img.php?..._122_708lo.jpg

  • #4
    New Coder
    Join Date
    Jul 2007
    Location
    USA
    Posts
    83
    Thanks
    6
    Thanked 7 Times in 7 Posts
    Well I don't know of any way to do that with CSS off the top of my head but I know you can do it with other things like javascript. I'm no expert on javascript (I personally avoid it) but others on here may be able to offer a better solution for you. I've seen this technique done with thumbnails that expand to full size when clicked. Google "expanding thumbnails" or some similar phrase and you should find what you need.

    Also The Java Script Source (http://javascript.internet.com/) had some cut and paste scripts to do this last I checked (5 years ago or so).

    There still might be a way to do it with CSS/XHTML. Sorry I couldn't help you. Thanks for the thank though.
    Last edited by lithriel; 08-20-2007 at 05:57 PM. Reason: grammar


  •  

    Posting Permissions

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