Радиус описанной окружности прямоугольника

by Yunus Gaziev

HTML

<div class="circle"></div>
<div class="square"></div>

SCSS

.square {
  width: 300px;
  height: 150px;
  background-color: #ccc;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
}

.circle {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  transform: translateY(-50%) translateX(-50%);
  background-color: #fc0;
}

JavaScript

var $circle = $('.circle');
var $square = $('.square');

var square = {
	width: $square.outerWidth(),
  height: $square.outerHeight(),
};

var radius = Math.round(Math.sqrt(Math.pow(square.width,2) + Math.pow(square.height,2)) / 2);

$circle.css({
	width: radius * 2,
  height: radius * 2
});