[solved] Hover Effect - Not Sure Where to Begin

[HeatherC]

Hey All!

 

I have my site up and running fairly well but I just wondered if there was a way to change block advertising so that when you hovered over the button it changed the image?

 

Not entirely sure where to begin here or even if it's possible to do it simply in that module (or if I'd be better swapping it for the html block module and re-doing what I have).

 

Any tips?

[vekia]

well it is possible but only with css / tpl modification, in my opinion is better to use html module, you will be able to put there own code, so it will be much easier than modification of the block advertising module.

[HeatherC]

For the sake of argument, what edits would I be looking at in the tpl module?

[vekia]

<a href="ANY_URL" class="myhov"></a>

 

then in css styles file you will have to define the css styles for class that i created (myhov)

 

.myhov {
display:block;
width:200px;
height:200px;
backgrund: red url('url_to_image_here');
clear:both;
overflow:hidden;
}

.myhov:hover {
background: black url('url_to_hover_image_here');
}

[HeatherC]

Thank you! I'll go ahead and give it a try, and if I get really stuck I'll switch over to the html block.

 

Extremely helpful and exactly what I was looking for.

[vekia]

okay, im waiting for your information, then if everything will work well and as you expected - i will mark this topic as solved

 

regards

[HeatherC]

Just made the changes, it looks fantastic! Thank you very much for letting me know how to approach it.

[vekia]

you're welcome

 

glad that i could help you in this case

 

now im going to mark this topic as solved

 

best regards