Indexhibit Support

Hello, i was wondering if it was possible to create a "rollover effect" like this site:
Example

This is my website:
Portfolio

I hope you can help me out!

Thanks

The links that i posted don't work...

Example: stefancoisson.com
My site: iamanthonio.com

Hello

No guarantee, but you can try to add those lines to your style.css:

1. .picture {background:#13c97e; } /* the colour you want */
2. a img:hover {opacity:.60; filter:alpha(opacity=60); }
3. .top a img:hover {opacity:1;}

Thanks A lot, this works great! Any idea how i could make al the images black and white with roll over?

It's a bit more complicated. But you can achive that using sprites or HTML5+JQuery.
You can have a look at those links for more informations:
dauidusdesign.com/css-image-sprites/
webdesignerwall.com/tutorials/…

But maybe somebody knows a better/simpler way to do it?

I have a 5px margin bottom with the background color and no idea where it comes from. my images are 5px smaler than the picture container. any idea?

If the class .picture isn't used somewhere else (I didn't check everywhere), you can just add this:

1. .picture {background:#13c97e; height: 127px; }/* the colour you want and the height of your image*/

any idea of rollover effect with text in center overlay on the pic?

Hi, I found a way of getting the caption centered on the pic, when hovering. You need to edit the last lines of format.visual_index.php

simply add this in the .captioning class

{ position: relative; z-index:-1; }

and in the .captioning .title

{ position: relative; z-index:-1; margin-top: -110px; }

Hey,
I wanted to change the opacity as detailed above in LouiseR's post - where do I add that code? In the style.css? If so, can you advise where in it its written?

Or is it in the VI plugin sheet?
Thanks!

Got it now thanks!!
Tris

Hi, does anyone know how I would stop this roll over effect happening on other images on the same page the format is used, for example my logo is effected only on my home page as I am using the Visual Index format with the roll over effect added????

Cheers

jimmyimage.co.uk

Edit

1. a img:hover {opacity:.50; filter:alpha(opacity=50); } 

into

1. #img-container a img:hover {opacity:.50; filter:alpha(opacity=50); } 

I thank you again!! :)