title: the Javascript "function pageLoad()" doesn't play nice with UpdatePanel
body: <p>So I've got this UpdatePanel. Inside it I have a nifty little jQuery scroll gallery of thumbnails which shows the full image in a container after posting back to get the full image URL from the server. Each thumbnail in the scroll gallery is an imageButton with an onCommand event.</p>
  
  <p>What's happening is that when a thumbnail is clicked it posts back to the server and changes the full image container. Since this is happening in an update panel, I'm using the javascript "function pageLoad(){}" to re-apply my jQuery after the partial postback. It works great! After every postback I don't lose my jQuery visuals.</p>
  
  <p>The problem is that I can only get one post back to work before I have to refresh the page. It seems that after the first postback, the view gets updated, and the pageLoad JS fires to reinitialize the jQuery as expected. The next time I click a thumbnail to see it's full view, I can watch the onCommand event execute on the server, but nothing happens to my view; no full image change, no pageLoad() JS firing. Nothing. It's like the postback doesn't make the round trip and send data back to the client after it's processed on the server.</p>
  
  <p>Not only that, but other update panels also experience the same effect regardless of whether there's a jQuery element in them that would be affected by my pageLoad() JS. The first postback updates the panel fine, but subsequent postbacks appear to do nothing.</p>
  
  <p>I think the problem is with the pageLoad() JS, but I'm not sure what I'm missing.</p>
  
  <p>Here's the JS method which <em>should</em> run after every full or partial postback and appears to be causing my grief. It's located in my &lt; head >.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt; 
    function pageLoad(){   
      $("div.scrollable1").unbind();
      $("div.scrollable").unbind();
      // initialize small scrollable.
      $("div.scrollable1").scrollable({size: 1,clickable: false});
      // initialize scrollable    
      $("div.scrollable").scrollable({size: 1,clickable: false}).mousewheel().find("a[rel]").overlay(); 
    }
  &lt;/script&gt;
  </code></pre>