I'm using views fluid grid to display image thumbnails, I would like to know how or if it is possible to add mouse hovering effects to it. It can be anything simple such as border colour change or image effects.

Comments

vm’s picture

should be able to do this with CSS or javascript. I don't have the module installed and without seeing the HTML output it's difficult to aid any further.

Johan Groenewald’s picture

/* Default item style. */
li.views-fluid-grid-item {
/* width and height properties are defined at views_fluid_grid.size.css. */
padding: 3px;
overflow: hidden; /* needed to clip content when explicit width/height is specified. */
list-style-type: none;
background-image: none;
vertical-align: top;
color: #fff;
background-color: #304250;
border: 1px solid #aaa;
}

li.views-fluid-grid-item:hover {
background: #17A1C8;

}

TMHD’s picture

Hi

Where do I place this code ?

vm’s picture

in the custom.css file of your subtheme (assumes you've generated a subtheme and that you are using a custom.css file)

otherwise in the bottom of your main .css file if using a custom theme that isn't a subtheme.