ur last option is the best :-)

but, did u try adding prototype.js above jquery.js

-GTG

On 6/29/07, sprak <[EMAIL PROTECTED]> wrote:


Greetings; I am having a bit of trouble getting JQuery 1.1.2 and
Prototype 1.5.0 to play
nice with each other.  Here is my page (abbreviated) and script with
JQuery alone.

HTML:
<html>
<head>
...
<script language="JavaScript" type="text/javascript" src="/design/en/
javascript/finest200706/jquery-latest.js"></script>
<script>
jQuery.noConflict();
</script>
</head>
<body>
...
<div id="mainNav">
<ul id="menu">
<li>
     <a href="/solutions">Solutions</a>
     <ul>
          <li>
               <a class="" href="/solutions/your_needs">Your Needs</a>
               <ul>
                    <li><a class="skip" href="/solutions/your_needs/
network_protection">Network Protection</a></li>
               </ul>
          </li>
     </ul>
</li>
...
<li>
     <a class="open" href="/portal">Portal</a>
     <ul>
          <li><a class="skip" href="/pref">Preferences</a></li>
     </ul>
</li>
</ul>
...
</div>
</body>
</html>


Script:
jQuery(document).ready(function() {
    // mainnav BEGIN
    // add a state on all the menus:
    jQuery("#mainNav > ul li > a + ul").attr("toggle", "down");
    // collapse all but class=open:
    jQuery("#mainNav > ul li > a").not(".open").find("+
ul").slideUp(1).attr("toggle", "up");
    // click handler sub menu on level 1
    jQuery("#mainNav > ul > li > a:not(.skip)").click(function() {
        var menu = jQuery(this).find("+ [EMAIL PROTECTED]'up']");
        menu.slideDown("slow");
        jQuery("#mainNav > ul li > a +
[EMAIL PROTECTED]'down']").slideUp("slow").attr("toggle", "up");
        menu.attr("toggle", "down");
        return false;
    });
    // click handler sub menu on level 2
    jQuery("#mainNav > ul > li > ul > li >
a:not(.skip)").click(function() {
        var menu = jQuery(this).find("+ [EMAIL PROTECTED]'up']");
        menu.slideDown("slow");
        jQuery("#mainNav > ul > li > ul > li > a:not(.open) +
[EMAIL PROTECTED]'down']").slideUp("slow").attr("toggle", "up");
        menu.attr("toggle", "down");
        return false;
    });
    // load page if skipped from accordeon fx:
    jQuery("#mainNav > ul > li a.skip").click(function() {
        document.location.href = jQuery(this).attr("href");
        return true;
    });
    // mainnav END
});


The menu appears with one item already open specified by a <a> tag
with
class="open".  Clicking on a closed menu item slides that menu open
and closes
the one already open.  This sliding effect works fine without
Prototype added.

Once I add Prototype by modifying my HTML like this:
<script language="JavaScript" type="text/javascript" src="/design/en/
javascript/finest200706/jquery-latest.js"></script>
<script language="JavaScript" type="text/javascript" src="/design/en/
javascript/prototype.js"></script>
<script>
jQuery.noConflict();
</script>

The sliding effect stops; no errors are reported in Firebug or the
error console.
Using Firebug, I stepped through the code and found that buried deep
in the
code is a call to filter() that is going awry.

Without Prototype, the filter call gets to the end and properly
selects
the <ul> element from the document via + [EMAIL PROTECTED]'up'].  Once
Prototype
is added, the filter call holds the <ul> element until near the end;
haven't
debugged further, but it clobbers the return result and returns a
useless object.

Has anyone seen this before and know how to fix it other than ditching
Prototype?

Thanks.

- luis


Reply via email to