random-text-bg/dist/random-text-bg.min.js

Add randomly scattered, selectable text in the background of your web page.

window.RandomTextBg=function(t={}){const e={text:t.text||"",color:t.color||"rgba(0, 0, 0, 0.3)",fontSize:t.fontSize||"2rem",fontFamily:t.fontFamily||"monospace",zIndex:t.zIndex||-1,randomizeRotation:!1!==t.randomizeRotation,maxWords:t.maxWords||1e3,textSelectable:t.textSelectable||!1,target:t.target||document.body},o=e.target===document.body,n=e.text.split(/\s+/).slice(0,e.maxWords),l=document.createElement("div");l.style.position="absolute",l.style.top=0,l.style.left=0,l.style.width=o?"100vw":"100%",l.style.height=o?"100vh":"100%",l.style.pointerEvents=e.textSelectable?"":"none",l.style.zIndex=e.zIndex,l.style.overflow="hidden",e.target.style.position=e.target.style.position||"relative",n.forEach(t=>{const n=document.createElement("span");n.textContent=t,n.style.position="absolute",n.style.fontSize=e.fontSize,n.style.fontFamily=e.fontFamily,n.style.color=e.color;const a=o?"vh":"%",s=o?"vw":"%";n.style.top=100*Math.random()+a,n.style.left=100*Math.random()+s,e.randomizeRotation&&(n.style.transform=`rotate(${360*Math.random()}deg)`),l.appendChild(n)}),e.target.appendChild(l)};