Using jquery and prototype

Question

im using lightbox.js it needs prototype.js and i need to use jquery.js. Now both of these libraries dont work together. Can someone explain how to do noconflict?

The manual on jquery website said i needed to include the prototype.js right after i called noconflict within the script tags, im not sure how to do this. these are the two files that need prototype

<script type="text/javascript" src="includes/jquery/lightbox/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="includes/jquery/lightbox/js/lightbox.js"></script>

If at all possible, do yourself the favour and use only one of the libraries. There are many lightbox alternatives for jQuery. — Pekka
– Pekka, Commented Feb 18, 2012 at 18:29
When making a JavaScript question, it's usually a good idea to create a jsFiddle test case. — millimoose
– millimoose, Commented Feb 18, 2012 at 18:34
@Inerdial: Generally that's true, but not for this kind of question. — ThiefMaster
– ThiefMaster, Commented Feb 18, 2012 at 18:44
Because the fact that he's mixing jQuery and prototype explains enough. — ThiefMaster
– ThiefMaster, Commented Feb 19, 2012 at 20:16

ThiefMaster · Accepted Answer · 2012-02-18 18:43:02Z

1

The answer is simply: Use a jQuery-based lightbox alternative. Colorbox is pretty good for example.

However, noConflict is pretty easy, too:

After including jQuery, run this code: jQuery.noConflict();. To keep using $ in your code, wrap it with the following:

(function($) {
    // your code
})(jQuery);

answered Feb 18, 2012 at 18:43

ThiefMaster

320k85 gold badges608 silver badges648 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

prodigitalson · Accepted Answer · 2012-02-18 18:47:09Z

0

I agree with everyone elese. If jQuery is a requirement, then switch to a jQuery based light box. There are a TON of them.

That said this is waht the documentation means:

<!-- inc. jquery and call noConflict -->
<script type="text/javascript" src="includes/jquery/jquery.js"></script>
<script type="text/javascript">
  jQuery.noConflict();
</script>

<!-- inc. inc. prototype stuff -->
<script type="text/javascript" src="includes/jquery/lightbox/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="includes/jquery/lightbox/js/lightbox.js"></script>

answered Feb 18, 2012 at 18:47

prodigitalson

60.6k10 gold badges106 silver badges118 bronze badges

1 Comment

Marshall Mathews Over a year ago

i switched to shadowbox which is jquery plugin :D

Collectives™ on Stack Overflow

Using jquery and prototype

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related