MediaWiki:Gadget-RainbowHeaders.js: Difference between revisions
From Elwiki
mNo edit summary |
mNo edit summary |
||
(2 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
$('tr.rainbow').each(function(e){ | $('tr.rainbow').each(function(e){ | ||
var colors = [36, 72, 108, 144, 180, 216, 252, 288, 324]; | |||
var tr = $(this); | var tr = $(this); | ||
if(!(tr.css('position') in ['relative', 'absolute'])){ | if(!(tr.css('position') in ['relative', 'absolute'])){ | ||
Line 7: | Line 8: | ||
$(this).children('th').each(function(e){ | $(this).children('th').each(function(e){ | ||
var th = $(this); | var th = $(this); | ||
var | var Hs = Math.round(th.position().left / trWidth * 360); | ||
var | var He = Math.round((th.position().left + th.width()) / trWidth * 360); | ||
var Ps = Math.floor(Hs / 36); | |||
var Pe = Math.ceil(He / 36); | |||
var color = colors.slice(Ps, Pe - Ps - 1); | |||
Hs = Math.max(0, Hs); | |||
He = Math.min(359, He); | |||
if(!color[0] || color[0] != Hs) color.unshift(Hs); | |||
if(!color[color.length] || color[color.length] != He) color.push(He); | |||
var colorString = color.map(function(H){ | |||
return 'hsl(' + H + ', 80%, 80%)'; | |||
}).join(); | |||
colorString = 'linear-gradient(to right, ' + colorString + ')'; | |||
th.css('background-image', colorString); | |||
console.log(colorString, th); | |||
}); | }); | ||
}); | }); |
Latest revision as of 04:35, 4 June 2016
$('tr.rainbow').each(function(e){
var colors = [36, 72, 108, 144, 180, 216, 252, 288, 324];
var tr = $(this);
if(!(tr.css('position') in ['relative', 'absolute'])){
tr.css('position', 'relative');
}
var trWidth = tr.width();
$(this).children('th').each(function(e){
var th = $(this);
var Hs = Math.round(th.position().left / trWidth * 360);
var He = Math.round((th.position().left + th.width()) / trWidth * 360);
var Ps = Math.floor(Hs / 36);
var Pe = Math.ceil(He / 36);
var color = colors.slice(Ps, Pe - Ps - 1);
Hs = Math.max(0, Hs);
He = Math.min(359, He);
if(!color[0] || color[0] != Hs) color.unshift(Hs);
if(!color[color.length] || color[color.length] != He) color.push(He);
var colorString = color.map(function(H){
return 'hsl(' + H + ', 80%, 80%)';
}).join();
colorString = 'linear-gradient(to right, ' + colorString + ')';
th.css('background-image', colorString);
console.log(colorString, th);
});
});