Log in

View Full Version : Image height not working in firefox


jzhang1013
08-30-2009, 11:21 PM
Hey guys for some reason the image height isn't get adjusted in firefox and my img.js isn't working on any browser...


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>1013MM: Photography by John Zhang</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="1013MM: A photography portfolio by John Zhang, a freelance photographer currently available for projects in the Los Angeles area." />
<meta name="keywords" content="photography, portfolio, cameras, photo, dslr, nikon, freelance, los angeles, socal, southern california, la, john zhang, portrait, events" />
<meta name="robots" content="all,index,follow" />

<link rel="shortcut icon" href="images/favicon.ico">
<style>
html {
padding:;
}
body {
background:#000000 url('images/load.gif') no-repeat center center;
*** padding:0;
*** margin:0;
}
img {
border:0;
}
#container {
padding-top:-4px;
padding-left:-7px;
margin-top:-4px;
margin-left:-7px;
}
#container img {
margin-top:-4px;
}
a:active, a:focus {
outline: 0;
}
</style>

<link rel="stylesheet" type="text/css" href="css/highslide.css" />
<script type="text/javascript" src="js/highslide.php"></script>
<script type="text/javascript" src="js/img.php"></script>

<script type="text/javascript">
hs.graphicsDir = 'graphics/';
hs.outlineType = 'rounded-black';
hs.outlineWhileAnimating = true;
</script>


</head>

<body>

<div id="container" width="100%">
<div width="100%">
<a href="info.php" class='highslide' onclick='return hs.expand(this)'><img src="images/logo.png" height='6%'/></a>
<?php
$dirname = "./thumb";
$images = scandir($dirname);
$ignore = Array(".", "..", "error_log");
foreach($images as $curimg){
if(!in_array($curimg, $ignore)) {
echo "<a href='./full/$curimg' class='highslide' onclick='return hs.expand(this)'><img src='./thumb/$curimg' height='6%' /></a>";
};
} *
?>
</div>
<div width="100%">
<a href="info.php" class='highslide' onclick='return hs.expand(this)'><img src="images/logo.png" height="6%"/></a>
<?php
$dirname = "./thumb";
$images = scandir($dirname);
$ignore = Array(".", "..", "error_log");
foreach($images as $curimg){
if(!in_array($curimg, $ignore)) {
echo "<a href='./full/$curimg' class='highslide' onclick='return hs.expand(this)'><img src='./thumb/$curimg' height='6%' /></a>";
};
} *
?>
</div>
</div>
</body>
</html>

Working link is here to see.... (http://1013mm.com/test/)

And i know i could just resize all my image heights, but I want to have that size just in case and make them future proof... and fixed height will mess up on small browser resolutions... The script that doesn't work is a fade in image script.

Thanks!
bluewalrus
08-31-2009, 12:10 AM
Try switching your image tags around like this:

<img src="./thumb/$curimg" style="height:6%;" />
jzhang1013
08-31-2009, 12:23 AM
a px height will work but why not a % size in FF???
JShor
08-31-2009, 01:50 AM
Well, bc it's not valid html. FF uses valid content, unlike ie which is liberal [which is a bad thing]
jzhang1013
08-31-2009, 02:17 AM
Well, bc it's not valid html. FF uses valid content, unlike ie which is liberal [which is a bad thing]

so whats a fix? it works in safari and chrome.... :(
JShor
08-31-2009, 05:24 AM
Well, the percent won't work. period. there's no way to get a percentage width, and expect it to work on all browsers.

Can you try making it a fixed width?
jzhang1013
08-31-2009, 05:57 AM
Well, the percent won't work. period. there's no way to get a percentage width, and expect it to work on all browsers.

Can you try making it a fixed width?

stupid me i messed up the div coding it works fine now.

But the main problem now is the img.php script wont work. it's supposed to delay the display of images so that they each fade in but it doesnt work for some reason. why is this?