Parallax any element on the page using jquery and data attributes

simple parallax

   /*!
    ♡♡♡♡♡♡♡♡♡♡♡
    ♥♥♥♥♥♥♥♥♥♥♥♥♥♥♥♥♥♥
    Parallax functionality
    ♥♥♥♥♥♥♥♥♥♥♥♥♥♥♥♥♥♥
    ♡♡♡♡♡♡♡♡♡♡♡
    */

    $('.parallax').on('mouseover', function () {
        $(this).css('z-index', '99');
    });
    $('.parallax').on('mouseout', function () {
        $(this).css('z-index', 'initial');
    });


    var winScrollTop = 0;

    $.fn.is_on_screen = function () {
        var win = $(window);
        var viewport = {
            top: win.scrollTop(),
            left: win.scrollLeft()
        };
        //viewport.right = viewport.left + win.width();
        viewport.bottom = viewport.top + win.height();

        var bounds = this.offset();
        //bounds.right = bounds.left + this.outerWidth();
        bounds.bottom = bounds.top + this.outerHeight();

        return (!(viewport.bottom < bounds.top || viewport.top > bounds.bottom));
    };

    function parallax() {
        var scrolled = $(window).scrollTop();
        $('.parallax').each(function () {
            if ($(this).is_on_screen()) {
                var firstTop = $(this).offset().top;
                //   var $span = $(this).find(".img");
                var moveTop = (firstTop - winScrollTop) * $(this).attr('data-speed') //speed;
                $(this).css("transform", "translateY(" + -Math.min(0, moveTop) + "px)");
            }

        });
    }