համակարգիչ
Կայքի մենյու
 
   

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>



Կիսվել սոցցանցերում