Prototype: Simple click function

Question

I don't know the Prototype framework, and I need to translate a simple jQuery script to prototype.

This is jQuery:

$(document).ready(function(){

  $(".menu_button").toggle(
      function() { $("#nav_bg").css('display','block');},
      function() { $("#nav_bg").css('display','none');}
  );
});

Anyone can help me tralating it to prototype?

Thanks!

gbtimmon · Accepted Answer · 2012-05-22 18:12:03Z

2

document.observe('dom:loaded' , function(){
    $$('.menu_button').each(function(s) { 
        s.observe('click', function(){
            $('nav_bg').toggle();
        });
    });
 });

I think this will work. I dont think you have to be explicit about the display:block, Im not sure how prototype decides which display it decides to give an object on toggle, but its usually pretty good about picking the right one.

If you do need to be explicit

document.observe('dom:loaded' , function(){
    $$('.menu_button').each(function(s) { 
        s.observe('click', function(){
            if ( $('nav_bg').getStyle('display') === 'block')
                $('nav_bg').setStyle({'display' : 'none'});
            else
                $('nav_bg').setStyle({'display' : 'block'});
        });
    });
});

Not very graceful, and Im sure prototype has a better way of doing it. But Im not a master and this will get it done.

answered May 22, 2012 at 18:12

gbtimmon

4,3721 gold badge24 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Pennywise83 Over a year ago

Thank you! This will be also a good exercise to learn Prototype! The second one works, thanks a lot!

Collectives™ on Stack Overflow

Prototype: Simple click function

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related