Trying to use Jquery to do a Cursor Pointer on hover:
$('#example td').hover(function() {
$(this).css('cursor','pointer');
});
I do not want to put it in CSS, I want it in Jquery.
What do I need to do to fix this?
-
1Why don't you want to use CSS?Blender– Blender2012-12-30 17:18:02 +00:00Commented Dec 30, 2012 at 17:18
-
2jQuery isn't a replacement for CSS.Blender– Blender2012-12-30 17:21:16 +00:00Commented Dec 30, 2012 at 17:21
-
5"How can I bang in a nail using a glass bottle?"SLaks– SLaks2012-12-30 17:22:13 +00:00Commented Dec 30, 2012 at 17:22
-
1@DJ Howarth: I don't know what mistake did you get while running your code. I have executed it perfectly in the jsFiddle. May be I guess you probably have forgotten to turn on the jQuery in the jsFiddle while executing it.Arunkumar Srisailapathi– Arunkumar Srisailapathi2012-12-30 17:27:53 +00:00Commented Dec 30, 2012 at 17:27
-
4@Blender It's really great and does all thingsJJJ– JJJ2012-12-30 17:52:59 +00:00Commented Dec 30, 2012 at 17:52
|
Show 2 more comments
3 Answers
It seems to work here after I cleared up your jquery, you forgot to close the first click function and the searchform and button aren't declared in your html (i changed it to #example tr)
Basically your jQuery wasn't that well coded (there also was a line with 5.}) on it that didn't belong there).
I also set the "your framework" to jQuery instead of the standard selected mooTools
This is the complete jQuery code I got after i deleted some unnecessary code:
$(document).ready(function() {
$('#example tr').click(function() {
var href = $(this).find("a").attr("href");
if(href) {
window.location = href;
}
});
$('#example tr').hover(function() {
$(this).css('cursor','pointer');
});
});
Comments
I couldn't comment Tobias Nilsons's answer for some reason, so here it is as an answer.
$('#example td').css('cursor', 'pointer');`
There's no reason why'd you want specify the style as applied on hover anyway. The cursor really only appears on hover, so.
The fiddle: http://jsfiddle.net/Egttj/15/
I'm assuming simply specifying the corresponding rule in a stylesheet causes a little trouble for you. But, yes, as everyone pointed out, it would really be the best and simplest way to do it.
Comments
Comparing the first method
$('#example tr').hover(function() {
$(this).css('cursor','pointer');
});
With the second method
$('#example td').css('cursor', 'pointer');`
I would recommend to stick to the first since it can be extended to whatever jQuery we want like:
$('#example tr').hover(function() {
$(this).css('cursor','pointer');
$(this).click(function() {
var href = $(this).find("a").attr("href");
if(href) {
window.location = href;
}
});
});
