I'm working on my first jquery project and have a question regarding the simpletip plugin. I basically have a calendar where the user can click different meeting titles and the corresponding dates get shaded in with a certain color. I am then using the simpletip to display more detailed information about the meeting when the user hovers over that date.
What I want is for the simpletip to only display if the cell is colored in, or "on". When the calendar is blank and no meetings are activated, I don't want all the simpletips to show.
I have tried using an if statement with a .mouseover() - this works at first, when the cells are off, no simpletip. After the meeting is turned on and colored in, the first mouseover does nothing, then the second mouseover shows the simpletip, and then the simpletip remains active even after the cell is turned off.
$("#jan3").mouseover(function() {
if ( meeting1 = "on" ) {
$(this).simpletip({
content: '<b>Meeting</b><br/> 9:00-11:00<br/> Some Room'
});
}
});
Hope this makes sense... please help!
Thank you in advance
*EDIT: Here is an example of one of the buttons to turn a meeting on and off...
$(".button1").click(function() {
if ( meeting1 == "off" ) {
$(".meeting1").stop().animate({ backgroundColor: "#009460", color: "white" }, 1000);
$(".meeting1").css("cursor", "pointer");
plsc = 'on';
}
else {
$(".meeting1").stop().animate({ backgroundColor: "white", color: "black" }, 1000);
$(".meeting1").css("cursor", "default");
plsc = 'off';
}
});
I'm not familiar with simpleTip, but the situation you're describing is familiar.
The easiest solution is to use classes to denote which entries are on/off. And register your simpletip function to those that are only on. You can use the jquery live to have the selector update itself with the states
$("#jan3.stateOn").live('mouseover', function() {
$(this).simpletip({
content: '<b>Meeting</b><br/> 9:00-11:00<br/> Some Room'
});
});
This selector would fire if your ID is jan3 and that item has a class of stateOn. As long as you write code to toggle the states properly, jquery will take care of firing for the correct item.