0

I have found a jquery code which animates colors. I made a fiddle from it (after minor change), and it's working perfectly on jsfiddle: http://jsfiddle.net/kFuzp/

Unfortunately, it's not working on my Drupal site. I have JQuery Update module and updated to 1.8, using jQuery CDN. The code (as in jsfiddle) is inserted using drupal_add_js ($script1, 'inline') in mytheme_preprocess_page(). When I debug the code in Chrome, it just runs (I can observe how the color_index changes etc using breakpoints). But the <p> background color is always white.

By the way, when I change the animation property to { opacity: color_index/7 } then the opacity animation is working (slowly) both in jsfiddle and in Drupal.

Why it's not working in Drupal and how to fix it?

2 Answers 2

0

I was also having the same problem once, I was doing an animation in color change. It was not working for me in Drupal, however for some reason I do not know the color change animation was working when I was logged in as administrator(with admin_menu installed), while as authenticated and anonymous user it was not working.

I used jQuery.Color() plugin and it worked for me. Its written in jQuery.animate() documentation:

All animated properties should be animated to a single numeric value, except as noted below; most properties that are non-numeric cannot be animated using basic jQuery functionality (For example, width, height, or left can be animated but background-color cannot be, unless the jQuery.Color() plugin is used). Property values are treated as a number of pixels unless otherwise specified. The units em and % can be specified where applicable.

Hope that helps!

0

It sounds like you're having a problem with your jQuery selector.

Are you using changing the properties for all paragraphs? Or just a particular one? Or a class?

Below are the selectors for each option respectively:

$("p")...

$("p#theIdofTheParagraph")...

$("p.theClassofTheParagraphs")...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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