CSS Javascipt or a:hover???????

Hello,
I am reading and hearing conflicting things on what to use
for rollovers. I am interested in what people are using, either
Javascript or a: hover or both? And if you write the reason you are
using it that would be very helpful.
Thanks, JIm

I use CSS for rollovers. Why?
* it doesn't requre javascript, so there is no additional
coding added to
the head of the page
* it doesn't require javascript, so it works even if
javascript is disabled
* it allows me to keep my menu options in plain HTML text,
and yet still use
graphics for the buttons if I want (as background images)
* if I am using a single graphic for all of the buttons, then
I don't have
to fiddle with an image preload
* it removes lots of functional code from the page (all of
the mouseover
calls), and makes for a slimmer page, that is easier to
understand when
looking at the code
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"Wonderwendy" <[email protected]> wrote in
message
news:eu0i0r$qe0$[email protected]..
> Hello,
> I am reading and hearing conflicting things on what to
use for rollovers.
> I am
> interested in what people are using, either Javascript
or a: hover or
> both? And
> if you write the reason you are using it that would be
very helpful.
> Thanks, JIm
>

Similar Messages

How to make text CSS text link with HOVER

How do I nake text links using CSS and the hover function?
I am new to this
Thanks

This should help
http://www.projectseven.com/tutorials/css/pseudoclasses/index.htm
Jo
"electro-dud" <[email protected]> wrote in
message
news:fcnnis$cv7$[email protected]..
> How do I nake text links using CSS and the hover
function?
>
> I am new to this
>
> Thanks

(OT) CSS a:link a:hover a:visited a:active

