JQuery problem in a Joomla template

[jessy]

hello ,
i'm facing a problem in executing a very simple fading effect on an image in jquery , the code works fine but when placed in the index file for a joomla template , nothing at all happens !!the code is not working , i googled and found that i may have to use jQuery.noConflict(); function but also that did not work for me ..pls help i'm stuck

[omerbutt]

can you provide the code or link to the url where you are working , normally when you use the jQuery.noConflict() it means you are using another library along jquery and when you do it , you have to replace the $ from jquery code with jQuery
, for example

$('#my_id').val() 

will be changed to

jQuery.("#my_id").val();

[jessy]

i was testing a small script from W3schools

$(document).ready(function(){
             $('button').click(function(){
             $('p').toggle();
              });

i did not include the source for the jquery library since i found it in the original source code for the joomla template im working on but i also tried including it once again above the following code and also nothing happens

[omerbutt]

which version of joomla are you using joomla versions higher than 1.5 by default include the support for mootools thats why you are having problems running jquery as you have to CALL THE JQUERY BEFORE THE MOOTOOLS LIBRARY IS LOADED AND THEN CALL THE JQUERY.NOCONFLICT() and then load the mootools library if you are designing the component or module for joomla then you may have to use he righ method of loading the libraries from with in the module / component to let joomla arrange the loading of the motools and the jquery library , it would have been better if you provided the index page link where you are calling the jquery so that i may point out to you why this is happening and would be easier for you to know the logic behind this error.
here is an example how i used to manage these conflicts
may be it would help you out

 
$uri = JFactory::getURI();
 
    $filename_js="js/jquery.js";
    $filename_js_2="js/moo-tip.js";
    $filename_js_3="js/reservations.js";
    $filename_js_4="js/MooDialog.js";
    $filename_js_5="js/MooDialog.Alert.js";
    $filename_js_6="js/MooDialog.Confirm.js";
    $filename_js_7="media/system/js/mootools-more.js";
    $filename_css="css/styles.css";    
    $filename_css_2="css/MooDialog.css";
 
        JHTML::Script($filename_js_7,true);
    JHTML::Script($filename_js_4,$path_component);
    JHTML::Script($filename_js_5,$path_component);
    JHTML::Script($filename_js_6,$path_component);
    $document->addScript($path_component.$filename_js_2);
    $document->addScript($path_component.$filename_js);
    $document->addScript($path_component.$filename_js_3);
      $document->addStyleSheet($path_component.$filename_css);
    $document->addStyleSheet($path_component.$filename_css_2);
      $document->addScriptDeclaration($this->customScripts());
 
 

regards,
Omer Aslam

[jessy]

Wow, this helped alot !
problem solved
Thanks a million :)

[omerbutt]

my pleasure :) , please choose the right answer so that it may help others who come here searching for the same issue ,
regards,
Omer Aslam