Learn VBA & Macros in 1 Week!

CSS - Onmouse Over Description

Full Excel VBA Course - Beginner to Expert

Onmouse Over Description	View Content

Hello,

I am new to css. Does anyone knows how I can create when user put the cursor on top the text it shows the description for that text. For an example in the forum it self when we put the cursor on top of a topic it shows the question. Can someone show some example code for that pls.

Thanks in advance

Full Excel VBA Course - Beginner to Expert

Onmouse Over Color Change

Similar Tutorials

View Content

Hi,

I have the following sample html. In here moving mouse over in any <li> changes backgroung color. Also I want to have the following as is due to the currently functionality
Code:

<li><a onMouseover="this.style.cursor='crosshair'; cssdropdown.dropit(this,event,'dropdownmenu2')">News</a></li>

here I still want to have <a without href but only wants to change the cursortype and the background color, but also I want the background color to
show like others i.e. background color changes too. How can I achieve this functionality.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style>
#sample ul li a{
float: left;
color: #7F7F7F;
font-weight: bold;
padding: 6px 12px 6px 7px;
text-decoration: none;
background-color: #9C2B01;
}

#sample ul li a:hover{
background-color: cyan;
}
</style>
</HEAD>

<BODY>
<table><tr><td>
<div id="sample">
<ul>
<li><a href="http://www.test.com">Home</a></li>
<li><a href="#" onMouseover="cssdropdown.dropit(this,event,'dropdownmenu1')">Education Services</a></li>
<li><a onMouseover="this.style.cursor='crosshair'; cssdropdown.dropit(this,event,'dropdownmenu2')">News</a></li>
<li><a href="http://cnn.com" onMouseover="cssdropdown.dropit(this,event,'dropdownmenu3')">Search</a></li>	
</ul>
</div>
</td></tr></table>
</BODY>
</HTML>

Any help is appreciated. Thanks

I Can't Get The Onmouse Over Effect On Browser

Similar Tutorials

View Content

Hi,

I'm having problem with my onMouseOver effect. It works perfectly fine on the internal browser of MS-Frontpage, but not the external browser like IE6 etc. Couldn't figure out where gone wrong. SOmeone out there please help me. Thanks lots.

web_illiterate

HEAD :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<title>My first website ever</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="keywords" content="Keywords here">
<meta name="description" content="Description here">
<META NAME="robots" CONTENT="index, follow">
<META NAME="revisit-after" CONTENT="30 days">
<META NAME="distribution" CONTENT="global">
<META NAME="rating" CONTENT="general">
<META NAME="Content-Language" CONTENT="english">

<script language="JavaScript" type="text/JavaScript" src="images_web/test.js"></script>
<link href="images_web/test.css" rel="stylesheet" type="text/css">
</head>

My test.css :
/* Testing css */

.sidetable {
border-top-width: 1px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
}
h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #2271A0;
font-size: 14px;
font-style: normal;
font-weight: bold;
font-variant: normal;
text-decoration: none;
}
p {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
.sidetable2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #FFFFFF;
}
.sidelinks {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #2271A0;
font-size: 10px;
font-weight: bold;
}
.baseline {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}
td {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
}
.sidelinks2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size: 10px;
font-weight: normal;
text-decoration: none;
}
.sidelinks2:a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size: 10px;
font-weight: normal;
text-decoration: underline;
}
h2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #666666;
}
.producthdr {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #2271A0;
font-weight: bold;
}
a {
color: #000000;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: underline;
}

My test.js :
// Testing Js


Body :
<body onload="runSlideShow()" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="86"><table width="79" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="352" rowspan="2"><img src="images_web/toplogo.gif" width="352" height="87"></td>
<td width="39" rowspan="2"><img src="images_web/topmidspace.gif" width="39" height="87"></td>
<td background="images_web/topbg.gif"><img src="images_web/topbg.gif" width="1" height="54"></td>
</tr>
<tr>
<td background="images_web/navbasebg.jpg" width="460"><img src="images_web/btn_home.gif" name="btn_home" width="71" height="33" id="btn_home" onMouseOver="MM_swapImage('btn_home','','images_web/btn_home_dn.gif',1)"
onClick="window.location='index.html'" onMouseOut="MM_swapImgRestore()"><img src="images_web/navspacer.gif" width="1" height="33"><img src="images_web/btn_contact.gif" name="btn_contact" width="75" height="33" id="btn_contact" onMouseOver="MM_swapImage('btn_contact','','images_web/btn_contact_dn.gif',1)"
onClick="window.location='contact.html'" onMouseOut="MM_swapImgRestore()"><img src="images_web/navspacer.gif" width="1" height="33"><img src="images_web/btn_members.gif" name="btn_members" width="93" height="33" id="btn_members" onMouseOver="MM_swapImage('btn_members','','images_web/btn_members_dn.gif',1)"
onClick="window.location='members.html'" onMouseOut="MM_swapImgRestore()"><img src="images_web/navspacer.gif" width="1" height="33"><img src="images_web/btn_projects.gif" name="btn_projects" width="70" height="33" id="btn_projects" onMouseOver="MM_swapImage('btn_projects','','images_web/btn_projects_dn.gif',1)"
onClick="window.location='projects.html'" onMouseOut="MM_swapImgRestore()"><img src="images_web/navspacer.gif" width="1" height="33"><img src="images_web/btn_downloads.gif" name="btn_downloads" width="78" height="33" id="btn_downloads" onMouseOver="MM_swapImage('btn_downloads','','images_web/btn_downloads_dn.gif',1)"
onClick="window.location='downloads.html'"
onMouseOut="MM_swapImgRestore()"><img src="images_web/navspacer.gif" width="1" height="33"></td>
</tr>
</table></td>
</tr>
</body>

Css Menu Description

Similar Tutorials

View Content

Hi there ppl,

I was searching for some CSS techniques and I found this homepage:

http://www.meyerweb.com/eric/css/edge/popups/demo.html

where it is explained how to created little descriptions without using javascript. I've read the code and now I'm wondering why it needs to have a border in "div#links a:hover span" for it to work. Also isn't there a way to use visibility property instead of display? It worked fine in mozilla, but IE rejects it.

Regards

Expanding The Description For The Title From The Database

Similar Tutorials

View Content

I need to get the data/decription for the title which are stored in a database using mouse over or click.Any Idea?How to?

Drop Down Menu Tutorial That Has A Good Description Of How It Works

Similar Tutorials

View Content

I have downloaded my fair share of drop down menus and have always had problems with understanding how it works and what adjustments move or alter what part of the menu. I experimented a bit and got it working on a Mac but it doesnt look right on a PC and vise versa.

Is there a tutorial out there that is really descriptive on how it works and shows which adjustments alters what on the menu than just giving you a downloadable sample to play with.