Log in

View Full Version : Image holders


dobbin
04-29-2008, 04:59 PM
Hi i asked my mate how to make imageholders and he said you need to use css and abit of php does anyone know how?
Jas
04-29-2008, 06:41 PM
Can you define image holder? I can probably help, but I found nothing on google telling me what an "image holder" is.
dobbin
04-29-2008, 07:19 PM
http://img208.imageshack.us/img208/983/likethisko2.gif

That is a image holder above.
boogyman
04-29-2008, 07:55 PM
an image holder is either a "transparent" image that just takes up the necessary space, or it is another element used as a container to assign an image to when it is assigned.

Image holders are typically used when creating a slideshow of some sort. before the "show" starts, a default image should be declared... aka it "holds" the image place.
Jas
04-29-2008, 08:08 PM
So, wouldn't you just need something like:

<div style="height:200px;width:150px;"></div>
?
dobbin
04-29-2008, 08:22 PM
Thanks for that but i wont to use the pic below but some told me i can do it in css.
Medyman
04-29-2008, 09:00 PM
Try this:

HTML:


With Image
<div class="image-holder">
<img src="a/image.jpg" />
</div>

Without Image
<div class="image-holder">
</div>


CSS:


div.image-holder {
height:200px;
width:200px;
overflow:hidden;
background:url(nopic.jpg);
}


Anything highlighted, you need to change. What each thing means should be pretty self-explanatory. If not, post your questions.
dobbin
04-30-2008, 04:05 PM
Sorry but that dont really help cos i cant change the image
Medyman
04-30-2008, 04:54 PM
Sorry but that dont really help cos i cant change the image

What exactly do you need to do, then? If you don't have access to the code, you won't be able to make any changes!

Maybe you didn't understand my code. You have to change what I have highlighted. So if there is some image that you have to use. Just put in its URL.
dobbin
04-30-2008, 05:05 PM
Kk do you have a bebo account if you do i wont somehting like that but with writing in the image holder like the one below
Medyman
04-30-2008, 10:21 PM
Do you want an image? Or the code to apply the image?

I know you don't know CSS, but have you tried the code I said above? It does what you need! Just change the nopic.jpg to whatever image you want to use.

The image can't be created with CSS!

With my code, if you add an image to the container, the image shows up. If there is no image, the no image background shows up. That's how an "image holder" is done with CSS.
rangana
05-01-2008, 12:23 AM
Maybe he's looking for something like this:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
*{margin:0;padding:0;}
img{width:200px;height:200px;}
body{margin:20px;}
fieldset{padding:10px;margin:20px auto;width:200px;text-align:center;}
</style>
</head>
<body>
<fieldset>
<!--<legend>Caption Here</legend> Remove the comment box for a caption -->
<img src="http://www.sciam.com/media/externalnews/2008-04-23T225027Z_01_NOOTR_RTRIDSP_2_TECH-GOOGLE-ADVERTISING-DC.jpg" alt="myimage">
</fieldset>
</body>
</html>


Remove the higlighted if you want a "caption" :)
dobbin
05-01-2008, 03:49 PM
Thanks thats the code i wonted

But would you code it around the one below please?
Medyman
05-01-2008, 05:14 PM
But would you code it around the one below please?

You would change the <img> tag with whatever the URL to your image is.


<img src="http://www.sciam.com/media/externalnews/2008-04-23T225027Z_01_NOOTR_RTRIDSP_2_TECH-GOOGLE-ADVERTISING-DC.jpg" alt="myimage">

Also, I suggest you google for some tutorials and learn some basic HTML. You won't be successful in create a webpage if you don't understand the absolute basics, such as the <img> tag.
jscheuer1
05-01-2008, 05:25 PM
In Medyman's code, that would be the background image. It would only be seen if there were no image in the holder.
rangana
05-02-2008, 12:35 AM
Thanks thats the code i wonted

But would you code it around the one below please?

That was a sloppy code (for me)...fieldset is'nt ideal..you could just use division element. ;)

...As what Medyman said, read tutorials...it will help you achieve what you wanted, and also, change as what instructed :)