I am working on a fitness site for my friend.

I created a recipes content type, and created a view for the front page that would show the cover image for the 4 newest recipes.

Currently in views I have three fields selected to show, the recipe title, the cover image (these two I have set to not display), and then a global text which reads like below.

[field_recipe_image] [field_recipe_title]

I have it set so that on hover the recipe image disappears and the title shows up instead, and I am doing this with some simple css.

What I would like to find a way to do is to inject some JQuery into the transition between the image and the title. I really like http://jqueryui.com/effect/#easing example number 31.

My question is how do I put that JQuery effect in the view? Is it something I would put in a global text area or is there something more complex to do?

Thanks for any help

  • If you put the Javascript in the Global text area. It will be very hard for someone who will continue develop your website later on. So can we just get the class of views, make the Jquery effect base on that and put on the scripts.js of your current theme.
    – Stone Vo
    Aug 16, 2013 at 4:04


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.