Could someone help me with the following, I'm just learning jquery and
I had this working with a global variable (I know, bad, but I'm just
learning). I have 4 draggable elements and $this.html(topZIndex); is
only incrementing and displaying in the last one when I mouse over any
of the 4 elements (can be seen here - http://www.iamcorbin.net/tEsT/test.php
(click the drag button to turn it green first, only the gray box will
change on mouseenter). I know this is a problem with my scope, and can
be fixed easily, I'm just not sure what I'm doing wrong. Please Help.

(function($){
        $.fn.draganSort = function(options) {

                var opts = $.extend({}, $.fn.draganSort.defaults, options);

                return this.each(function() {
                        $this = $(this);
                        //make draggable
                        $this.draggable({
                                        containment: opts.container,
                                        ghosting: opts.ghost,
                                        opacity: opts.opac
                        });

                        //set initial zIndex of draggable element
                        $this.css('zIndex','300');

                        //hold the current top element Zlocation
                        var topZIndex = 0;
                        $this.mouseenter(function(){
                                //place element on top
                                var divZIndex = $this.css('zIndex');
                                if($this.css('zIndex') > topZIndex)
                                        topZIndex = $this.css('zIndex');
                                ++topZIndex;
                                $this.html(topZIndex);
                                $this.css('zIndex',topZIndex);
                        }); //end mouseenter

                });
        };
        /*not sure how to implement yet, fixing above first
                           $.fn.draganSort.destroy = function(){
                                $this = $(this)
                                $this.draggable('destroy');
                                $this.unbind('mouseenter');
        };*/
        $.fn.draganSort.defaults = {
                        container: 'parent',
                        ghost: true,
                        opac: 0.7
        };
})(jQuery);

Reply via email to