Hey guys,
who is good at javascript and can turn the following code that is based on the jQuery framework into Prototype? This would add a nice dropdown menu like on flickr to BeWelcome but we really can't afford to include another javascript framework in our application!
The code:
<script type="text/javascript">
$(document).ready(function(){
$("#nicemenu img.arrow").click(function(){
$("span.head_menu").removeClass('active');
submenu = $(this).parent().parent().find("div.sub_menu");
if(submenu.css('display')=="block"){
$(this).parent().removeClass("active");
submenu.hide();
$(this).attr('src','arrow_hover.png');
}else{
$(this).parent().addClass("active");
submenu.fadeIn();
$(this).attr('src','arrow_select.png');
}
$("div.sub_menu:visible").not(submenu).hide();
$("#nicemenu img.arrow").not(this).attr('src','arrow.png');
})
.mouseover(function(){ $(this).attr('src','arrow_hover.png'); })
.mouseout(function(){
if($(this).parent().parent().find("div.sub_menu").css('display')!="block"){
$(this).attr('src','arrow.png');
}else{
$(this).attr('src','arrow_select.png');
}
});
$("#nicemenu span.head_menu").mouseover(function(){ $(this).addClass('over')})
.mouseout(function(){ $(this).removeClass('over') });
$("#nicemenu div.sub_menu").mouseover(function(){ $(this).fadeIn(); })
.blur(function(){
$(this).hide();
$("span.head_menu a").removeClass('active');
});
});
</script>