CODEWITHSUNDEEP
javascriptjquerydrupaldrupal-6colorbox
Strong Like Bull
Strong Like Bull

Reputation: 11317

Why is ColorBox not loading properly?

The error I get is:

$ is undefined Line 8

which is: 

$.colorbox({html:'<p>TEST TEST</p>'});

This is how the page renders:

<script type="text/javascript" src="/sites/all/modules/jquery_update/replace/jquery.min.js?Y"></script>
<script type="text/javascript" src="/misc/drupal.js?Y"></script>
<script type="text/javascript" src="/sites/all/modules/fivestar/js/fivestar.js?Y"></script>
<script type="text/javascript" src="/sites/all/modules/extlink/extlink.js?Y"></script>
<script type="text/javascript" src="/sites/all/modules/signwriter/signwriter.js?Y"></script>
<script type="text/javascript" src="/sites/all/modules/thickbox/thickbox.js?Y"></script>

<script type="text/javascript" src="/sites/all/modules/ubercart/uc_roles/uc_roles.js?Y"></script>
<script type="text/javascript" defer="defer" src="/sites/all/modules/admin_menu/admin_menu.js?Y"></script>
<script type="text/javascript" src="/sites/all/libraries/jquery/colorbox/jquery.colorbox.js?Y"></script>
<script type="text/javascript" src="/sites/all/modules/mysite/mysite_module/js/sasapp.js?Y"></script<--($.colorbox({html:'<p>TEST</p>'});)

Upvotes: 1

Views: 4755

Answers (4)

umesh
umesh

Reputation: 11

Please add the scripts the following way:

  1. color.css
  2. jquery.min.js
  3. colorbox.js and please mention css type .
  4. Add doctype at very beginning of page.

I think it will work definitely......

Upvotes: 1

eapen
eapen

Reputation: 579

I suspect that you are calling the function before jquery or colorbox has loaded.

Try changing the call to and put it below the line where you declare the jquery call. 

$(document).ready(function(){
  $.colorbox({html:'<p>TEST TEST</p>'});
);

This will wait for the scripts to load before trying to call the function.

Upvotes: 1

avpaderno
avpaderno

Reputation: 29748

jQuery has a function that allows the jQuery library to be compatible with any other libraries that use $ as function name; if one of the script is causing jQuery to run in compatible way, then the function $ is not defined from jQuery, and you can only use jQuery() to access any jQuery functionality.

If the code in sites/all/modules/jquery_update/replace/jquery.min.js is not corrupted, and it's not a problem caused from the browser, then that is the only possibility I can think of.

To be sure it's not another problem, I would use a non minimized version of the jQuery library. I had some problems with a minimized jQuery library, with some browsers (mainly Internet Explorer 6, but the issue could be present in different browsers).

Upvotes: 1

David Hellsing
David Hellsing

Reputation: 108530

You are not including jQuery properly, please check the source and confirm that you first script src is actually the jQuery source.

Upvotes: 1

Related Questions