I am looking to create a services page similar to this page, in that we have the hover effect with text over the image / icon;
Maybe I am complicating things, but I am thinking a portfolio style page as per Brian’s instructions here;
That way I have a page/category using featured images from my respective posts, however, when a visitor hovers over an image / icon it displays text on a transparent backround.
Brad has previously suggested this; http://demo.hongkiat.com/css3-image-captions/index.html, although I am thinking there must be a way to expand on Brians portfolio page but include an on hover class with text, I just can’t workout how to do it!
Just to recap;
1. a portfolio style page
2. hover over image and you get text overlay on transparent background
3.once you hover, click on an image and you go to a post/post (as per Brian’s portfolio page) describing (in my case) the service.
I guess the perfet scenario would be to use featured image as Brian does and add to that the post title and image caption as the hover text together with a button!
I have had a look at some plug ins but they are not ideal and also heavy, I want light code (responsive) so as not to affect page load.
Brad previously sugested this link; http://demo.hongkiat.com/css3-image-captions/index.html, a good soution, but I would really like to tie it into Genesis – if that makes sense.
I don’t have a page to view as the site is still being built, we are using Modern Portfolio theme.
As you posted this over 3 months ago, I am hoping that you got your issue resolved. If not, please respond back here, and I will escalate for you.
You must be logged in to reply to this topic.
Are you a blogger, web designer, developer, or website owner looking to generate more income?
Promote products for the largest and fastest growing online website platform as part of our affiliate program.