CODEWITHSUNDEEP
javascriptfullcalendar
muybn
muybn

Reputation: 291

FullCalendar change cell color on mouseover

I want the cell color to change temporarily when users mouseover a day's cell in FullCalendar. The closest I've been able to come is eventMouseover, which only changes color if the cell is clicked (I am looking for hover or mouseover, not click). Without an object like a div, span or td, I find it difficult to apply an "onmouseover" command. Does this make sense? Any suggestions?

Upvotes: 6

Views: 13243

Answers (4)

Muhammad Usman
Muhammad Usman

Reputation: 71

Work like a charm:

.fc-list-item:hover td{
    background-color: red!important;
}

Upvotes: 1

lucasumberto
lucasumberto

Reputation: 134

I overwrited the calendar css this way, using less:

.fc-event:hover{
  border-color: @age-color-blue-dark;
  .fc-content{
    color:  @age-color-blue-dark;
  }
}

the compiled less css:

.fc-event:hover {
  border-color: #1c7d87;
}
.fc-event:hover .fc-content {
  color: #1c7d87;
}

Upvotes: 0

เด็กชาย จากดาวสุข
เด็กชาย จากดาวสุข

Reputation: 21

.fc-day:hover{background:lightblue;cursor: pointer;}

Try this in fullcalendar.min.css or fullcalendar.css

Upvotes: 2

PercivalMcGullicuddy
PercivalMcGullicuddy

Reputation: 5533

I've had success by simply doing this:

 .fc-content td:hover{background: #adf4fa;}

Upvotes: 1

Related Questions