Мне никогда не понадобилась или не нужна эта функция (но это может быть эффект Blub ). Моя реакция коленного рефлекса заключается в том, что он хромой и, вероятно, понравится тем же людям, которые считают, что было бы здорово перегрузить оператора + для любой операции, которая может быть дистанционно истолкована как добавление.
Вы можете изменить фон, используя:
.modal-backdrop {
opacity: 0.25 !important;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/js/bootstrap.min.js"></script>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModalLong">
Launch demo modal
</button>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Praesentium, corporis consectetur odit fuga incidunt nostrum soluta qui voluptatem iusto illo aperiam ex voluptatum, dolores reprehenderit temporibus repellendus voluptates velit corrupti!l</p>
<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">CUSTOM LINK MAKER</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputEmail4">Email</label>
<input type="email" class="form-control" id="inputEmail4" placeholder="Email">
</div>
<div class="form-group col-md-6">
<label for="inputPassword4">Password</label>
<input type="password" class="form-control" id="inputPassword4" placeholder="Password">
</div>
</div>
<div class="form-group">
<label for="inputAddress">Address</label>
<input type="text" class="form-control" id="inputAddress" placeholder="1234 Main St">
</div>
<div class="form-group">
<label for="inputAddress2">Address 2</label>
<input type="text" class="form-control" id="inputAddress2" placeholder="Apartment, studio, or floor">
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputCity">City</label>
<input type="text" class="form-control" id="inputCity">
</div>
<div class="form-group col-md-4">
<label for="inputState">State</label>
<select id="inputState" class="form-control">
<option selected>Choose...</option>
<option>...</option>
</select>
</div>
<div class="form-group col-md-2">
<label for="inputZip">Zip</label>
<input type="text" class="form-control" id="inputZip">
</div>
</div>
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="gridCheck">
<label class="form-check-label" for="gridCheck">
Check me out
</label>
</div>
</div>
<button type="submit" class="btn btn-primary">Sign in</button>
</form>
</div>
</div>
</div>
</div>