HTML Samples - JankSite.com

.com

news

cool

picx

freebies

add

random

freebies - html samples

incredible html code for your website. this is for pro who already understands html and jscript.. . maybe a bit, so dont question too much when you break your page with any of these and not knowing how html works and learn the process.

redirect pages with a counter in jscript

step 1: make a blank page or use one made already that you desire to redirect to another page.
step 2: copy this code to your page.
<form name="redirect" id="redirect"> <center> <font face="Arial">You will be transported to</font> <br> <br> <form> <font face="Arial"><input type="text" size="3" name="redirect2"></font> </form> <font face="Arial">seconds</font> </center> <script type="text/javascript"> var targetURL="https://www.janksite.com/" var countdownfrom=5 var currentsecond=document.redirect.redirect2.value=countdownfrom+1 function countredirect(){ if (currentsecond!=1){ currentsecond-=1 document.redirect.redirect2.value=currentsecond } else{ window.location=targetURL return } setTimeout("countredirect()",1000) } countredirect() </script>  </form>
step 3: replace 'https://www.janksite.com/' with any website you want to redirect. it's done!
optional: you could also replace the seconds with 'countdownfrom'.

snow effect

step 1: download one of these images below and upload it to your page.

step 2: copy this code to your page.
<script type="text/javascript"> /****************************************** * Snow Effect Script- By Altan d.o.o. (http://www.altan.hr/snow/index.html) * Visit Dynamic Drive DHTML code library (http://www.dynamicdrive.com/) for full source code * Last updated Nov 9th, 05' by DD. This notice must stay intact for use ******************************************/ //Configure below to change URL path to the snow image var snowsrc="snow.gif" // Configure below to change number of snow to render var no = 10; // Configure whether snow should disappear after x seconds (0=never): var hidesnowtime = 0; // Configure how much snow should drop down before fading ("windowheight" or "pageheight") var snowdistance = "pageheight"; ///////////Stop Config////////////////////////////////// var ie4up = (document.all) ? 1 : 0; var ns6up = (document.getElementById&&!document.all) ? 1 : 0; function iecompattest(){ return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body } var dx, xp, yp; // coordinate and position variables var am, stx, sty; // amplitude and step variables var i, doc_width = 800, doc_height = 600; if (ns6up) { doc_width = self.innerWidth; doc_height = self.innerHeight; } else if (ie4up) { doc_width = iecompattest().clientWidth; doc_height = iecompattest().clientHeight; } dx = new Array(); xp = new Array(); yp = new Array(); am = new Array(); stx = new Array(); sty = new Array(); snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "snow.gif" : snowsrc for (i = 0; i < no; ++ i) { dx[i] = 0; // set coordinate variables xp[i] = Math.random()*(doc_width-50); // set position variables yp[i] = Math.random()*doc_height; am[i] = Math.random()*20; // set amplitude variables stx[i] = 0.02 + Math.random()/10; // set step variables sty[i] = 0.7 + Math.random(); // set step variables if (ie4up||ns6up) { if (i == 0) { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>"); } else { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>"); } } } function snowIE_NS6() { // IE and NS6 main animation function doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10; doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight; for (i = 0; i < no; ++ i) { // iterate for every dot yp[i] += sty[i]; if (yp[i] > doc_height-50) { xp[i] = Math.random()*(doc_width-am[i]-30); yp[i] = 0; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); } dx[i] += stx[i]; document.getElementById("dot"+i).style.top=yp[i]+"px"; document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px"; } snowtimer=setTimeout("snowIE_NS6()", 10); } function hidesnow(){ if (window.snowtimer) clearTimeout(snowtimer) for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden" } if (ie4up||ns6up){ snowIE_NS6(); if (hidesnowtime>0) setTimeout("hidesnow()", hidesnowtime*1000) } </script>
step 3: change the value of 'snowsrc' to the corresponding snow filepath. that could be done!
optional: below you can see you can also configure how many snowflakes you want to display, what seconds should disappear and where does needs to disappear if by the end of the window or page.
see how it looks like

blood effect

NOT SUITABLE FOR LITTLE MEN

step 1: download all of these blood drawings below and upload it to your page.

