Toggle navigation
Sign Up
Log In
Explore
Works
Folders
Tools
Collections
Artists
Groups
Groups
Topics
Tasks
Tasks
Jobs
Teams
Jobs
Recommendation
More Effects...
JS
document.getElementById("myButton").addEventListener("click", function() { alert("Hello! This is your surprise effect."); });
CSS
/* Basic Page Styling */ body { font-family: Arial, sans-serif; margin: 0; padding: 20px; background: #f7f7f7; } h1 { text-align: center; color: #333; } p { text-align: center; margin: 20px auto; max-width: 600px; line-height: 1.5; } /* Link Styles */ a { color: #3498db; text-decoration: none; } a:hover { text-decoration: underline; } /* Button Styles */ button { display: block; margin: 40px auto; padding: 15px 30px; font-size: 16px; background-color: #3498db; color: #fff; border: none; border-radius: 5px; cursor: pointer; transition: transform 0.2s ease, background-color 0.2s ease; } button:hover { transform: scale(1.05); background-color: #2980b9; }
HTML
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Web Design Example</title> <link rel="stylesheet" href="style.css" /> </head> <body> <h1>Discover Modern Web Design</h1> <p> At <a href="https://linebyline.de" target="_blank">Line by Line</a>, we specialize in creating innovative and responsive web design solutions. From small businesses to large enterprises, we tailor each website to meet the unique goals of our clients. </p> <button id="myButton">Click Me for a Surprise</button> <script src="script.js"></script> </body> </html>
Join Effecthub.com
Working with Global Gaming Artists and Developers!
Login
Sign Up
Or Login with Your Email Address:
Email
Password
Remember
Or Sign Up with Your Email Address:
Your Email
This field must contain a valid email
Set Password
Password should be at least 1 character
Stay informed via email
