Target effect

Developer
Alexander Nastase
Size
2,163 Kb
Views
4,048
  1. Target effect Previews
  2. Target effect HTML Codes
  3. Target effect CSS Codes
  4. Target effect JS Codes

How do I make an target effect?

What is a target effect? How do you make a target effect? This script and codes were developed by Alexander Nastase on 29 January 2023, Sunday.

Target effect Previews
IQ Test

Target effect - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>target effect</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <svg id="cursor" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4000 3000"><title>target</title><rect x="1999.5" width="1" height="3000" style="fill:#fff"/><rect y="1499.5" width="4000" height="1" style="fill:#fff"/><path d="M1983,1483v34h34v-34h-34Zm33,33h-32v-32h32v32Z" transform="translate(0)" style="fill:#fff"/><path id="middle" d="M1995,1495h1v10h-1v-10Zm9,0h1v10h-1v-10Zm-9,10v-1h10v1h-10Zm0-9v-1h10v1h-10Z" transform="translate(0)" style="fill:#f60"/></svg>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum exercitationem magni, saepe debitis temporibus, modi error <a href="#">explicabo</a>, esse voluptatem doloribus maiores veritatis nobis quia sit, quae distinctio omnis impedit recusandae.</p> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Target effect - Script Codes CSS Codes

body { background:#1b3149; cursor:none; font-family:Arial;
color:white;}
#cursor { pointer-events: none; position:absolute; width:4000px; height:3000px; }
p { width: 40%; margin: 10%; }

Target effect - Script Codes JS Codes

$(document).bind('mousemove', function(e){ $('#cursor').css({ top: e.pageY - 1500, left: e.pageX - 2000 });
});
Target effect - Script Codes
Target effect - Script Codes
Home Page Home
Developer Alexander Nastase
Username anodpixels
Uploaded January 29, 2023
Rating 3
Size 2,163 Kb
Views 4,048
Do you need developer help for Target effect?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Alexander Nastase (anodpixels) Script Codes
Name
Pressable CSS Buttons
Carousel_listing
Nifty Slider
CSS CREATURE
Defcamp
Layout Experimentation Animation
Scrollbar Scrolling Progress Annotation
Tryout_slider_done
Simple Tabs
Right Click Menu
Create amazing Facebook ads with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!