Solved

difficulty with cursor: pointer

Posted on 2011-03-08
4
310 Views
Last Modified: 2012-05-11
CSS:

input.button {
            cursor: pointer;
      }

HTML:

<input type="button" onClick="javascript:closealertmsg();" value="Yes, Let Me Pick">

However, I want the hand cursor, but it isn't showing up. Is my syntax off? Thank you!
0
Comment
Question by:bbdesign
  • 2
  • 2
4 Comments
 
LVL 6

Expert Comment

by:MuffyBunny
ID: 35071072
input.button {
            cursor: hand;
      }

Open in new window

0
 

Author Comment

by:bbdesign
ID: 35071109
Hmm, that makes sense. But still doesn't work. I'm attaching my HTML/CSS.
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<title>Build My Workout Calendar</title>
<link type="text/css" rel="stylesheet" href="_css.css" />
<style type="text/css">
div.buildcalendar_icons {
		position: absolute;
		top: 100px;
		right: 0px;
	}
div.exercisetable {
		position: absolute;
		width: 100%;
		top: 236px;
	}
td.border3 {
		padding: 6px 0px 4px 0px;
		border-bottom: 1px solid #c8cfd0;
	}
td.separator {
		padding-top: 12px;
		padding-bottom: 12px;
		border-bottom: 1px solid #c8cfd0;
	}
td.border4 {
		border-left: 1px solid #c8cfd0;
	}
td.spaceleft {
		padding-left: 50px;
	}
td.tdpad {
		padding-left: 12px;
	}
td.tdpadrt {
		padding-right: 12px;
	}
td.headcardio {
		background: #ffffff url("art/bg_pickex_cardio.jpg") repeat-y left top;
	}
td.headstrength {
		background: #ffffff url("art/bg_pickex_strength.jpg") repeat-y left top;
	}
td.headflex {
		background: #ffffff url("art/bg_pickex_flex.jpg") repeat-y left top;
	}
td.headbalance {
		background: #ffffff url("art/bg_pickex_balance.jpg") repeat-y left top;
	}
img.positionicon {
		position: absolute;
	}
