Apply Different Background Color to Promoted Links Tiles

Question

Hello everyone,
Does anybody know a way of changing the background color of each individual tile of Promoted Links? If possible, and if anybody is familiar, I would like to do it using a JS Link file.
Thanks in advanced.
Fausto Capellan, Jr - SharePoint Admin

Answer 1

Hi Fausto,
You could try the script below to set color without randomly change:
<script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script><script type="text/javascript">
$(document).ready(function () {
var id;
var rgb;
var rgb1;
var rgb2;
var rgb3;
for (var i = 0; i < $("div.ms-tileview-tile-content").length; i++){
id = $("div.ms-tileview-tile-content")[i].id;
if(i%2 == 0){
rgb1 = getRgb(0,i);
rgb2 = getRgb(50,i);
rgb3 = getRgb(150,i);
}else{
rgb1 = getRgb(150,i);
rgb2 = getRgb(50,i);
rgb3 = getRgb(0,i);
rgb = "rgb("+rgb1+","+rgb2+","+rgb3+")";
$("#"+id).css("background-color",rgb);
function getRgb(n,i){
var rgbNum = n + i *25;
if (rgbNum < 255){
return rgbNum;
}else{
getRgb(1,1);
</script>
Please set the parameter “n” with number per your situation in the function getRgb(n,i). The screenshot below is my result:
Regards,
Rebecca Tu
TechNet Community Support