Version complète: jsB@nk » Arrière-plan » Contexte effet » Colorés clignotants Popsquares
URL: https://www.javascriptbank.com/colorful-flashing-popsquares.html
Une petite code JavaScript pour exécuter la fraîcheur spectacle impressionnant stade JavaScript sur ​​votre site web. Cette fonctionnalité JavaScript convertit un tableau HTML simple dans les cellules colorées clignotantes. Vous pouvez modifier de nombreuses couleurs différentes immédiatement par un lien clic ou attendre cette JavaScript effet spectacles.Très belle et étonnante de présenter quelques produits chauds sur vos pages d'accueil avec JavaScript. Essayons quelques autres effets impressionnants JavaScript: - JavaScript clignotant carrés - JavaScript onmouseover objet coloré
Version complète: jsB@nk » Arrière-plan » Contexte effet » Colorés clignotants Popsquares
URL: https://www.javascriptbank.com/colorful-flashing-popsquares.html
<script type="text/javascript"> // Copyright 2007 Christopher Thomas // Feel free to do what you want with this, so long as you either // preserve this notice, or a link back to this page.var d;var nodes = [];var hue = 0;var doHue = true;var table;function go() {d = document.getElementById('thediv');table = d.parentNode;for (var y=0; y<5; y++){var d2 = document.createElement("tr");for (var x=0; x<5; x++){var n = document.createElement("td");n.setAttribute("width", "20%");d2.appendChild(n);nodes.push(n);n.setAttribute("num", parseInt(Math.random()*255));}d.appendChild(d2);}setInterval(update, 50);}function update() { if (doHue) hue += 0.01; // create the actual color var redHue = (Math.sin(hue)+1)/2; var greenHue = (Math.sin(hue + Math.PI / 3)+1)/2; var blueHue = (Math.sin(hue + Math.PI * 2 / 3)+1)/2; redHue = redHue * redHue; greenHue = greenHue * greenHue; blueHue = blueHue * blueHue; // ensure a strong color var len = Math.sqrt(redHue*redHue + greenHue*greenHue + blueHue*blueHue); redHue /= len; greenHue /= len; blueHue /= len; table.style.backgroundColor = "rgb("+parseInt(redHue*170)+","+ parseInt(greenHue*170)+","+parseInt(blueHue*170)+")"; for (var ntemp in nodes) { var n = nodes[ntemp]; // stupid MSIE doesn't do for each var c = parseInt(n.getAttribute("num")); c += (Math.random() * 2 - 1)*8; c = Math.min(255, Math.max(90, parseInt(c))); n.setAttribute("num", c); var r = parseInt(c*redHue); var g = parseInt(c*greenHue); var b = parseInt(c*blueHue); n.style.backgroundColor = "rgb("+r+","+g+","+b+")"; }}window.onload = go;</script><table width="100%" height="100%" cellspacing="1" style="background-color: #0000AA;margin:0px;padding:0px;"><tbody id="thediv"></tbody></table> <a href="#" onclick="doHue = !doHue;">Toggle color-cycling</a>