jquery.pep.js icon indicating copy to clipboard operation
jquery.pep.js copied to clipboard

Stack elements in order of last clicked

Open modulareverything opened this issue 8 years ago • 1 comments

I'm looking to stack some elements based on when they were last clicked. So basically, whatever was last dragged will sit at the top. When another element is clicked, that will then sit on top of the last, and so on.

Here's what I have so far:

jQuery(function($) {
    $('.menu').pep({
        place : false,
        deferPlacement : true,
        constrainTo : 'window',
        activeClass : 'pep--active',
        drag : function() {
            $('.menu').removeClass('pep--last-active');
        },
        stop : function() {
            $(this.el).addClass('pep--last-active')
        }
    });
});

function rotate($obj, deg){
    $obj.css({
      "-webkit-transform": "rotate("+ deg +"deg)",
         "-moz-transform": "rotate("+ deg +"deg)",
          "-ms-transform": "rotate("+ deg +"deg)",
           "-o-transform": "rotate("+ deg +"deg)",
              "transform": "rotate("+ deg +"deg)"
    });
}

modulareverything avatar Apr 29 '16 11:04 modulareverything

You can accomplish this by shuffling the elements’ source order on drag start: https://jsfiddle.net/zn7pme0y/ Or you could do it using z-index, but it’s a bit more code: https://jsfiddle.net/zn7pme0y/1/

seanCodes avatar Apr 27 '17 01:04 seanCodes