This is what Iam trying to do.

I have added the jquery47 module. Enabled it.

Created a test java script file called testjavascript.js with the following contents


$JQ(document).ready(function(){
                        $JQ("p.jtest").fadeIn(6000);
                        });

Then I created a story in drupal with the following content

<?php

jquery47_add_js('themes/multiflex/javascripts/testjquery.js');
   
?>

<p class="jtest" style="background-color: palegreen; width: 30em;">

This is an example of an effect which is built into the core jQuery
library. This text should fade in after the DOM is loaded. <a
href="http://api.drupal.org/api/HEAD/function/drupal_add_js">
drupal_add_js()</a> was used to add the <a href="http://jquery.com/api/"> fadeIn</a> effect to any paragraph with the class <b>jtest</b>.

</p>

The effect is not working. I tried to debug it myself, but Iam no JS expert. I tried to evaluate using the firefox browser., but it says this

Error: $JQ is not defined
Source File: http://www.cbitworld.com/themes/multiflex/javascripts/testjquery.js
Line: 1

It will be gr8 to know where Iam messing

Thanks

Comments

mfredrickson’s picture

mfredrickson commented
Status: Active » Closed (fixed)

No problem. Glad to help.

The trick here is that you are invoking $JQ("some expression") when you really want JQ("some expression"). You don't need the $.

You may also want to use the drupal native method of running functions when the document loads. I remember having problems trying to use jQuery's method. Here's an example from some code I wrote a while ago:

// Global Killswitch, as per http://drupal.org/node/42779
if (isJsEnabled()) {
  addLoadEvent(viewLinkAttach);
}

function viewLinkAttach () {
	JQ("td.view-field-node_title a").click(viewLinkHandle);
	JQ("div.view-content").prepend('<div class = "ajaxviewsbox"><span></span></div>');
}

Good luck. Feel free to reopen this if you need more help.

arava_phani’s picture

arava_phani commented

Appreciate it. It works