title: ZFdebug Jquery interference
body: <p>I use Zend Framework with ZfDebug (<a href="http://code.google.com/p/zfdebug/" rel="nofollow noreferrer">http://code.google.com/p/zfdebug/</a>)
  and a plugin Base64 Encode/Decode. (<a href="http://plugins.jquery.com/project/base64" rel="nofollow noreferrer">http://plugins.jquery.com/project/base64</a>)  </p>
  
  <p>the problem is when i try to make:</p>
  
  <pre><code>$(document).ready(function(){
  
  $('#submit').click(function(e){
      e.preventDefault();
      data = $.base64Encode("something");
  alert(data);
  });
  </code></pre>
  
  <p>});</p>
  
  <p>an error shows up: <strong>$.base64Encode is not a function</strong></p>
  
  <p>If in source is loaded the ZfDebug include scripts</p>
  
  <pre><code>  #ZFDebug_debug { font: 11px/1.4em Lucida Grande, Lucida Sans Unicode, sans-serif; position:fixed; bottom:5px; left:5px; color:#000; z-index: 255;}
              #ZFDebug_debug ol {margin:10px 0px; padding:0 25px}
              #ZFDebug_debug li {margin:0 0 10px 0;}
              #ZFDebug_debug .clickable {cursor:pointer}
              #ZFDebug_toggler { font-weight:bold; background:#BFBFBF; }
              .ZFDebug_span { border: 1px solid #999; border-right:0px; background:#DFDFDF; padding: 5px 5px; }
              .ZFDebug_last { border: 1px solid #999; }
              .ZFDebug_panel { text-align:left; position:absolute;bottom:21px;width:600px; max-height:400px; overflow:auto; display:none; background:#E8E8E8; padding:5px; border: 1px solid #999; }
              .ZFDebug_panel .pre {font: 11px/1.4em Monaco, Lucida Console, monospace; margin:0 0 0 22px}
              #ZFDebug_exception { border:1px solid #CD0A0A;display: block; }
          &lt;/style&gt; 
          &lt;script type="text/javascript" charset="utf-8"&gt; 
              if (typeof jQuery == "undefined") {
                  var scriptObj = document.createElement("script");
                  scriptObj.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js";
                  scriptObj.type = "text/javascript";
                  var head=document.getElementsByTagName("head")[0];
                  head.insertBefore(scriptObj,head.firstChild);
              }
  
              var ZFDebugLoad = window.onload;
              window.onload = function(){
                  if (ZFDebugLoad) {
                      //ZFDebugLoad();
                  }
                  jQuery.noConflict();
                  ZFDebugCollapsed();
              };
  
              function ZFDebugCollapsed() {
                  if (0 == 1) {
                      ZFDebugPanel();
                      jQuery("#ZFDebug_toggler").html("&amp;#187;");
                      return jQuery("#ZFDebug_debug").css("left", "-"+parseInt(jQuery("#ZFDebug_debug").outerWidth()-jQuery("#ZFDebug_toggler").outerWidth()+1)+"px");
                  }
              }
  
              function ZFDebugPanel(name) {
                  jQuery(".ZFDebug_panel").each(function(i){
                      if(jQuery(this).css("display") == "block") {
                          jQuery(this).slideUp();
                      } else {
                          if (jQuery(this).attr("id") == name)
                              jQuery(this).slideDown();
                          else
                              jQuery(this).slideUp();
                      }
                  });
              }
  
              function ZFDebugSlideBar() {
                  if (jQuery("#ZFDebug_debug").position().left &gt; 0) {
                      document.cookie = "ZFDebugCollapsed=1;expires=;path=/";
                      ZFDebugPanel();
                      jQuery("#ZFDebug_toggler").html("&amp;#187;");
                      return jQuery("#ZFDebug_debug").animate({left:"-"+parseInt(jQuery("#ZFDebug_debug").outerWidth()-jQuery("#ZFDebug_toggler").outerWidth()+1)+"px"}, "normal", "swing");
                  } else {
                      document.cookie = "ZFDebugCollapsed=0;expires=;path=/";
                      jQuery("#ZFDebug_toggler").html("&amp;#171;");
                      return jQuery("#ZFDebug_debug").animate({left:"5px"}, "normal", "swing");
                  }
              }
  
              function ZFDebugToggleElement(name, whenHidden, whenVisible){
                  if(jQuery(name).css("display")=="none"){
                      jQuery(whenVisible).show();
                      jQuery(whenHidden).hide();
                  } else {
                      jQuery(whenVisible).hide();
                      jQuery(whenHidden).show();
                  }
                  jQuery(name).slideToggle();
              }
          &lt;/script&gt; 
  </code></pre>
  
  <p>and also have a 
  <code>&lt;script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'&gt;&lt;/script&gt;</code></p>
  
  <p>in my head element of html they are interferencing each other. (Jquery loads twice)<br>
  If I set my application from development to production the ZfDebug generated script includes will not show up, and my jquery callings are working fine.<br>
  But I have to be able in development mode to be able to use Jquery, any suggestions?</p>