Hola Foreros.
Tengo la siguiente inquietud.
Tengo un CSS definido. En propiedades de la pagina deje color
del vinculo,
vínculos visitados, vínculos de sustitución y
vínculos activos como neutro.
Cree un CSS y definí colores y tipo de letra. Hasta hay
no problema
.rojo_mayuscula_12 {
color: #FF0000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-style: normal;
line-height: normal;
font-weight: bold;
font-variant: normal;
text-transform: uppercase;
text-decoration: none;
Luego cuando creaba un vinculo con ese color me tomaba un
azuloso mas que
insistía. Debido a eso le agregue al CSS
.rojo_mayuscula_12 a:link {
Perfecto, hasta hay nop problem. Pero cuando lo veo en OPERA,
me muestra que
al vinculo que le di otro color. En firefox, Netscape, Frog
no me muestra
ese error de cambio de color.
Probem con
.rojo_mayuscula_12 a:link a:hover a:visited a:active{
Pero no funciona.
Bueno. Como puedo obligar a un tipo de letra que tome el
color activo,
enzima, visitado sigan sin cambiar el color para todos los
Explorer?
Que parte me quedo mal en .rojo_mayuscula_12 a:link a:hover
a:visited
a:active{ para que me tome el color?
Gracias y espero respuesta.

Hola Annuack. Sólo un truco:
¡No utilices ese tipo de nombres en los estilos! 8-)
¿Te imaginas que dentro de un mes tengas que cambiar el
diseño y los enlaces
pasen a ser verdes y en minuscula?
Es mejor definirlos por su función en el documento
(enlacesNavegacion,
linksContenido...) que por su apariencia.
Saludos!
Andres Cayon
http://www.dwug.es
"Anuack Luna" <[email protected]> escribió en el
mensaje
news:epk2pe$j96$[email protected]..
> Hola Foreros.
>
> Tengo la siguiente inquietud.
>
> Tengo un CSS definido. En propiedades de la pagina deje
color del vinculo,
> vínculos visitados, vínculos de
sustitución y vínculos activos como
> neutro.
>
> Cree un CSS y definí colores y tipo de letra. Hasta
hay no problema
>
> .rojo_mayuscula_12 {
> color: #FF0000;
> font-family: Verdana, Arial, Helvetica, sans-serif;
> font-size: 10px;
> font-style: normal;
> line-height: normal;
> font-weight: bold;
> font-variant: normal;
> text-transform: uppercase;
> text-decoration: none;
>
> Luego cuando creaba un vinculo con ese color me tomaba
un azuloso mas que
> insistía. Debido a eso le agregue al CSS
>
> .rojo_mayuscula_12 a:link {
>
> Perfecto, hasta hay nop problem. Pero cuando lo veo en
OPERA, me muestra
> que
> al vinculo que le di otro color. En firefox, Netscape,
Frog no me muestra
> ese error de cambio de color.
>
> Probem con
> .rojo_mayuscula_12 a:link a:hover a:visited a:active{
> Pero no funciona.
>
> Bueno. Como puedo obligar a un tipo de letra que tome el
color activo,
> enzima, visitado sigan sin cambiar el color para todos
los Explorer?
>
> Que parte me quedo mal en .rojo_mayuscula_12 a:link
a:hover a:visited
> a:active{ para que me tome el color?
>
> Gracias y espero respuesta.
>
>

Email campaign - inline css - a:link, a:hover

What do people do about setting the color of the a:link and a:hover when setting up a page for email distribution using inline css?
From what I've read you can't declare inline styles for the above mentioned styles?
Is it ok to put those in css <style></style> tags in the head section of the page and just let those email clients that can deal with it do so and forget those that can't, or is there a better alternative?
Cheers
Os

pziecina wrote:
Hi Os
Don't know if this is related to your post regarding xara, but if the other person was using xara for emails then yes it is easier doing emails in xara than dreamweaver, (for the none html/css literate).
Sort of, I'm just doing some experimenting before I commit myself. Don't won't to look like a dumb *** if I say I can and then I can't, lol.
As to your question most emails use the default but I can see no problem in placing the alternative in a css style sheet.
This article may be helpful, (check the external links at the end also) - http://groundwire.org/support/articles/css-and-email-newsletters.
Ok, that's what I thought. I'll use inline css styling for pretty much everything I can to be on the safe side and just put css that can't be inserted inline in an embedded style sheet. I guess its no big deal if a few email client don't like it.
I'll have a read of the link you provided. Thanks for your respnse

Css link hover color not applied to last letter in safari

Im only seeing this in safari. Here is my site:
http://smartpeopletalkfast.co.uk/oo2/
If I click on the contact page its highlihgted as it should be. However if im not on the contact page and I hover over the contact link, the last bit of the 't' is not highlighted. How can I fix this?
Im assuming becuase its italic the last bit is outside of the div, and for some reason the hover color isnt shown. Ive tried applying both a:hover css aswell as li:hover a.
Thanks

I'm seeing it in FF 3.6.13 as well on the PC.
Validate your page either throuth DW or the W3C. For one thing, you've got div tags inside li tags. Don't split up your styling . . . add the italic styling to the main styline for the li tag.
If fixing the coding doesn't work, try adding some padding to the right of that container -- a couple of pixels ought to do it.

11g Custom.CSS Style Sheet issue...is it a bug?

I've created a custom style sheet that we're using to change the graphical elements of our dashboard. I've got everything working and I'm really pleased about how it's looking. Today, I started working on changing the default field attributes. I didn't want to have to go in and change 7-8 elements (font, size, bold, etc) so I used the Custom.CSS file and created new CSS classes that I could easily assign to fields. My thought was that I could go through my whole web-catalog once and apply the CSS to each of the fields, their headers, etc. so that if we wanted to make global changes to formatting later on, I could go and edit the Custom.CSS.
I've run into a slight problem which brings me to the purpose of this post. I have saved the CSS classes into the fields, applied them and saved the changes as the defaults for the fields. Everything works great and the CSS defined styles appear when I create a new report. My concern is that when I create a new report and pull in one of the fields that I have defined and saved the default style, the field no longer shows that it's definition is linked to the Custom.CSS. If I hover over a field in Firebug, it tells me that it's referencing the Custom.CSS, so I know the field is actively referencing the CSS. Shouldn't the field retain the reference to the Custom.CSS when I save the style? Any other developer going into the field will not be able to tell that there is a style sheet that defines the field attributes.
Also, is there a better way to go about applying styling to fields across the board?

Hi Brad
The changes to the file is not done outside of Muse, I know by touching Muse's files from BC will screw things up,
rather it is done from Muse itself by going to the page properties and entering an html code in the header of the page.
Also maybe I should'nt said Locally Published, I meant when exporting the html and viewing it locally.
Regards

CS6 #nav links change hover background color based on its position in series

First post from a complete DW CS 6 novice on Win7. Not knowing JavaScript or JQuery, I thought I would add simplest animation to a website navigation based on the two col fixed header footer design. The navigation links on the left <sidebar1> have been increased to 24, with a common link background in the default state. When the cursor is passed over the links they would change background color to one of five given in the image placed in the jpeg image loaded as the 1st list item. The image itself only acts as a color key to the five catagories of links directly below it, and is not hyperlinked. The idea is that someone looking for new tools would need to hover down the nav links and only be concerned with the Yellow background ones, even if they appear in any random position down the list. To give each link a color to start with would make <sidebar1> appear too colorful.
I have David Powers' two dvd titles and was thinking of using a nth-of-type() . It does not work. Perhaps there are two sets of colons required ( a:hover:nth-of-type(4), a:active:nth-of-type(4) {background-color:#f00;} ). There is surely a way that would work but I do not know enough of DW and CSS at present to figure this out.
Many thanks.

I don't what menu system you're using, but you might be able to create some CSS classes to use in your menu like so:
<ul>
<li>a href="some-link.html" class="about">about link</a></li>
<li>a href="some-link.html" class="new">new link</a></li>
<li>a href="some-link.html" class="new_proc">new procedures link</a></li>
<ul>
CSS:
li a.about:hover {background-color:gray}
li a:new:hover {background-color:forestgreen}
li a:new_proc:hover {background-color:lawngreen}
and so on...
Nancy O.

Af:commandLink : selected & visited CSS not working

Hi All ,
I am using JDeveloper 11.1.1.6.
My Scenario is after click the Command links the link color need to be changed .
hover property in command link is working fine but selected and visited are not working.
I tried below CSS,
[code]
af|commandLink:hover {
    background-color: Red;
af|commandLink:selected {
    background-color: Green;
af|commandLink:visited {
    background-color: Blue;
[/code]
Thanks ,
Arun D.

Hi Arun,
If i am note getting you wrong, then you mean to say that the color is changing when you have clicked and not yet left the mouse button (the Mouse button is still clicked)
Then u have to add the pseudo class "commandLink:active :hover"
Thanks,
Pandu

Accordion Hover Color Change Not Working

Hi,
http://www.seminolewellnessfeed.com/new_sem_well/WellnessHorseFeeds.html
http://www.seminolewellnessfeed.com/SpryAssets/SpryAccordion.css
I believe I've got the CSS right for my hover over the panel tab to turn to 999, but it's not - anybody gotta clue?
Thanks!!! ttt

Have a look at your mark-up
<div class="AccordionPanelTab style3">
<h4><strong> Seminole Wellness® Safe & Lite Pellet</strong></h4>
</div>
If you want to style the text for the tab do so using the following rules
.AccordionPanelTab {
    font-size: 1.1em;
    text-align: center;
    font-weight: bold;
and change your mark-up to
<div class="AccordionPanelTab">Seminole Wellness® Safe & Lite Pellet</div>
Also take note of what SnakEyez02 said.
I hope this helps.
Ben

Imported Fireworks Nav Bar Animation Looping

Hi
I have imported a navigation bar I made in fireworks into dreamweaver and when I preview in browser it keeps looping. In fireworks I added a rollover effect so that when you rollover each bit of text, e.g. home, contact, games it goes bold, and when previewing it loops so they all keep going bold without my control. In Fireworks I made it using slices and several states, and so just when I rollover state one it changes to state 2 for example. Very simple, but it keeps looping, how can I stop this? Thanks. I have attached the png file for fireworks if you need to take a look.

Hi
You do not require the fireworks/javascript to achieve the effect you require for your links.
This effect can be made using simple css a:link, (visited, hover, active) statements, I would also recommend using css to style your page and not tables/image slices .
For the css links, see - http://www.w3schools.com/css/css_link.asp and http://www.webcredible.co.uk/user-friendly-resources/css/css-navigation-menu.shtml.
Moving from tables based design to css based - http://www.adobe.com/devnet/dreamweaver/articles/table_to_css_pt1.html.
PZ

Detail Region as TOC for captivate (.swf) files

Hi All,
Not sure how to explain this, but i will do my best. I didnt like the TOC/Aggregator for CP 5. Thinking maybe to use Spry data using the Detail Region sample. I thought it would be simple to just combine the Detail Region code with the publsihed .swf and .htm code. But not sure what im doing wrong or if this is even possible to do. I was experimenting just using the exact same code and xml for Detail Region sample and modifying it a bit. See below...
Appreciate the Help! Thank you.
XML:
<?xml version="1.0" encoding="iso-8859-1"?>
<products>
     <product>
          <name>Adobe Photoshop CS2</name>
          <category>Digital Imaging</category>
          <boximage>images/photoshop.gif</boximage>
          <bkgimage>M_1.swf</bkgimage>
          <descheader>The professional standard in desktop digital imaging</descheader>
          <desc>Adobe® Photoshop® CS2 software, the professional image-editing standard and leader of the Photoshop digital imaging line, delivers more of what you crave. Groundbreaking creative tools help you achieve extraordinary results. Unprecedented adaptability lets you custom-fit Photoshop to the way you work. And with more efficient editing, processing, and file handling, there's no slowing you down.</desc>
          <features></features>
     </product>
     <product>
          <name>Adobe Illustrator CS2</name>
          <category>Print Publishing</category>
          <boximage>images/illustrator.gif</boximage>
          <bkgimage>M_2.swf</bkgimage>
          <descheader>Vector graphics reinvented</descheader>
          <desc>Adobe® Illustrator® CS2 software gives you new creative freedom that lets you realize your ideas quickly and powerfully. Instantly convert bitmaps to vector artwork and paint more intuitively. Save time with intelligent palettes and optimized workspaces. Plus, tight integration with other software allows you to produce extraordinary graphics for print, video, the web, and mobile devices.</desc>
          <features></features>
     </product>
     <product>
          <name>Adobe InDesign CS2</name>
          <category>Print Publishing</category>
          <boximage>images/indesign.gif</boximage>
          <bkgimage>M_3.swf</bkgimage>
          <descheader>A new standard in professional layout and design</descheader>
          <desc>Join the growing ranks of creative professionals discovering new levels of creative freedom and productivity using Adobe® InDesign® CS2 software. Tightly integrated with the Adobe applications you use most, InDesign CS2 delivers faster production workflows and a more fluid creative environment for designing professional layouts with sophisticated graphics and typography.</desc>
          <features></features>
     </product>
     <product>
          <name>Adobe GoLive CS2</name>
          <category>Web Publishing</category>
          <boximage>images/golive.gif</boximage>
          <bkgimage>M_4_1.swf</bkgimage>
          <descheader>Professional, standards-based Web and mobile authoring</descheader>
          <desc>Adobe® GoLive® CS2 software lets you unlock the power of CSS with intuitive visual tools such as prebuilt CSS objects that you can drag and drop to build sophisticated sites. Jump-start your designs by easily converting Adobe InDesign® layouts into Web pages. Or, design Web and mobile content in an advanced, standards-based coding environment.</desc>
          <features></features>
     </product>
     <product>
          <name>Adobe Dreamweaver 8</name>
          <category>Web Publishing</category>
          <boximage>images/dreamweaver.gif</boximage>
          <bkgimage>M_5_1.swf</bkgimage>
          <descheader>Dreamweaver 8 is the industry-leading web development tool, enabling users to efficiently design, develop and maintain standards-based websites and applications.</descheader>
          <desc>With Dreamweaver 8, web developers go from start to finish, creating and maintaining basic websites to advanced applications that support best practices and the latest technologies.</desc>
          <features></features>
     </product>
     <product>
          <name>Adobe Flash 8 Professional</name>
          <category>Web Publishing</category>
          <boximage>images/flash_pro.gif</boximage>
          <bkgimage>M_6_1.swf</bkgimage>
          <descheader>Introducing Macromedia's biggest Flash release to date.</descheader>
          <desc>Flash® Professional 8 is the industry's most advanced authoring environment for creating interactive websites, digital experiences and mobile content. With Flash Professional 8, creative professionals design and author interactive content rich with video, graphics, and animation for truly unique, engaging websites, presentations or mobile content.</desc>
          <features></features>
     </product>
</products>
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Detail Region and Effects Sample</title>
<link href="files/samples.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.product {
     cursor: pointer;
.hover {
     background-color: #FFFFCC;
.selected {
     background-color: #CCCCCC;
#description {
     opacity: 0;
     filter: alpha(opacity=0);
     background-color: white;
</style>
<script src="files/xpath.js" type="text/javascript"></script>
<script src="files/SpryData.js" type="text/javascript"></script>
<script src="files/SpryEffects.js" type="text/javascript"></script>
<script type="text/javascript">

</script>
<script src="files/standard.js" type="text/javascript"></script>
</head>
<body>
<h3>Detail Region and Effects Sample</h3>
<hr />
<table width="100%" border="0">
     <tr>
          <td width="21%">
<ul spry:region="ds1" spry:repeatchildren="ds1">
                    <li class="product" onclick="fadeOutContentThenSetRow('{ds_RowID}');" spry:select="selected" spry:hover="hover">{name}</li>
            </ul>
          </td>
       <td width="79%">
   <div id="description" spry:detailregion=" ds1">
<div id="CaptivateContent">
   </div>
   <script type="text/javascript">
      var so = new SWFObject("{bkgimage}", "Captivate", "100%", "100%", "8", "#CCCCCC");
         so.addParam("quality", "high");
         so.addParam("name", "Captivate");
         so.addParam("id", "Captivate");
         so.addParam("wmode", "opaque");
         so.addParam("bgcolor","#F1F4F5");
         so.addParam("menu", "false");
         so.addParam("allowScriptAccess", "always");
         so.addVariable("variable1", "value1");
         so.setAttribute("redirectUrl", "http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash");
         so.write("CaptivateContent");
   </script>
        <script type="text/javascript">
      document.getElementById('Captivate').focus();
      document.Captivate.focus();
   </script>
      </div>
      </td>
</tr>
</table>
</body>
</html>
Message was edited by: drodax

Hi,
I think you will need a third party convertor - a quick
google sent me to this one
http://www.winavi.com/swf-to-avi.htm
which is free.

Looking for answers/help to understand how can I "fix" this

Hola ...again
I got a div nav with a color, a width and a high properties that are crossover with a line in my CSS Inspector
If I hover on it, it dispaly this
"background-color does not apply to your selection because it is not inherited. It is applied to an enclosed tag.
However, page elements are transparent by defaut, so this color may show through"
So, how it happend?
How can I fix that?
Thanks

Hola
Well, it's fix
Not sure how, just move some divs and it works.
Sorry Gramps, cannot contribute to your happy day
However, I'll will mark this post "fix" so you can continued collecting post
Lets make sure you get a bonus at your 4000
Saludos

Rollovers function inconsistenly in different browsers

Rollovers for links in the index page sidebar work in "Live View" but do not work consistently among the browsers and do not function at all in Firefox. I'm obviously new but have spent way too much time trying to figure this one out. Any help would be appreciated.
The Index page can be found at http://www.akamaidetailing.com
The CSS is provided below:
#sidebar1 {
    float: left; /* since this element is floated, a width must be given */
    width: 230px;
    color: #FFF;
    padding-left: 0px;
#sidebar1 div img{
    display: block;
    margin: 0.25em auto;
    padding-top: 0.5em;
    border: none;
#sidebar1 p {
    margin: 1em 0.625em;
    text-align: left;
    display: block;
    padding-bottom: 1em;
#sidebar1 #Sidebarfacebook h3 {
    display: block;
    padding-bottom: 0.5em;
    text-align: center;
    text-decoration: none;
#sidebar1 #Sidebarfacebook a {
    color:#CAD0E8;
    text-decoration:none;
#sidebar1 #Sidebarfacebook a:hover {
    color:#C96;
#sidebar1 #Sidebarfacebook a:active {
    color:#C96;
#sidebar1 #Sidebarfacebook a:visited {
    color:#E2E2E2;
#sidebar1 #demonstration h2 {
    margin: 1em .625em;
    padding-top: 1em;
#sidebar1 #demonstration a {
    color:#CAD0E8;
    text-decoration:none;
#sidebar1 #demonstration a:hover {
    color:#C96;
#sidebar1 #demonstration a:active {
    color:#C96;
#sidebar1 #demonstration a:visited {
    color:#E2E2E2;
#sidebar1 #demonstration h3 a   {
    text-decoration: none;
    font-size: 1em;
    padding: 0px;
    left: auto;
    right: auto;
#sidebar1 #shop h2 {
    margin: 1em 0.625em;
    padding-top: 1em;
#sidebar1 #shop a {
    color:#CAD0E8;
    text-decoration:none;
#sidebar1 #shop a:hover {
    color:#C96;
#sidebar1 #shop a:active {
    color:#C96;
#sidebar1 #shop a:visited {
    color:#E2E2E2;
#sidebar1 #products h3   {
    margin: 1em .625em;
    padding-top: 1em;

Ensure the order of the CSS is link, visited, hover, active
e.g.
#sidebar1 #Sidebarfacebook a {
color:#CAD0E8;
text-decoration:none;
#sidebar1 #Sidebarfacebook a:visited {
color:#E2E2E2;
#sidebar1 #Sidebarfacebook a:hover {
color:#C96;
#sidebar1 #Sidebarfacebook a:active {
color:#C96;

Background-image for commandToolbarButton

Hi,
I want to skin af:commandToolbarButton similar to standard skinned commandbutton.
I managed to change the background-image for the link-section, but there seems to be a other section with a background-image which is a little bit bigger than the link-section.
But I can't find how to e.g. disable this background-image when mouse is moved over the commandtoolbarbutton.
Here my CSS definition for the hover-action:
================================
af|commandToolbarButton:hover,
af|commandToolbarButton::link:hover,
af|commandToolbarButton::text:hover
background-image: none;
border : none;
============================
What's my mistake?
regards
Peter

Hi,
if you extend an existing skin then you need to use
-tr-inhibit: background-image
Here's a list of the valid CSS
af|commandToolbarButton
Style on the root element of the af:commandToolbarButton component. This style includes the .AFDefaultFont:alias style. CommandToolbarButton supports further styling with the :hover, :depressed, :selected, :disabled, :text-only and :action-disabled pseudo-classes.
af|commandToolbarButton::access-key
Style on the access key for the label of the af:commandToolbarButton component. For example, underline the access key. Includes .AFFormAccessKeyStyle:alias.
af|commandToolbarButton::link
Style on the button link on the af:commandToolbarButton component.
af|commandToolbarButton::text      Style on the button text on the af:commandToolbarButton component.
af|commandToolbarButton::dropdown-cell
Style on the cell containing the dropdown icon used for the popup button of the af:commandToolbarButton component.
af|commandToolbarButton::dropdown-icon-style
Style of the icon used for the popup button of the af:commandToolbarButton component. The icon is specified as a background-image in this key. To override the default icon, set -tr-inhibit: background-image in the dropdown-icon-style and define the override icon for the dropdown-icon.
Frank

Pop-Up Warning

I am trying to add a pop-up warning when someone clicks on a link to leave the site. I work in a financial institution and it's required by the FDIC to have it. Any suggestions?

Here is one i used from my page. Its little blue box that will appear wherever you need it to by adding the rule to your html.

<script type="text/javascript">
    var GB_ROOT_DIR = "PopUpWindow/greybox/";
</script>
<script type="text/javascript" src="PopUpWindow/greybox/AJS.js"></script>
<script type="text/javascript" src="PopUpWindow/greybox/AJS_fx.js"></script>
<script type="text/javascript" src="PopUpWindow/greybox/gb_scripts.js"></script>
<link href="PopUpWindow/greybox/gb_styles.css" rel="stylesheet" type="text/css" />

a:hover {
    background:none; /*BG color is a must for IE6*/
    text-decoration:none;
a.tooltip span {
    display:none;
    padding:5px 5px;
    margin-left:0px;
    margin-top:-98px;
    width:180px;
a.tooltip:hover span{
    display:inline;
    position:absolute;
    background:#69c;
    border:1px solid #003366;
    color:#fff;
    font-size:11px;
Hope it helps

CSS Javascipt or a:hover???????

Similar Messages

Maybe you are looking for