Stimulus Discourse

Convert Jquery Please!

#1

Hello! Help me convert jQuery code to Stimulus Controller

  document.addEventListener("turbolinks:load", function() {
    $(".image").click(function(){
       var img = $(this);
       var src = img.attr('src');
       $("body").append("<div class='popup'>"+
                        "<div class='popup_bg'></div>"+
                        "<img src='"+src+"' class='popup_img' />"+ 
                        "</div>");
       $(".popup").fadeIn(200);
       $(".popup_bg").click(function(){ 
           $(".popup").fadeOut(200);
           setTimeout(function() {
               $(".popup").remove();
           }, 200);
        });
     });
  });

Sorry, maybe I ask a lot, but I couldn’t, I really liked the use of Stimulusjs from the examples.
I know that the click(function()) is clicked(event), but I could not find out anymore.
Tanks

#2

I wrote a post about this here: https://johnbeatty.co/2019/03/13/convert-your-jquery-snippet-to-a-stimulus-controller/

2 Likes