Archived

This topic is now archived and is closed to further replies.

  • 0

Change image when hovering over box image


Question

Posted · Report post

I was reading this forum and I noticed that the same solution might apply to my customization with different syntax: http://www.pagelines.com/forum/topic/26630-text-color-change-when-hovering-over/

 

I want to have my boxes [section, part of the core framework] images (or media as you call it) change when you hover over them with another image. For example if the image is a simple b&w lightbulb then when you hover over it it would look like a yellow lightbulb (because there is an image of a yellow lightbulb saved on my website that I can call). So what I need is a class that calls this other image when the mouse hovers over the original image saved as. Also there is a field in the box set-up options that is called "Boxes Custom Class" so I am assuming I would simply place the code in that text box. Oh, and I need to make sure that the image hyperlink ("Box Link (Optional)" field) still works. 

 

Any ideas, inputs are greatly appreciated.

 

Thanks

 

 

 

Share this post


Link to post
Share on other sites

1 answer to this question

Posted · Report post

Hi,

I do not believe you can use sprites (image hover changes) in Boxes because the image doesn't let you insert code, and it's very difficult to identify a specific box identifier.  However, there's an option.

 

Visit http://demo.pagelines.me/tools/ and wait a moment for that large page to load. Then click on Grid System. Use the grid in place of your boxes.

 

See http://www.w3schools.com/css/css_image_sprites.asp  to learn more about Sprites.

 

Another option would be to use the WP Boxer plugin, which does uniquely identify each content block (like boxes).

Share this post


Link to post
Share on other sites