Skip to content

Orbit.resize()

Orbit provides a Orbit JS class with resize() method to allow .gravity-spot to adapt its size to a parent element. See installation doc section

<div class="wrapper"> <div class="bigbang"> <div class="gravity-spot"> <div class="orbit-4"> <div class="satellite"> </div> </div> </div> </div> </div>

.wrapper {
border: 1px dotted var(--o-purple);
height: 200px;
width: 280px;
margin: 5px;
resize: both;
overflow: auto;
}
.orbit, [class*='orbit-']{
  border-color: var(--o-cyan)
}
.satellite {
  border: none;
  background-color: var(--o-cyan)
}

Orbit.resize('.wrapper')
<div class="wrapper">
<div class="bigbang">
<div class="gravity-spot">
<div class="orbit-4">
<div class="satellite">
</div>
</div>
</div>
</div>
</div>