| Issue 263: | Method to retrieve all visible elements for a given event | |
| 6 people starred this issue and may be notified of changes. | Back to list |
I have a lot of events on my calendar and I can really distinguish events, I am tying to make a hover state but I can only hover the even on the same line, if the even is goes to the next line it won't hover ;( i was checking the code and it seems that they dont hover both because they are separated divs. Please look at the screen shoot, I point the cursor on the event and it only hovers the event on the line, it doesnt work on the other line.
Dec 30, 2009
Project Member
#1
adamrs...@gmail.com
Summary:
related pieces of an event contained in a single DIV
Dec 31, 2009
is there any way possible to change the color of the event that the mouse is pointing at ?, because when the calendar has a lot of events its hard to distiguish them.
Jan 13, 2010
Someone ?, please help. I really need it.
Jan 18, 2010
hi neves. this is actually pretty hard and would require some hacking around. here are the general steps i would take, but i can't walk you through it in much more depth than this: 1. attach a className of "event-#" to each event (where # is the id of your event). either do this with `eventRender` of by the className Event Object property (look at docs) 2. in the `eventMouseover` callback, search for all the events that have the class "event-#", and change their color 3. use the `eventMouseout` callback to change their color back
Feb 6, 2010
neves, i am planning on introducing a method that will make this easier.. a method to retrieve all <div>'s for an event. you should be able to pass an ID, or the Event Object itself, and you will get back an array of <div>'s. You can use this in your eventMouseover/eventMouseout handler and it will be a lot easier.
Summary:
Method to retrieve all visible elements for a given event
Status: Accepted Labels: -Type-Defect Type-Enhancement
Jul 30, 2010
@neves.jhenrique
If i understand correctly, you want to change the color of the event the mouse is hovering. Here is how i did it:
eventMouseover: function(event, element, view) {
if (event.className == 'on_demand') {
$(this).css({
"background-color": "green",
"border-color": "green",
"opacity": "0.8",
"filter": "alpha(opacity=80)", /* for IE */
});
} else if (event.className == 'scheduled') {
$(this).css({
"background-color": "#36c",
"border-color": "#36c",
"opacity": "0.8",
"filter": "alpha(opacity=80)", /* for IE */
});
}
},
eventMouseout: function(event, element, view) {
if (event.className == 'on_demand') {
$(this).css({
"background-color": "green",
"border-color": "green",
"opacity": "1",
"filter": "alpha(opacity=100)", /* for IE */
});
} else if (event.className == 'scheduled') {
$(this).css({
"background-color": "#36c",
"border-color": "#36c",
"opacity": "1",
"filter": "alpha(opacity=100)", /* for IE */
});
}
}
In my case, 'on_demand' and 'scheduled' are classNames that i use to distinguish 2 types of events. You may have your own names and if-conditions accordingly.
Aug 25, 2010
Issue 594 has been merged into this issue.
Aug 26, 2010
Sorry, already posted on issue 594 : I might do something wrong but I use the eventRender event to do so: $('#calendar').fullCalendar({ ... eventRender: function(event, element) { event.div=element; } }); And then I can use in any Fullcalendar method like a loop through all clientEvents the event.div to do nice things such as jquery or jquery UI effects: $(event.div).effect("pulsate"); By the way, very very nice work Adam! Laurent
Oct 7, 2010
Issue 628 has been merged into this issue.
Sep 18, 2012
Hi Adam, I would love to have this method you described. I'm just commenting to let you know, in hopes it would raise the priority of this feature being created :) Thanks!
Aug 13, 2013
(No comment was entered for this change.)
Labels:
-Type-Enhancement Type-Feature
Aug 21, 2015
Discussion for this issue has moved to the following URL: https://github.com/fullcalendar/fullcalendar/issues/534 This is because Google Code is shutting down. Apologies if you are being pestered with these notifications. This is a one-time event. Happy coding, Adam
Status:
ExportedToGithub
|
|
| ► Sign in to add a comment |