div.muscle_small_shoulders {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_chest {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_upperback {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_biceps {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_triceps {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_abs {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_lowerback {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_glutes {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_hamstrings {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_quads {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.muscle_small_calves {
		position: absolute;
		width: 196px;
		height: 147px;
		z-index: 2;
	}
div.programprofile {
		width: 260px;
	}
#workoutalert {
		position: absolute;
		left: 295px;
		top: 166px;
		width: 350px;
		height: 80px;
		background: #daeafc;
		z-index: 3;
		display: none;
		padding: 24px;
		border: 1px solid #c7c2c2;
		text-align: center;
	}
input.button {
		cursor: hand;
	}
a {
		color: #002967;
	}
a:visited {
		color: #002967;
	}
a:hover {
		color: #FF0000;
	}
</style>
<script type="text/javascript" src="javascript/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
	$(function(){
		$('.textdesc').click(function(){
			var $x = $(this).prev('input');
			$x.attr('checked',true);
		});
	});
</script>

<script language="javascript" type="text/javascript">
	function setprogram(displaycat,task){
		document.mainform.displaycat.value=displaycat;
		document.mainform.task.value=task;

		var inputVal = $("#mainform input[name='selectprogram']:checked").val();

		if (undefined == inputVal){
			$('#workoutalert').fadeIn();
		} else {
			document.mainform.submit();
		}
	}
</script>
<script language="javascript" type="text/javascript">
	function closealertmsg(){
		$('#workoutalert').fadeOut();
	}
</script>
<script language="javascript" type="text/javascript">
	function refreshpage(){
		document.mainform.submit();
	}
</script>
<script language="javascript" type="text/javascript">
	function enablebutton(){
		$(function(){
			$('#nextbutton').attr("disabled", true);
			$('#saveandviewbutton').attr("disabled", false);
		});
	}
</script>
</head>
<body bgcolor="#ffffff" text="#0a4b7f" link="#002967" vlink="#002967" alink="#ff0000">

<div class="popup">

<form id="mainform" name="mainform" action="https://www.myexerciserx.com/mfc_form19-test.asp" method="post">
<input type="hidden" name="patientid" value="298">

<table border="0" cellspacing="0" cellpadding="0" width="100%"><tr valign="top"><td align="left" width="260"><font face="arial" SIZE="4" color="#000000"><b>BB Design</b></font><br /><font face="arial" size="2" color="#000000">610-693-6080</font><br /><font face="arial" size="2" color="#000000"><a href="mailto:brad@bbdesign.com">brad@bbdesign.com</a></font></td><td rowspan="2" valign="bottom" align="center"><font face="arial" SIZE="5"><b>Build My Workout Calendar</b></font></td><td align="right" width="260"><font face="arial" SIZE="4" color="#000000"><b>Brad Bansner</b></font><br /><font face="arial" size="2" color="#000000">610-693-6080</font><br /><font face="arial" size="2" color="#000000"><a href="mailto:brad@bbdesign.com">brad@bbdesign.com</a></font></td></tr><tr><td colspan="2"><img src="art/px_trans.gif" width="1" height="6" border="0"></td></tr><tr><td colspan="3" bgcolor="#4c6e83"><img src="art/px_trans.gif" width="1" height="1" border="0"></td></tr><tr valign="top"><td align="left"><img src="art/px_trans.gif" width="1" height="4" border="0"><br /><font face="arial" size="2" color="#000000"><I>Today's date: 9 March 2011</I></font><br /><font face="arial" size="2" color="#000000"><I>Enrollment date: 3 May 2007</I></font></td><td><img src="art/px_trans.gif" width="1" height="1" border="0"></td><td align="right"><img src="art/px_trans.gif" width="1" height="4" border="0"><br /><font face="arial" size="2"><a class="blue" href="mfc_form5.asp?patientid=298">Edit My Exercise Profile</a></font><img src="art/px_trans.gif" width="18" height="1" border="0"><a href="javascript:print();"><img src="art/ic_printsmall.png" width="41" height="14" border="0" align="center" /></a></td></tr></table><div class="buildcalendar_icons"><table border="0" cellspacing="0" cellpadding="0"><tr><td colspan="4"><img src="art/gr_workoutcalendar_1.jpg" width="210" height="22" border="0" /></td></tr><tr><td><img src="art/gr_workoutcalendar_2b.jpg" width="55" height="54" border="0" /></td><td><img src="art/gr_workoutcalendar_3b.jpg" width="50" height="54" border="0" /></td><td><img src="art/gr_workoutcalendar_4b.jpg" width="50" height="54" border="0" /></td><td><img src="art/gr_workoutcalendar_5b.jpg" width="55" height="54" border="0" /></td></tr><tr valign="top" align="left"><td><img src="art/px_trans.gif" width="1" height="1" border="0" /></td><td nowrap><img src="art/px_trans.gif" width="19" height="1" border="0" /><img src="art/gr_smalltriangle.png" width="13" height="10" border="0" /></td><td><img src="art/px_trans.gif" width="1" height="1" border="0" /></td><td><img src="art/px_trans.gif" width="1" height="1" border="0" /></td></tr><tr valign="top" align="center"><td colspan="4"><img src="art/px_trans.gif" width="1" height="4" border="0" alt="" /><br/><font face="arial" size="2">Your exercise profile includes:<br />Cardiovascular, Strength Training<br />Flexibility, Balance</font></td></tr></table></div>

<div id="workoutalert"><font face="arial" size="3"><b>You have not picked a Strength Training program.<br />
	Would you like to pick one before moving on?</b><br /><br />
	<input type="button" onClick="javascript:closealertmsg();" value="Yes, Let Me Pick"> <input type="button" onClick="javascript:refreshpage();" value="No, Move On"></div>

<table border="0" cellspacing="0" cellpadding="0" align="center">
	<tr valign="top" align="left">
<td nowrap><font face="arial" size="2">1. Start date:</font><br /><img src="art/px_trans.gif" width="1" height="9" border="0" alt="" /></td><td><img src="art/px_trans.gif" width="18" height="1" border="0" alt="" /></td><input type="hidden" name="startdate" value="3/7/2011"><td nowrap><font face="arial" size="2">Monday, 7 March 2011</font><br /><img src="art/px_trans.gif" width="1" height="9" border="0" alt="" /></td>
	<tr valign="top" align="left">
		<td nowrap><font face="arial" size="2">2. Select a program from the list below.</font><br />
			<img src="art/px_trans.gif" width="1" height="9" border="0" alt="" /></td>
		<td><img src="art/px_trans.gif" width="18" height="1" border="0" alt="" /></td>
<td><input type="button" id="nextbutton" onClick="javascript:setprogram('Flexibility','reload');" value="Next"> <input type="button" id="saveandviewbutton" onClick="javascript:setprogram('Strength Training','finish');" value="Finish" disabled></td>
	</tr>
	<tr valign="top" align="left">
		<td nowrap><font face="arial" size="2">3. Click next.</font></td>
		<td><img src="art/px_trans.gif" width="18" height="1" border="0" alt="" /></td>
		<td nowrap><font face="arial" size="2">&nbsp;</font></td>
	</tr>
</table>

		<div class="exercisetable">


				<img class="positionicon" src="art/icon_strength.png" width="38" height="38" border="0" />
				<table border="0" cellspacing="0" cellpadding="0" width="100%">
					<tr>
						<td colspan="5"><img src="art/px_trans.gif" width="1" height="6" border="0" alt="" /></td>
					</tr>
					<tr valign="top" align="left">
						<td class="border3 spaceleft headstrength" colspan="5" nowrap><font face="arial" size="2"><b>STRENGTH TRAINING PROGRAMS</b></font></td>

					</tr>
					<tr valign="top" align="left">
						<td class="border3 spaceleft" colspan="2" nowrap><font face="arial" size="2"><b>Name &amp; Description</b></font></td>
						<td class="border3 tdpad tdpadrt" nowrap><font face="arial" size="2"><b>Position</b></font></td>
						<td class="border3 tdpad tdpadrt" nowrap><font face="arial" size="2"><b>Muscles Used</b></font></td>
						<td class="border3 tdpad" nowrap><font face="arial" size="2"><b>Details</b></font></td>
					</tr>

<tr valign="top" align="left"><td class="spaceleft separator"><input type="radio" name="selectprogram" value="307"></td><td class="tdpad tdpadrt separator"><div class="textdesc"><font face="arial" size="2"><b>Custom Strenth 1</b><br /><br /><i>This is the long format description for this program. This is the long format description for this program. This is the long format description for this program. This is the long format description for this program. This is the long format description for this program. This is the long format description for this program. This is the long format description for this program. This is the long format description for this program. This is the long format description for this program. This is the long format description for this program. This is the long format description for this program.</i></font></div></td><td class="tdpad tdpadrt separator border4" nowrap><font face="arial" size="2"></font></td><td class="tdpad tdpadrt separator border4"><img src="art/mm_muscle_small_background.png" width="196" height="147" border="0" /></td><td class="tdpad separator border4"><table border="0" cellspacing="0" cellpadding="0"><tr valign="top" align="left"><td nowrap><font face="arial" size="2">Days/Week</font></td><td class="tdpad"><font face="arial" size="2">1.5<br />&nbsp;</font></td></tr><tr valign="top" align="left"><td><font face="arial" size="2">Level</font></td><td class="tdpad"><font face="arial" size="2">Beginner, Intermediate, Advanced<br />&nbsp;</font></td></tr><tr valign="top" align="left"><td nowrap><font face="arial" size="2">Equipment Used</font></td><td class="tdpad"><font face="arial" size="2">None Required</font></td></tr></table></td></tr><tr valign="top" align="left"><td class="spaceleft separator"><input type="radio" name="selectprogram" value="5051"></td><td class="tdpad tdpadrt separator"><div class="textdesc"><font face="arial" size="2"><b>Dumbbells Only- Full Body</b><br /><br /><i>An intermediate strength program for full body with the use of dumbbells only. This is a 3 day a week program.</i></font></div></td><td class="tdpad tdpadrt separator border4" nowrap><font face="arial" size="2">Standing<br /><br />Sitting<br /><br />Supine</font></td><td class="tdpad tdpadrt separator border4"><div class="muscle_small_shoulders"><img src="art/mm_muscle_small_shoulders.png" width="196" height="147" border="0" /></div><div class="muscle_small_chest"><img src="art/mm_muscle_small_chest.png" width="196" height="147" border="0" /></div><div class="muscle_small_upperback"><img src="art/mm_muscle_small_upperback.png" width="196" height="147" border="0" /></div><div class="muscle_small_biceps"><img src="art/mm_muscle_small_biceps.png" width="196" height="147" border="0" /></div><div class="muscle_small_triceps"><img src="art/mm_muscle_small_triceps.png" width="196" height="147" border="0" /></div><div class="muscle_small_glutes"><img src="art/mm_muscle_small_glutes.png" width="196" height="147" border="0" /></div><div class="muscle_small_hamstrings"><img src="art/mm_muscle_small_hamstrings.png" width="196" height="147" border="0" /></div><div class="muscle_small_quads"><img src="art/mm_muscle_small_quads.png" width="196" height="147" border="0" /></div><img src="art/mm_muscle_small_background.png" width="196" height="147" border="0" /></td><td class="tdpad separator border4"><table border="0" cellspacing="0" cellpadding="0"><tr valign="top" align="left"><td nowrap><font face="arial" size="2">Days/Week</font></td><td class="tdpad"><font face="arial" size="2">3.0<br />&nbsp;</font></td></tr><tr valign="top" align="left"><td><font face="arial" size="2">Level</font></td><td class="tdpad"><font face="arial" size="2">Intermediate<br />&nbsp;</font></td></tr><tr valign="top" align="left"><td nowrap><font face="arial" size="2">Equipment Used</font></td><td class="tdpad"><font face="arial" size="2">Dumbbells</font></td></tr></table></td></tr><tr valign="top" align="left"><td class="spaceleft separator"><input type="radio" name="selectprogram" value="5413"></td><td class="tdpad tdpadrt separator"><div class="textdesc"><font face="arial" size="2"><b>Free Weights #02</b><br /><br /><i>A Monday, Wednesday, Friday program that consists of upper and lower body exercises using either dumbbells or free weights.</i></font></div></td><td class="tdpad tdpadrt separator border4" nowrap><font face="arial" size="2">Supine<br /><br />Standing</font></td><td class="tdpad tdpadrt separator border4"><div class="muscle_small_shoulders"><img src="art/mm_muscle_small_shoulders.png" width="196" height="147" border="0" /></div><div class="muscle_small_chest"><img src="art/mm_muscle_small_chest.png" width="196" height="147" border="0" /></div><div class="muscle_small_biceps"><img src="art/mm_muscle_small_biceps.png" width="196" height="147" border="0" /></div><div class="muscle_small_triceps"><img src="art/mm_muscle_small_triceps.png" width="196" height="147" border="0" /></div><div class="muscle_small_abs"><img src="art/mm_muscle_small_abs.png" width="196" height="147" border="0" /></div><div class="muscle_small_glutes"><img src="art/mm_muscle_small_glutes.png" width="196" height="147" border="0" /></div><div class="muscle_small_hamstrings"><img src="art/mm_muscle_small_hamstrings.png" width="196" height="147" border="0" /></div><div class="muscle_small_quads"><img src="art/mm_muscle_small_quads.png" width="196" height="147" border="0" /></div><img src="art/mm_muscle_small_background.png" width="196" height="147" border="0" /></td><td class="tdpad separator border4"><table border="0" cellspacing="0" cellpadding="0"><tr valign="top" align="left"><td nowrap><font face="arial" size="2">Days/Week</font></td><td class="tdpad"><font face="arial" size="2">3.0<br />&nbsp;</font></td></tr><tr valign="top" align="left"><td><font face="arial" size="2">Level</font></td><td class="tdpad"><font face="arial" size="2">Beginner, Intermediate<br />&nbsp;</font></td></tr><tr valign="top" align="left"><td nowrap><font face="arial" size="2">Equipment Used</font></td><td class="tdpad"><font face="arial" size="2">Dumbbells, Exercise Ball</font></td></tr></table></td></tr><tr valign="top" align="left"><td class="spaceleft separator"><input type="radio" name="selectprogram" value="5419"></td><td class="tdpad tdpadrt separator"><div class="textdesc"><font face="arial" size="2"><b>Free Weights #10</b><br /><br /><i>A full body workout that takes place on Monday, Wednesday and Friday featuring a variety of upper and lower body exercises using free weights, dumbbells and body weight for the resistance.</i></font></div></td><td class="tdpad tdpadrt separator border4" nowrap><font face="arial" size="2">Standing<br /><br />Supine</font></td><td class="tdpad tdpadrt separator border4"><div class="muscle_small_shoulders"><img src="art/mm_muscle_small_shoulders.png" width="196" height="147" border="0" /></div><div class="muscle_small_chest"><img src="art/mm_muscle_small_chest.png" width="196" height="147" border="0" /></div><div class="muscle_small_upperback"><img src="art/mm_muscle_small_upperback.png" width="196" height="147" border="0" /></div><div class="muscle_small_biceps"><img src="art/mm_muscle_small_biceps.png" width="196" height="147" border="0" /></div><div class="muscle_small_triceps"><img src="art/mm_muscle_small_triceps.png" width="196" height="147" border="0" /></div><div class="muscle_small_abs"><img src="art/mm_muscle_small_abs.png" width="196" height="147" border="0" /></div><div class="muscle_small_lowerback"><img src="art/mm_muscle_small_lowerback.png" width="196" height="147" border="0" /></div><div class="muscle_small_glutes"><img src="art/mm_muscle_small_glutes.png" width="196" height="147" border="0" /></div><div class="muscle_small_hamstrings"><img src="art/mm_muscle_small_hamstrings.png" width="196" height="147" border="0" /></div><div class="muscle_small_quads"><img src="art/mm_muscle_small_quads.png" width="196" height="147" border="0" /></div><div class="muscle_small_calves"><img src="art/mm_muscle_small_calves.png" width="196" height="147" border="0" /></div><img src="art/mm_muscle_small_background.png" width="196" height="147" border="0" /></td><td class="tdpad separator border4"><table border="0" cellspacing="0" cellpadding="0"><tr valign="top" align="left"><td nowrap><font face="arial" size="2">Days/Week</font></td><td class="tdpad"><font face="arial" size="2">3.0<br />&nbsp;</font></td></tr><tr valign="top" align="left"><td><font face="arial" size="2">Level</font></td><td class="tdpad"><font face="arial" size="2">Intermediate, Advanced<br />&nbsp;</font></td></tr><tr valign="top" align="left"><td nowrap><font face="arial" size="2">Equipment Used</font></td><td class="tdpad"><font face="arial" size="2">Dumbbells</font></td></tr></table></td></tr>

		</table>

		</div>



<input type="hidden" name="displaycat" value="Strength Training">
<input type="hidden" name="task" value="">
<input type="hidden" name="previousprogram" value="Strength Training">
</form>

</div>

</body>
</html>

Open in new window

0
 
LVL 6

Accepted Solution

by:
MuffyBunny earned 500 total points
ID: 35071277
I couldn't get it to work either. I think there's an underlying conflict with the id's. I did get it to work when I dropped the style directly into the button tag:

<input type="button" id="nextbutton" onClick="javascript:setprogram('Flexibility','reload');" value="Next" style="cursor:hand;">

Open in new window


This isn't the ideal way to do it, but does work. I'll keep looking, but this is the quick fix of the moment.
0
 

Author Comment

by:bbdesign
ID: 35071329
Good enough, thanks for checking.
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question