I have a table where i want to change cell background on mouse over and mouse button down, my current solution doesn't work as I want it to :
function ChangeColor(sender) {
sender.style.backgroundColor = 'yellow';
}
var clicking = false;
$(document).mouseup(function() {
clicking = false;
});
$(document).ready(function() {
$('#Table1 tr').each(function() {
$('td', this).each(function() {
$(this).mousedown(function() {
clicking = true;
});
$(this).mousedown(function(event) {
if (clicking==true) { ChangeColor(this); }
});
});
});
});
Is there any way to make it work like that ?
EDIT: Given your comment above, you could do something like this:
$(document).ready(function() {
isMouseDown = false
$('body').mousedown(function() {
isMouseDown = true;
})
.mouseup(function() {
isMouseDown = false;
});
$('Table1 tr td').mouseenter(function() {
if(isMouseDown)
$(this).css({backgroundColor:'orange'});
});
});
This will color the background of the td
when you mouseover, but only if the mouse button is down.
Sounds like you just want to change the color when you click. If that's the case, it is much simpler than what you're attempting.
$(document).ready() {
$('#Table1 tr td').click(function() {
$(this).css({backgroundColor:'yellow'});
});
});
This will change the background of the td
elements yellow when you click them.
It will be similar to change the color when you mouseover.
EDIT: Just noticed the title of your question.
If you want to trigger a click when you hover...
$(document).ready() {
$('#Table1 tr td').click(function() {
$(this).css({backgroundColor:'yellow'});
})
.mouseenter(function() {
$(this).click();
});
});
...of course, you could eliminate the click
in that case and just change the background with the mouseenter
event.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With