javascript:(function() { var svgNS = "http://www.w3.org/2000/svg"; var svg = document.createElementNS(svgNS, "svg"); svg.style.position = "fixed"; svg.style.width = "0"; svg.style.height = "0"; svg.style.visibility = "hidden"; var filter = document.createElementNS(svgNS, "filter"); filter.id = "filterID"; var animate = document.createElementNS(svgNS, "animate"); animate.setAttribute("attributeName", "baseFrequency"); animate.setAttribute("dur", "30s"); animate.setAttribute("values", "0.02;0.03;0.02"); animate.setAttribute("repeatCount", "indefinite"); var turbulence = document.createElementNS(svgNS, "feTurbulence"); turbulence.setAttribute("type", "turbulence"); turbulence.setAttribute("baseFrequency", "0.02"); turbulence.setAttribute("numOctaves", "2"); turbulence.setAttribute("result", "turbulence"); turbulence.setAttribute("seed", Math.random()); turbulence.appendChild(animate); var animate2 = document.createElementNS(svgNS, "animate"); animate2.setAttribute("attributeName", "scale"); animate2.setAttribute("dur", "61.3s"); animate2.setAttribute("values", "10;50;10"); animate2.setAttribute("repeatCount", "indefinite"); var displacementMap = document.createElementNS(svgNS, "feDisplacementMap"); displacementMap.setAttribute("in2", "turbulence"); displacementMap.setAttribute("in", "SourceGraphic"); displacementMap.setAttribute("scale", "1.5"); displacementMap.setAttribute("xChannelSelector", "R"); displacementMap.setAttribute("yChannelSelector", "G"); displacementMap.appendChild(animate2); filter.appendChild(turbulence); filter.appendChild(displacementMap); svg.appendChild(filter); document.body.appendChild(svg); document.body.style.filter = "url(#filterID)"; })();