BuddyPress jQuery (Google hosted library) conflict with image crop

I'm using BuddyPress. I finally figured out how to toggle a login box via jQuery. Unfortunately, calling the Google-hosted jQuery library causes a conflict with the image cropper featured with BuddyPress. I spent all day looking up ways to solve this. No dice.

If I delete the first line (the one referencing googleapis.com) my image cropper tool functions just fine, but this prevents me from being able to toggle my login box...

I tried modifying my my bp-functions file without any luck.

I tried solving the issue using the various "answers" found online, including: wp_enqueue, and others. This is so frustrating. Please help me!

 <?php wp_head(); ?>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/j开发者_JAVA百科query/1.5.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".l1").click(function(){
$("#login-panel").toggle();
$("input[type='text']:first", document.forms[0]).focus();
});
});
</script>

---

I had similar problem with the same script.

I saw you found a solution but it didn't work for me. I found another one and decided to post for the people who have this problem. It is a workaround and works for login boxes only but works :)

Since this is a login box - it is only for not logged in users so we will load this particular script only for them.

Here's the code:

if (!is_user_logged_in()) {
    $dir_uri = get_stylesheet_directory_uri();
    echo '<link rel="stylesheet" href="'.$dir_uri.'/css/style-login.css" /> ';
    echo '<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=1.4.2"></script>'; }

Hope this helps somebody :)

---

Problem solved!

final code:

 <?php wp_get_archives('type=monthly&format=link'); ?>
 <?php
 wp_deregister_script('jquery');
 wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js', false, '1.5.0');
 wp_enqueue_script('jquery');
 ?>

<?php wp_head(); ?>

<script type="text/javascript">
$(document).ready(function(){
$(".l1").click(function(){
$("#login-panel").toggle();
$("input[type='text']:first", document.forms[0]).focus();
});
});
</script>

 </head>

This allowed me to remove this line of code:

 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>

Now I'm able to run both scripts conflict free. My login div toggles and I'm able to crop images.