<script type=
"text/javascript"
src=
"http://code.jquery.com/jquery-1.10.2.min.js "
></script>
>
$(document).ready(
function
() {
// Update this value to the number of links you want to show per row
var
numberOfLinksPerRow = 4;
// local variables
pre =
"<tr><td><div class='ms-promlink-body' id='promlink_row_"
;
post =
"'></div></td></tr>"
numberOfLinksInCurrentRow = numberOfLinksPerRow;
currentRow = 1
// find the number of promoted links we're displaying
numberOfPromotedLinks = $(
'.ms-promlink-body > .ms-tileview-tile-root'
).length;
// if we have more links then we want in a row, let's continue
if
(numberOfPromotedLinks > numberOfLinksPerRow) {
// we don't need the header anymore, no cycling through links
$(
'.ms-promlink-root > .ms-promlink-header'
).empty();
// let's iterate through all the links after the maximum displayed link
for
(i = numberOfLinksPerRow + 1; i <= numberOfPromotedLinks; i++) {
// if we're reached the maximum number of links to show per row, add a new row
// this happens the first time, with the values set initially
(numberOfLinksInCurrentRow == numberOfLinksPerRow) {
// i just want the 2nd row to
currentRow++;
// create a new row of links
'.ms-promlink-root > table > tbody:last'
).append(pre + currentRow + post);
// reset the number of links for the current row
numberOfLinksInCurrentRow = 0 }
// move the Nth (numberOfLinksPerRow + 1) div to the current table row
'.ms-promlink-body > .ms-tileview-tile-root:nth-child('
+ (numberOfLinksPerRow + 1) +
')'
).appendTo($(
'#promlink_row_'
+ currentRow));
// increment the number of links in the current row
numberOfLinksInCurrentRow++; }
}
});
</script>
Benoit Jester edited Revision 1. Comment: Mise en page
Benoit Jester edited Original. Comment: Initialisation