I'm completely new to web design and I'm creating a site using dreamweaver. I want the home page to fit exactly into the web browser window. There isn't a great deal of content on the home page so I could do it if there's a way of making an image appear at the bottom of the web browser no matter the size. I've tried adjusting the alignment but there's a gap between the bottom of the image and the bottom of the web browser. Ive also tried making the image bigger so it hangs over (hoping the overlap would then be just cut off). This just extends the size of the page so that a scroll bar appears at the side so the user can scroll down to see the bottom of the image.

I'm hoping there's an easy way of doing this (there surely is) but I can't figure it out. Any help would be greatly appreciated.

Once i've figured this out I'm hoping to insert a javascript so that the image randomly changes on each site visit so I'm hoping the solution will apply to all the images (I'll resize the images so they're all the same size.

Hoping someone can help. Thanks, Richard

Recommended Answers

All 5 Replies

image placement is easy with css
css can be an external file that all the files on a site reference, great way to set the style for the entire site, then should you wish, you only need to make a single change to change the whole web page.
styles can go in the head, and they refer to every item on 1 page
styles can be added to an html element then the style referes only to that element.
to position a single image at the bottom of the page, to stay put, even IF the page gets larger than 1 screen the image remains and the page moves around it

<img src='whatever.jpg' style='background:transparent; top:auto; left:auto; bottom:0; right:0; position:fixed;' alt='whatever'>

top and left adjust to image size, bottom right set at zero from page border
css is very powerful, used right it makes layout piece of cake
there is a formum adjacent to this one in the web design forum css forum
containing css gurus to help debug
the W3C has a good basic tutorial http://www.w3schools.com/css/ to learn
what you can do,
when you should do,
and all that
good luck

Thanks so much for the help. This worked perfectly.

What I'd like to do now is have a different image appear in the same place (bottom left of the browser window) every time the page is refrehed. I tried running a javascript to do this however this didn't work in firefox and required permission in explorer.

I may create a flash animation to do this if I can figure out how to randomise the order of the images.

use shoul use % insted of giveing size in pixels then your page full be fully displayed

php image 'randomizer'(almost)

<?php $p = split('/', $_SERVER['SCRIPT_FILENAME']);
$today = getdate();
$script_name = $p[count($p)-1];
$path = './pathtoimages/'; // oops have to set this
$dir_handle = @opendir($path) or die("Unable to open $path");
Function get_Extension($m_FileName){
$path_parts = pathinfo($m_FileName);
if ($path_parts["extension"]) {
$m_Extension = strtolower($path_parts["extension"]);
return(strtoupper($m_Extension));
}
else { return "unknown"; }
}
function check_image($filename){
$temp=strtoupper(get_Extension($filename));
 if(($temp=="JPG")||($temp=="JPEG")||($temp=="GIF"))
return (true);
else
return (false);
}
Function get_Files($path) {
if ($handle = opendir($path)) {
while (false !== ($file = readdir($handle))) {
if(!is_dir($file) && substr($file,O,1) != "."){
$m_Files[]=$file;
}
}
closedir($handle);
}
if(sizeof($m_Files)>1)
asort($m_Files);
return $m_Files;
}
$files=get_Files($path);
$filter_files=array_filter($files,"check_image");
$maxnr=sizeof($filter_files)-1;
sort($filter_files);
$choose = $today[0] % count($filter_files);
echo '<img src="'.$path.$filter_files[$choose].'" alt="'.$path.$filter_files[$choose].'">';
closedir($dir_handle); } ?>

just drop it inplace instead of the existing img tag
user sees <img src=filename alt=filaname>

Hello helioworld.....I like your suggestion which you have given to sllymrvn.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.