JavaScript
x
5
1
<div class="container">
2
<div class="item1">text text text in div 1</div>
3
<div class="item2">text text text in div 2</div>
4
</div>
5
Is it possible (by any HTML node, CSS or JS) to prevent from selecting text in div.item2 if selection started from text in div.item1 and the other way around – starting from div.item2 and limit to it (prevent item1 form being selected)?
Advertisement
Answer
I came up with this, with a bit of jQuery code :
JavaScript
1
9
1
let $items = $(".item")
2
3
$items
4
.mousedown( function() {
5
$(this).siblings().css({ "user-select" : "none" , color : "lightgrey"})
6
})
7
.mouseup( function() {
8
$items.css({ "user-select" : "auto" , color : "black"})
9
})
JavaScript
1
7
1
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
2
<div class="container">
3
<div class="item">text text text in div 1</div>
4
<div class="item">text text text in div 2</div>
5
<div class="item">text text text in div 3</div>
6
<div class="item">text text text in div 4</div>
7
</div>