Log in

View Full Version : Rollover Textbox problems



ElasticLover
02-10-2010, 02:44 AM
k this might sound childish and lame and embarrasing but I'm making a guild layout for neopets, and I have all this coding but the .op and opactiy scripting isnt working, any ideas why?

<style>

table, td {
background: none;
}

#header, #footer, .sidebar {
display: none;
}

#main {
background: none;
border: none;
}

.contentHeader, .contentModuleHeaderAlt {
display: none;
}

.op{opacity:0.4; filter:alpha(opacity=40)}

a.op:hover{opacity:1; filter:alpha(opacity=100)}


#image {
top: 0px;
left: 10px;
z-index: 2;
}

#textbox {
top: 70px;
left: 40px;
overflow: auto;
width: 430px;
height: 480px;
font-family: verdana;
font-size: 10pt;
color: #551a4d;
z-index: 4;
}

table table table table {
margin-top: -160px;
margin-left: 600px;
z-index: 6;
}

table table table table table {
display: none;
}


table table table table font {
font-size: 7pt;
color: #286f20;
font-family: verdana;
}

body {
background-color: #bfeeba;
}
</style>

<div id="image" style="position: absolute;">
<img src="http://img707.imageshack.us/img707/3053/gclayout.png">
</div>

<div id="textbox" style="position: absolute;" class="op">
Test would go here
</div>

simcomedia
02-11-2010, 01:32 AM
Change to this:

.op a:link{opacity:0.4; filter:alpha(opacity=40);

text-decoration: none;}

.op a:hover{opacity:1; filter:alpha(opacity=100)}

assign the 'class' first => .op
then the elements within that class that would be affected and how:

.op (the class name) => make all a:links 40% opacity to start with (what you want)
.op => make all a:links on a:hover go to 100% opacity (what you want)

That's pretty much what your CSS statements should be.