Getting 2 jQuery function working

[PrPrO]

Hello,

I have 2 jQuery functions on 1 page, those are: Lighbtbox 2.51 and a jQuery treeview.
The treeview itself works great, and so does lightbox itself
but whenever I input the lighbtbox jquery script, the treeview no longer works, only the lighbotx does. How can i get both functions working at the same time?
When i delete <script src="js/jquery-1.7.2.min.js"></script>, the lighbox doesnt work, but the treeview does
When i delete the <script src="js/jquery.js" type="text/javascript"></script> the treeview doesn't work, but the lighbtox does

Thank you in advance!

Here is the code:


<!-- This is the treeview -->
<link rel="stylesheet" href="../jquery.treeview.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../lib/jquery.cookie.js" type="text/javascript"></script>
<script src="../jquery.treeview.js" type="text/javascript"></script>

<script type="text/javascript" src="demo.js"></script>
<!-- Treeview ends here -->

<!-- Here starts Lightbox -->
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/lightbox.js"></script>
<link href="css/lightbox.css" rel="stylesheet" />
<!-- Lightbox ends here -->

[jscheuer1]

There could also be other problems. Here's the optimal sequence for the beginning of a page like that:


<!-- DOCTYPE, opening HTML tag, opening head tag, title, then any meta tags go here,
no comment before the DOCTYPE tag, which should be standards invoking -->

<!-- styles should be next, put your other styles here if any -->
<link rel="stylesheet" href="../jquery.treeview.css" />
<link href="css/lightbox.css" rel="stylesheet" />
<!-- end styles -->

<!-- only one copy of jQuery, latest is probably best -->
<script src="js/jquery-1.7.2.min.js"></script>

<!-- scripts for treeview -->
<script src="../lib/jquery.cookie.js" type="text/javascript"></script>
<script src="../jquery.treeview.js" type="text/javascript"></script>

<script type="text/javascript" src="demo.js"></script>
<!-- treeview scripts ends here -->

<!-- script for lightbox -->
<script src="js/lightbox.js"></script>
<!-- lightbox script ends here -->

<!-- any other scripts for the page can go here -->

The main issue is that there should be only one copy of jQuery, and it should come before any and all scripts that need it. With two or more copies of jQuery, subsequent copies overwrite those before and scripts that used the earlier one(s) can often break when the copy they were initialized to is overwritten. That's because many jQuery plugins like Lightbox and Treeview actually expand jQuery. If that copy of jQuery is overwritten, the added functionality required for the plugin is lost.

Styles should always come before scripts in the head. If they don't, in some browsers they will not be parsed in time for the initial page load, leading to jumpiness and/or to items that are supposed to be initially hidden appearing for a short or even sometimes a long period of time.

The title and meta tags as indicated above should be before the styles, again for optimal parsing during the load of the page.

The browser cache may need to be cleared and/or the page refreshed to see changes.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

[PrPrO]

Hello,

Thank you for your fast reply and thank you very much for solving my problem :D
The script order fixed the problem. Thank you once more