Make images float on any website with Javascript code!

By -

JavaScript

Want to impress someone with your coding skills?

1. Open any website which has some pictures.
2. Simply copy and paste this piece of code on Developer Console in Chrome (Menu > More Tools > Javascript Console) or Web Console in Firefox  (Menu > Developer > Web Console) and hit Enter!


    

  1. javascript: initialFlow = 0;
    2. 

  2. img1 = .1;
    3. 

  3. img1 = .05;
    4. 

  4. img2 = .25;
    5. 

  5. img2 = .24;
    6. 

  6. img3 = 1.6;
    7. 

  7. img3 = .24;
    8. 

  8. img4 = 300;
    9. 

  9. img4 = 200;
    10. 

  10. img5 = 300;
    11. 

  11. img5 = 200;
    12. 

  12. imgCollection = document.getElementsByTagName("img");
    13. 

  13. imgLength = imgCollection.length;
    14. 

  14.  
    15. 

  15. function startFlow() {
    16. 

  16.     for (i = 0; i - imgLength; i++) {
    17. 

  17.         inFlow = imgCollection[i].style;
    18. 

  18.         inFlow.position = 'absolute';
    19. 

  19.         inFlow.left = (Math.sin(initialFlow * img1 + i * img2 + img3) * img4 + img5) + "px";
    20. 

  20.         inFlow.top = (Math.cos(initialFlow * img1 + i * img2 + img3) * img4 + img5) + "px"
    21. 

  21.     }
    22. 

  22.     initialFlow++
    23. 

  23. }
    24. 

  24. setInterval('startFlow()', 5);
    25. 

  25. void(0);
    26.
Now you should see all the pictures floating around making circular loops, isn't that fun?

Comments

Post a Comment

Note: Your comment won't be published if it includes abusive words, disrespect or links to external websites.

Popular posts from this blog

[FIXED] Code::Blocks error: 'cout' was not declared in this scope

By -
Image
Code::Blocks error: 'cout' was not declared in this scope T his is one of the most common errors you get if you download or create a C++ project on your Code::Blocks IDE and try to compile it using GNU GCC compiler (the default compiler in Code::Blocks). This problem is common with people who've recently moved to Code::Blocks from an older IDE. This happens because Code::Blocks fails to see 'cout' keyword as a local scope unless its defined as a standard directory function. Luckily, there are two simple ways to fix this error: Method 1 Use this statement before your main function: using namespace std; So that your code looks something like: #include <iostream> using namespace std; int main() {     cout << "Hello world!";     return 0; } Method 2 Instead of using cout , try using std::cout so that the code looks something like: #include <iostream> int main() {     std::cout << "Hello world!"...
Read more

How to know if someone has read your message with Read Receipt disabled on WhatsApp?

By -
Image
  When a message gets delivered to the receiver, you see a double tick. And when they read the message, the double tick becomes blue. However, if the receiver has disabled/turned off 'Read Receipt' option on their WhatsApp settings, you can only see a double tick after sending a message whether they've read it or not. Thus, making it impossible to guess whether they've seen the message or not. Let's make it possible. Today, I'll show you a small trick with the help of which, you'll be able to know whether or not they have read your message. It works 95% of the times. Steps: First of all, type and send your desired message. Here, I'm using a Windows Phone to illustrate it, it works the same way on Android and iOS devices. Record a 3-4 seconds audio and send it after sending the messages. Next, when they see your messages, there's a high chance that they'll play your recorded audio. As soon as your recording is played, the audio mess...
Read more