1

I have the content type with image, title and text fields. I deduce views. I want to hover over the image appear the title and text field and a button with link. Example http://demo.weebpal.com/#onepage portfolio section

how to do it?

1
  • 1
    You should give it a shot and then ask questions when you run into a specific problem. How to/tutorial questions do not fit the topic guidelines outlined here Commented Mar 9, 2015 at 22:37

1 Answer 1

1

This is only in part a Drupal question. The part that interests you most is the CSS styling.

As a tutorial, this could take several hours to explain, using the classes, wrappers, fields and so forth. I will jump over the styling, but I hope this will help as well.

As for the view itself, managed by Drupal, it is a little tricky. You need 2 containers in a wrapper. The first container should have the link set on the image and the second container should have the rest of the text and buttons.

Create a page or a block view listing all your nodes you need to include, printing fields.

Add the field image and set it to link to the node itself.

Add the text fields you need, one after the other, in the right order (title on top, text in the middle, button - linked to content - at the end and so forth).

Here comes the Drupal tricky part. Set everything as "exclude from display".

Now, as a last field, add a Global Text Area and print the 2 containers. Use tokens generated by Drupal and include them inside the containers.

  1. For the first container, write down the wrapper code including the link over the image as a token generated by field no. 1.

  2. For the second container, write the code for the wrapper and include inside every token for the hover visible content, in the proper order.

Then you need the right CSS, using position absolute, setting the view wrapper as relative and the second container as absolute.

Good luck.

1
  • And there are more standard tools, modules? by type qtip. I did not find the normal description, such as it allows to do so Commented Mar 9, 2015 at 18:22

Not the answer you're looking for? Browse other questions tagged or ask your own question.