To set the amount by which the border image is extended, you need to set border outside edges.
Example
You can try to run the following code to learn how to set the amount by which the border image extends beyond the border box in JavaScript.
<!DOCTYPE html>
<html>
<head>
<style>
div{
background-color:gray;
border: 40px solid;
border-image: url('https://www.tutorialspoint.com/images/neo4j.png');
border-image-slice: 50;
border-image-width: 20px;
border-image-width: 1 1 1 1;
border-image-outset: 0;
border-image-repeat: round;
}
</style>
</head>
<body>
<div id="box">
<p>Demo Text!</p>
</div>
<button onclick = "display()">Set Border Oustside Edges</button>
<script>
function display(){
document.getElementById("box").style.borderImageOutset = "5px 10px 20px 15px";
}
</script>
</body>
</html>