我如何按高度和寬度對html元素進行排序？

我想按高度和寬度對我的html元素進行排序，這樣高度和寬度值最高的元素就會到達頂部。我已經可以按照這個jsfiddle http://jsfiddle.net/hF9WL/中的高度對元素進行排序。但我可以我如何按高度和寬度對html元素進行排序？

div元素「少的寬度，但相同的高度介質」

在這裏不進行排序是代碼：

$('div.sortable').sort(function(a, b) { 
 
    return $(b).height() - $(a).height(); 
 
}).appendTo('#container');

.small { 
 
    height: 100px; 
 
    background-color: blue; 
 
    width: 200px; 
 
} 
 
.medium { 
 
    height: 250px; 
 
    background-color: red; 
 
    width: 400px; 
 
} 
 
.large { 
 
    height: 200px; 
 
    background-color: green; 
 
    width: 300px; 
 
} 
 
.lesser { 
 
    height: 250px; 
 
    background-color: purple; 
 
    width: 200px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> 
 
<div id="container"> 
 
    <div class="sortable small">Small</div> 
 
    <div class="sortable lesser">Less width but the same height as medium</div> 
 
    <div class="sortable medium">Medium</div> 
 
    <div class="sortable large">Large</div> 
 

 
</div>

來源

2016-09-18 Axmed nuur

'height'或'width' ..這一個具有更高的優先級？ –

$('div.sortable').sort(function(a,b) { 
    return $(b).height() - $(a).height() || $(b).width() - $(a).width();; 
}).appendTo('#container');

在這裏，我給了高度更高的優先權和然後寬度。爲完整的解決方案

訪問http://jsfiddle.net/hF9WL/4/我創建

來源

2016-09-18 17:59:47

我如何按高度和寬度對html元素進行排序？

回答

相關問題