Question

我有一个功能，我通过像$('.element').tileHeightInit();这样的元素在触发器上运行。

该功能需要在window.load和window.resize上运行。我想我可以在里面定义另一个函数并在那里运行它，但我认为有一种方法可以使用this来运行它自己的东西。

我的功能：

// master function for resizing tile elements
$.fn.tileHeightInit = function ( 
    args = {
        'breakPoint' : breakPoint,
        'container' : container,
        'squared' : squared,
        'blockMargin' : blockMargin,
    })
{
    var breakPoint = args['breakPoint'],
        container = args['container'],
        squared = args['squared'],
        blockMargin = args['blockMargin'];

    var gridElements = $(this);

    if (typeof(breakPoint)==='undefined') breakPoint = 767;

    if (typeof(container)==='undefined') container = 'body';

    if (typeof(squared)==='undefined') squared = true;

    if (typeof(blockMargin)==='undefined') blockMargin = 30;

    // return false if no elements found;
    if($(container).find(gridElements).length < 1){
        return false;
    }
    // run if window is larger than breakpoint
    if($(window).width() >= breakPoint){
        $(container).each(function(){
            // height reset. Allows tiles to become smaller on risizing.
            $(this).find(gridElements).each(function(){
                $(this).height('auto');
            })

            // Get an array of all element heights
            var elementHeights = $(this).find(gridElements).map(function() {
                // block height datafield
                var dataHeight = $(this).data('block-height');
                // block widht datafield
                var dataWidth = $(this).data('block-width');

                // if squared is enabled
                if(squared === true){

                    // if block is wider than tall, return width as height parameter for quadratic tiles
                    if($(this).height() < $(this).outerWidth() && dataWidth == 1){
                        // return height divided by data-height
                        return $(this).outerWidth();
                    } else{
                        // return width, since tile is wider than it's tall
                        return $(this).height() / dataHeight;
                    }
                } else{
                    // return base height divided by block size;
                    return $(this).height() / dataHeight;
                }
            }).get();

            // Math.max takes a variable number of arguments
            // `apply` is equivalent to passing each height as an argument
            var maxHeight = Math.max.apply(null, elementHeights);

            // Set each height to the max height                
            $(this).find(gridElements).each(function(){
                // variable for data-height attribute
                var dataHeight = $(this).data('block-height');

                // the missing margin the block would have had if split into more
                var marginDiff = (dataHeight - 1) * blockMargin;

                // set height to highest tile * data-height attribute + the margin difference between current block and surrounding blocks
                $(this).height((maxHeight * dataHeight) + marginDiff);


            });
        })
    } else{
        // if smaller than breakpoint (colons collapsed)
        $(container).find(gridElements).each(function(){
            // reset height
            $(this).height('auto');
        })
    }
} //  END tileHeightInit();


$(window).resize(function(){
    $('li').tileHeightInit({
        'breakPoint': 500,
    });
})

基本上我将在多个元素上运行此函数，将它们全部写入resize，load，并且可能更多事件似乎效率低下。

Answer 1

＆＃13;

function cmp($a, $b)
{
    return strcmp($a->manufacturer_name, $b->manufacturer_name);
}

usort($manufacturers , "cmp");

＆＃13;

 
  window.onresize = function(){
    var w = window.outerWidth;
    var h = window.outerHeight;
    console.log('called while resizing',w,h)
}
window.onload = function(){
  console.log('called after loading',document.getElementById('demo'))
}

＆＃13;

Javascript函数在调整大小时运行self

1 个答案: