Html ատրիբուտ draggable
![]() | ![]() | ![]() | ![]() | ![]() |
draggable ատրիբուտը (հատկանիշը) որոշում է՝ օգտատերը կարող է տեղափոխել տվյալ էլեմենտը, թե ոչ։ Հղումները և պատկերները կարող են տեղափոխվել լռելյայնորեն:
Օրինակ՝
draggable="true | false | auto"
Արժեքը՝
true - էլեմենտը կարող է տեղափոխվել
false - էլեմենտը չի կարող տեղափոխվել
auto - օգտագործում է բրաուզերի կարգավորումները:
Օգտագործման օրինակ՝
<!DOCTYPE html>
<html>
<head>
<title>Использование глобального атрибута draggable</title>
<style>
#happy_div { width: 100px;
height: 50px;
padding: 15px;
font-weight: 900;
border: 1px groove red;
}
</style>
</head>
<body>
<p>Составьте слово счастье (перенося буквы в окошечко):</p>
<script> function allowDrop( ev ) { ev.preventDefault(); } function drag( ev ) { ev.dataTransfer.setData( "Text", ev.target.id ); } function drop( ev ) { var data = ev.dataTransfer.getData( "Text" ); ev.target.appendChild( document.getElementById(data)); ev.preventDefault(); } </script> <div id = "happy_div" ondrop = "drop(event)" ondragover = "allowDrop(event)"> </div> <br> <span id = "test1" draggable = "true" ondragstart = "drag(event)">А</span> <span id = "test2" draggable = "true" ondragstart = "drag(event)">П</span> <span id = "test3" draggable = "true" ondragstart = "drag(event)">Ж</span> <span id = "test4" draggable = "true" ondragstart = "drag(event)">О</span>
</body>
</html>
Կիսվել սոցցանցերում









