[thelist] CSS iamge overlay/rollover...

Tris beertastic at gmail.com
Tue Dec 2 10:40:42 CST 2008


A break down...
thoughts?

=======================

<html>
<head>
<style>

#rolloverPlaceHolder {
  position: relative;
}

#imagePlaceHolder {
  width: 100px;
  height: 100px;
}

#overlayPlaceHolder {
  position: relative;
  width: 100px;
  height: 100px;
  visibilitY: hidden;
  z-index: 5;
}

#overlayPlaceHolder:hover {
  position: relative;
  width: 100px;
  height: 100px;
  visibility: visible;
  background-color: #F00;
  filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;
  z-index: 10;
}

</style>
</head>
<body>

<div id="rolloverPlaceHolder">
  <div id="imagePlaceHolder"><img
src="http://www.artistic-license-inc.com/b2b/pics/Tile__100_x_100_.jpg"
width="100" height="100" style="border: 0px;" /></div>
  <div id="overlayPlaceHolder">Over lay text</div>
</div>

</body>
</html>


======================================

2008/12/2 ben morrison <morrison.ben at gmail.com>:
> On Tue, Dec 2, 2008 at 3:48 PM, Tris <beertastic at gmail.com> wrote:
>> Hi all...
>>
>> I've got a few category images, where my boss wants me to do a rollover.
>> but the rollover should be a slightly opaque colored layer, with some text.
>> So you can still see the original layer underneath..
>>
>> I've tried to do stuff with z-index etc.. but I can't use position:
>> absolute, as there are several that are dynamically being generated
>> and I won't know their positions.
>
> If you send us a demo url it will be easier for us to help...
>
> ben
> --
>
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_evolt/
>
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !
>



-- 
"The only people who don't make mistakes are those who don't do anything"

Give a man a fish and he'll feed himself for a day.
Give a man a religion and he'll starve to death praying for a fish.
Anon

`We are what we pretend to be, so we must be careful what we pretend to be.`
Kurt Vonnegut

`When a person can no longer laugh at himself, it is time for others
to laugh at him.`
Thomas Szasz



More information about the thelist mailing list