IPB

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> How Do You Make Images In A %, Anyone know?
AllyGator
post Oct 17 2008, 04:34 AM
Post #1


Map Goddess
Group Icon

Group: Retired Administrator
Posts: 4,622
Joined: 3-July 06
From: Buya
Member No.: 3



http://www.nexusatlas.com/quests/minorquestlocations.php

So many people are asking where the new minor quest creatures can be found, I decided to put images on the page. I don't want to make the page huge so I decided to make the images smaller. If I put width and height as a % of the image size, the browser interprets it as a percentage of the page size making some images huge and others small. Like ogres are small and rats are huge.

If I put the width and height in pixels it is still screwed up because the images aren't a standard size.

I've searched around and haven't found anything that tells me that I can define images as a percentage of the original image size. I'm hoping one of you may know a way to do it.

Oh yeah, keep the images or not?


--------------------
The hair says it all!
Go to the top of the page
 
+Quote Post
AceoStar
post Oct 17 2008, 08:14 AM
Post #2


Oh san
Group Icon

Group: Retired Staff
Posts: 3,120
Joined: 3-July 06
Member No.: 2
Characters: AceoStar



Since the images are only a reference, I'd say just set them all to a standard pixel height and width.

If you want to get fancy you can use GD and resize them to a percentage on the fly, but I think thats overkill.

I don't think the current way looks bad either


--------------------
AceoStar, Imperial Guard of Buya.

Put www.StatAddict.com in your profile to track your stats today!


Learn to keep up


Errr, NF is filtered at work these days, I'll be checking the forums a lot less often.
Go to the top of the page
 
+Quote Post
PikuDamaru
post Oct 17 2008, 03:03 PM
Post #3


Sa san
Group Icon

Group: Nobles
Posts: 1,461
Joined: 3-July 06
Member No.: 9
Characters: PikuDamaru



The one thing to remember about HTML image resizing is that it will resize a dimension which is left blank proportional.

You could set the image width and let the height be generated proportionately or you could set the width and let the height be generated proportionately.

Give it a try. Make sure whichever dimension you want set proportional does not appear as an attribute in your <img /> tag.


--------------------
IPB Image IPB Image
Go to the top of the page
 
+Quote Post
Dritz
post Oct 17 2008, 04:34 PM
Post #4


Sam san
Group Icon

Group: Nobles
Posts: 750
Joined: 3-July 06
Member No.: 37
Characters: PyroAce



What browser is the problem in? The page looks fine to me but IE has trouble with things like this. As long as the container has a height or width you should be able to set any contents of the container with a percentage and it will be a percentage of the container.


--------------------
There I was
Go to the top of the page
 
+Quote Post
AllyGator
post Oct 18 2008, 01:20 AM
Post #5


Map Goddess
Group Icon

Group: Retired Administrator
Posts: 4,622
Joined: 3-July 06
From: Buya
Member No.: 3



I tried defining height and leaving width proportional. That seems to work pretty good. It keeps the images from being too big for the text.

I just wanted a way to make it perfect and I guess that doesn't exist. I looked at it via Firefox and IE and there's not much difference.

The image sizes vary according the the actual image in the game. It'd be a real hassle to go back and make all of them the same size. Can you imagine every mouse gif being the same size as Nngh'Zan? Owww!

So I guess I'll leave it as is until someone says to drop the images altogether. tongue.gif
Go to the top of the page
 
+Quote Post
Interstate
post Oct 23 2008, 02:55 PM
Post #6


Sam san
Group Icon

Group: Nobles
Posts: 905
Joined: 24-June 07
From: California
Member No.: 2,663



If you want it to be a percent of the current width and height:

Ex. 9% current width and height

CODE

list($width,$height,$type,$attr) = getimagesize("http://www.nexusatlas.com/image.jpg");
$newWidth  = $width*0.09;
$newHeight = $height*0.09;


Ex. 219% curent width and height

CODE

list($width,$height,$type,$attr) = getimagesize("http://www.nexusatlas.com/image.jpg");
$newWidth  = $width*2.19;
$newHeight = $height*2.19;



If you want the new height and width to be based off of a standard height or width:

Ex. all images to have standard 200 width

CODE

list($width,$height,$type,$attr) = getimagesize("http://www.nexusatlas.com/image.jpg");

//height/width = x/200
$newWidth  = 200;
$newHeight = ($height*200)/$width;



Ex. all images to have standard 50 height

CODE

list($width,$height,$type,$attr) = getimagesize("http://www.nexusatlas.com/image.jpg");

//height/width = 50/x
$newHeight = 50;
$newWidth  = ($width*50)/$height;


--------------------
Vicious Circle
Hater of haters
Anti-elitist elitist

http://www.youtube.com/watch?v=BwL65cvzK0s...feature=related
Go to the top of the page
 
+Quote Post
PikuDamaru
post Oct 24 2008, 04:58 PM
Post #7


Sa san
Group Icon

Group: Nobles
Posts: 1,461
Joined: 3-July 06
Member No.: 9
Characters: PikuDamaru



^ PS. Make sure you wrap those codes within <?php ?> tags as that is PHP code.


--------------------
IPB Image IPB Image
Go to the top of the page
 
+Quote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

RSS Lo-Fi Version Time is now: 28th March 2024 - 03:48 PM
Nexus Forums is part of: Nexus Atlas © all rights reserved.