jQuery document ready conflicting with window onload?
<p>I am trying to hack together a video gallery. I am using jQuery to make a slide out panel 
which is simple. I am also using jQuery for scrolling thumbnails. They both work beautifully. The problem is that I need the scrolling thubmnails to work inside the slide out panel but it won't. I think it has to do with the two functions on being document ready and the other being  window onload. I'm not sure cause I am new to jQuery. Can any one help with this. </p>

<p>Here is the slide out panel function.</p>

<pre><code> $(document).ready(function(){
$(".trigger").click(function(){
    $(".panel").toggle("fast");
    $(this).toggleClass("active");
    return false;
});
});
</code></pre>

<p>And her is the scrolling function. </p>

<pre><code> &lt;script&gt;
 jQuery.noConflict() 
(function($){
window.onload=function(){ 
$("#tS2").thumbnailScroller({ 
    scrollerType:"clickButtons", 
    scrollerOrientation:"horizontal", 
    scrollSpeed:2, 
    scrollEasing:"easeOutCirc", 
    scrollEasingAmount:600, 
    acceleration:4, 
    scrollSpeed:800, 
    noScrollCenterSpace:10, 
    autoScrolling:0, 
    autoScrollingSpeed:2000, 
    autoScrollingEasing:"easeInOutQuad", 
    autoScrollingDelay:500 
});
}
})(jQuery);
&lt;/script&gt;
</code></pre>

<p>Can anyone see anything here that would conflict with each other?</p>

<p>Here is the whole html. </p>

<pre><code> &lt;html&gt;

&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
&lt;title&gt;Vertical Sliding Info Panel With jQuery&lt;/title&gt;
&lt;link rel="stylesheet" href="style.css" type="text/css" media="screen" /&gt;
&lt;link href="jquery.thumbnailScroller.css" rel="stylesheet" /&gt;
&lt;script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"&gt;&lt;/script&gt;
&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"&gt;&lt;/script&gt;
&lt;script src="jquery-ui-1.8.13.custom.min.js"&gt;&lt;/script&gt;

&lt;script&gt;
$(document).ready(function(){
$(".trigger").click(function(){
    $(".panel").toggle("fast");
    $(this).toggleClass("active");
    return false;
});
});
&lt;/script&gt;
&lt;/head&gt;

&lt;body&gt;

&lt;div class="panel"&gt;
&lt;div&gt;
&lt;div id="tS2" class="jThumbnailScroller"&gt;
&lt;div class="jTscrollerContainer"&gt;
    &lt;div class="jTscroller"&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img1.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img2.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img3.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img4.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img5.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img6.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img7.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img8.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img9.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img10.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img11.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img12.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img13.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img14.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img15.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img16.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img17.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img18.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img19.jpg" /&gt;&lt;/a&gt;
        &lt;a href="#"&gt;&lt;img src="thumbs/img20.jpg" /&gt;&lt;/a&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;a href="#" class="jTscrollerPrevButton"&gt;&lt;/a&gt;
&lt;a href="#" class="jTscrollerNextButton"&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;!-- thumbnail scroller markup end --&gt;

&lt;script&gt;
/* jQuery.noConflict() for using the plugin along with other libraries. 
 You can remove it if you won't use other libraries (e.g. prototype, scriptaculous etc.) or 
 if you include jQuery before other libraries in yourdocument's head tag. 
 [more info: http://docs.jquery.com/Using_jQuery_with_Other_Libraries] */
jQuery.noConflict(); 
/* calling thumbnailScroller function with options as parameters */
(function($){
window.onload=function(){ 
$("#tS2").thumbnailScroller({ 
    scrollerType:"clickButtons", 
    scrollerOrientation:"horizontal", 
    scrollSpeed:2, 
    scrollEasing:"easeOutCirc", 
    scrollEasingAmount:600, 
    acceleration:4, 
    scrollSpeed:800, 
    noScrollCenterSpace:10, 
    autoScrolling:0, 
    autoScrollingSpeed:2000, 
    autoScrollingEasing:"easeInOutQuad", 
    autoScrollingDelay:500 
});
}
})(jQuery);
 &lt;/script&gt;
&lt;!-- thumbnailScroller script --&gt;
&lt;script src="jquery.thumbnailScroller.js"&gt;&lt;/script&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;a class="trigger" href="#"&gt;infos&lt;/a&gt;

&lt;/body&gt;
&lt;/html&gt;
</code></pre>