step 2: copy this code to your page, and should be done. make sure if the drawings are on the same directory. if youre pro enough you could change the path for the blood drawings from only looking the code. enjoy!1
<div id="bloodTop" style="position:fixed; z-index: 0; white-space: nowrap; top:0px; left: 0px;"></div> <script type="text/javascript"> function browser(v) { return(Math.max(navigator.userAgent.toLowerCase().indexOf(v),0)); } var wWidth = browser('msie') ? document.body.clientWidth : window.innerWidth; var wHeight = browser('msie') ? document.body.clientHeight : window.innerHeight; function wResize() { var preWidth = wWidth; var preHeight = wHeight; wWidth = browser('msie') ? document.body.clientWidth : window.innerWidth; wHeight = browser('msie') ? document.body.clientHeight : window.innerHeight; if (preWidth != wWidth || preHeight != wHeight) { blood_top.innerHTML = ''; addBloodTop(); } } window.onresize = wResize; function getRandomInt(min, max) { var minCeiled = Math.ceil(min); var maxFloored = Math.floor(max); return Math.floor(Math.random() * (maxFloored - minCeiled) + minCeiled); } function bloodDripping () { var blT, r; setTimeout(() => { blT = document.getElementById('bloodTop_'+getRandomInt(1,b)); r = blT.className.slice(3); blT.src = 'blT'+r+'d.gif'; setTimeout(() => { blT.src = 'blT'+r+'.gif'; bloodDrop(blT); }, 1000); bloodDripping(b); }, 1000*getRandomInt(1,8)); } function bloodDrop (blT) { var d = blood_top.appendChild(document.createElement('img')); var r = blT.className.slice(3); var i = 'bloodDrop' + r + '_' + getRandomInt(1,999); var p = 0; var s = 0.8; var posX = r == 1 ? 24 : r == 2 ? 40 : r == 3 ? 62 : 47; var posY = r == 1 ? 20 : r == 2 ? 15 : r == 3 ? 20 : 15; d.id = i; d.src = 'blD.gif'; d.style.zIndex = 1; d.style.position = 'absolute'; d.style.left = blT.x + posX + 'px'; d.style.top = blT.y + posY + 'px'; p = d.style.top.slice(0, -2); var t = setInterval(() => { if (p > (wHeight - 38)) { clearInterval(t); var iD = document.getElementById(i); if (iD) blood_top.removeChild(iD); return; } p = parseInt(d.style.top.slice(0, -2)) + s; s += s * 0.085; d.style.top = p + 'px'; }, 24); } var blood_top = document.getElementById("bloodTop"); var b = 0; var bloodFrequency = 2; //Change the amount of drops here function addBloodTop() { var r = 0; for (var t = 0; t <= Math.round(wWidth / 103); t++) { b = t + 1; r = getRandomInt(1,4); blood_top.innerHTML += '<img id="bloodTop_'+b+'" class="blT'+r+'" width="103" src="blT'+r+'.gif">'; } } addBloodTop(); for (var i = 0; i < bloodFrequency; i++) bloodDripping(b); </script>
optional: you can change the amount of blood dropping with 'bloodFrequency'.
i made this effect for my main page barrarchiverio.cl during the last week of october 2025. couldve been better but its kind of charming. because of there wasnt one that i was looking for made one by myself, and now you can use it for halloween or, every day of the year! credit would be appreciated.
see how it looks like

design mode

this is something that jscript can allow modify the page content like if it is a word proccessing. cool trick that you could implement it on your page, or even any site!1
step 1: copy this js code.
javascript:document.body.contentEditable = 'true';document.designMode = 'on';void 0;
step 2: paste that code inside of 'onclick' and then copy the whole thing to your page. now users can scramble your site whatever they want :dd.
<button type="button" onclick="">EDIT</button>
optional: if you want that to happen on any website, just copy the code from first step to the address bar and it will be done!
also optional: if you want to leave design mode you can with this code. you could also make a button alonside the edit one to make matters better on your site.
javascript:document.body.contentEditable = 'false';document.designMode = 'off';void 0;
see how it works:
warning that pasting the code to the address bar might not work on every browser.