twitter@js_bankfacebook@jsbankrss@jsbank






9 Funniest JavaScript effects The Internet is getting more and more important, we can use it for working, learning, for entertaining ... Only in the aspect of entertainment, we use the Internet to play the online games, to search, listen & download the favorite songs, videos, movies, ...

The Internet also is the very good environment for studying, it helps us in looking for the materials, solving our problems, getting the supports from the other persons, ... Especially in the field of computers in general, the web programming in particular; many people think the programming languages are only for working, there's no joy in it.


Generate your business videos by AI with voice or just text



Your first FREE AI Video App! Automate Your First AI Video. Create Your Professional Video In 5 Minutes By AI No Equipment Or Video Editing Skill Requred. Effortless Video Production For Content Marketers.
Free UNLMITED AI Video App in Your Hand

Everybody knows the Internet is the environment that we can use for a lot of things. The Internet is getting more and more important, we can use it for working, learning, for entertaining ...

Only in the aspect of entertainment, we use the Internet to play the online games, to search, listen & download the favorite songs, videos, movies, ...

The Internet also is the very good environment for studying, it helps us in looking for the materials, solving our problems, getting the supports from the other persons, ... Especially in the field of computers in general, the web programming in particular; many people think the programming languages are only for working, there's no joy in it.

That's reason I make this post, I just want to say to all: with JavaScript, you can find some little joys; JavaScript can make many funny things that you ever realize. Here's list of funniest things JavaScript can do.

Updated: April 16th, 2013

1. Pictures flying as a snake around the mouse pointer

Pictures flying as a snake around mouse pointer
Just paste the JavaScript below into the address bar of any browser then press Enter, it makes all pictures on the current web page fly around like a snake when you move the pointer.
javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; var DI= document.getElementsByTagName("img"); DIL=DI.length; function A(){for(i=0; i<DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=Math.sin(R*x1+i*x2+x3)*x4+x5+"px"; DIS.top=Math.cos(R*y1+i*y2+y3)*y4+y5+"px"}R++}tag=setInterval('A()',5 );document.onmousedown=function(){clearInterval(tag);for(i=0; i<DIL; i++){DI[i].style.position="static";}}; void(0)

In the above JavaScript, you can change
document.getElementsByTagName("img") to any HTML tag that you want to apply.


Here's some another versions of this effect:
javascript:R=0;x1=.1;y1=.05;x2=.25;y2=.24;x3=1.6;y3=.24;x4=300;y4=200;x5=300;y5=200;DI= document.images;DIL=DI.length;function A(){for(i=0; i<DIL; i++){DIS=DI[ i ].style;DIS.position='absolute' ;DIS.left=Math.sin(R*x1+ i*x2+x3)* x4+x5;DIS.top=Math.cos(R*y1+ i*y2+y3)* y4+y5;} R++;}setInterval('A()',5);void(0);


2. Transform the web page into the eaditable mode

Transform the web page into the eaditable mode
javascript:document.body.contentEditable='true'; document.designMode='on'; void 0
This JavaScript code lets you modify any web page in real-time; and with Firefox, you can even save the modified web pages to your computer. You can do many funny things with the simple JavaScript above, such as: faking the screen capture of some proof, faking some hot news for April Fool's Day... quickly.


3. You must love me

You must love me
Give your lover the link of this effect, then ask her to answer the question "Do you love (marry) me?" and she can't repudiate, lol
<html>

<head>
<title>You must love me</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="copyright" content="http://www.javascriptbank.com" />
<script type="text/javascript">
flag=1
function f1()
{
alert("Yes. you are right ")
}
function f()
{
if(flag==1)
{
Bn.style.top=90
Bn.style.left=500
flag=2
}
else if(flag==2)
{
Bn.style.top=90
Bn.style.left=50
flag=3
}
else if(flag==3)
{
Bn.style.top=235
Bn.style.left=360
flag=1
}
}
</script>
</head>
<body>
<h1 style="position:absolute; left:220px; top:175px; width:auto; height:210px;">Do you love me?</h1>
<div id="By" style="position:absolute; left:285px; top:235px; width:210px;
height:210px;">
<input type="button" value=" YES " onclick="f1undefined)" />
</div>
<div ID="Bn" style="position:absolute; left:360px; top:235px; width:210px; height:210px;">
<input type="button" value=" NO " onmouseover="fundefined)" />
</div>
</BODY>
</html>



Author

Phong Thai Phong Thai is a Web Developer, Web Coder for 20 years with PHP, JavaScript, CSS. He is the creator of JavaScriptBank.com - provide thousands of free JavaScript code examples, web development tips and tricks, helpful blogging guides.

Follow him on twitter@js_bank or connect with him on facebook@jsbank if you want. His websites for your knowledge: javascriptON.com, inOneSec.com, www.gomymobi.com


Google Safe Browsing McAfee SiteAdvisor Norton SafeWeb Dr.Web