A playful JavaScript library for adding interactive pranks to web applications
npm install prankjsCollecting workspace information
A playful JavaScript library for adding interactive pranks to web applications
bash
npm install prankjs
`
$3
`html
`
๐ Quick Start
$3
`javascript
import { Pranks } from 'prankjs';
// Shake an element
Pranks.shakeElement('.my-element');
// Create floating images
Pranks.randomFloatingObjects('https://example.com/image.png');
// Display a fake error message
Pranks.fakeError('This is a fake error message!');
`
$3
`html
`
โจ Features
$3
PrankJS offers a variety of standalone pranks:
| Prank | Description |
| ------------------------------------------- | ----------------------------------------------------------- |
| shakeElement(selector) | Makes specified elements shake on the screen |
| floatingObject(options) | Creates a floating image that can be animated and clickable |
| randomFloatingObjects(imageUrl) | Populates the screen with multiple floating images |
| invertColors(duration, delay, repetition) | Temporarily inverts the colors on the page |
| fakeError(message) | Displays a convincing error dialog |
| flipScreen(duration) | Flips the screen upside down |
| gravitySwitch() | Makes elements appear to fall due to gravity |
| keyboardLock() | Temporarily prevents keyboard input |
| mouseTrail() | Creates a trail that follows the mouse cursor |
| disappearingElements() | Makes elements randomly fade out and back in |
| fakeLoadingScreen() | Shows a fake loading screen |
| randomBlur() | Applies random blur effects to elements |
| randomEmoji() | Shows random emojis floating across the screen |
| randomSounds() | Plays random sounds at unpredictable intervals |
| confettiExplosion() | Creates a festive confetti explosion effect |
$3
Scenarios combine multiple pranks for a more immersive experience:
| Scenario | Description |
| ---------------------------------------- | -------------------------------------------------------------------- |
| demoDisruption() | A basic demonstration of multiple pranks |
| officePrank(timing) | Designed for pranking in office environments |
| meetingDisruptor(includeSound) | Perfect for creating simulated technical issues during presentations |
| visualChaos(duration) | Combines various visual effects for maximum impact |
| aprilFools(redirectUrls) | A comprehensive April 1st prank sequence |
| gradualEscalation(baseDelay, fastMode) | Starts with subtle pranks that gradually escalate |
๐ Usage Examples
$3
`javascript
// Import specific pranks
import { Pranks } from 'prankjs';
// Make a button shake
Pranks.shakeElement('#submit-button');
// Create a clickable floating object
Pranks.floatingObject({
url: 'https://example.com/image.png',
width: '100px',
height: '100px',
animate: true,
clickable: true
});
// Invert colors with 3-second duration, no delay, once
Pranks.invertColors(3000, 0, 1);
`
$3
`javascript
import { Scenarios } from 'prankjs';
// Run the office prank with custom timing (5 seconds between pranks)
Scenarios.officePrank(5000);
// Run the visual chaos scenario for 20 seconds
Scenarios.visualChaos(20000);
// Run gradual escalation in fast mode for demos
Scenarios.gradualEscalation(10000, true);
`
โ๏ธ Configuration
Most pranks accept parameters to customize their behavior. For example:
`javascript
// Customize the random floating objects
Pranks.randomFloatingObjects('https://example.com/image.png');
// Custom error message
Pranks.fakeError('Critical system failure! Just kidding!');
// Custom flip screen duration
Pranks.flipScreen(5000);
`
๐งช Browser Compatibility
PrankJS works in all modern browsers:
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
- Opera (latest)
๐จ Disclaimer
PrankJS is designed for fun and entertainment purposes. Please use responsibly:
- Be aware of accessibility considerations
- Do not use pranks that may trigger seizures or other health issues
- Use appropriately in work environments
- Consider your audience when implementing pranks
๐ค Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
1. Fork the repository
2. Create your feature branch (git checkout -b feature/amazing-prank)
3. Commit your changes (git commit -m 'Add some amazing prank')
4. Push to the branch (git push origin feature/amazing-prank`)