JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>

	<head>
	  <title>Модальное окно DEMO</title>
	  <meta charset="UTF-8">
	  <meta name="viewport" content="width=device-width, initial-scale=1.0">
	  <meta name="description" content="Демо урок: Модальное окно">
	  <meta name="keywords" content="modal windows jquery, demo">
      <meta name="author" content="WH-DB.COM">
	  
	  <link rel="stylesheet" href="css/style.css">
	</head>

	<body>

	<h1>Демо урок: Модальное окно на Jquery </h1>
		<div class="btn_group">
			<a href="#" onclick="bopen();"><span class="btn_close border_radius_class">Вызвать модальное окно</span></a> <br>
			<a href="http://ru.wh-db.com/article/all"><span class="btn_close border_radius_class">Вернуться в урок</span></a>
		</div>

		<div id="popup_vk" style="display: none;">
			<div class="popup_vk border_radius_class"> 
				<div> 
					<h3>Вступите в нашу группу!<h3>
				</div>
		
				<div id="vk_groups_popup"></div>

				<a href="#" onclick="bclose();"> 
					<span class="btn_close border_radius_class">
						закрыть
					</span>
				</a>

			</div>

		</div>

	</body>
    
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
	<script src="js/libs/jquery.bpopup.min.js"></script>
	<script src="js/main.js"></script>
	<script type="text/javascript" src="http://vk.com/js/api/openapi.js"></script>

</html>

CSS

.popup_vk {
	border: solid 1px black;
	padding: 10px;
	background-color: white;
	width:100%;
	margin-top:15%;
}

.border_radius_class {
	border-radius: 10px;  
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px;  
}

.btn_close {
	padding: 3%;	
	background-color: rgb(44, 197, 127);
	margin-top: 5%;
	margin-bottom: 2%;
	text-align: center;
	display: block;
	text-transform: uppercase;
}

.btn_group {
	width: 30%;
}

#vk_groups_popup {
	margin: 0 auto;
}

JavaScript

/* Функция закрывает по нажатие на кнопку модальное окно */
function bclose() {
	$("#popup_vk").bPopup().close();
	return false;
}

/* Функция показывает модальное окно по нажатию на кнопку */
function bopen() {
	$('#popup_vk').bPopup();
	return false;
}

/* Функция отображает модальное окно автоматически после загрузки страницы через одну секунду */
$( document ).ready(function() {
	setTimeout(function() {
        /* Подключение vk виджета с группой*/
        VK.Widgets.Group("vk_groups_popup", {mode: 0, width: "220", height: "400"}, 85339831);
        
        /* Вызываем модальное окно */
        $('#popup_vk').bPopup();	
	}, 1000);
});