رویداد ondragstart در HTML5 عمل شروع drag با ماوس
برای متخصص شدن در طراحی بخش Front End سایت روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت با HTML5 و CSS3 و jQuery
در این مقاله از سایت آموزی جهت استفاده شما عزیزان به معرفی صفت رویدادی ondragstart در سند html می پردازیم. ویژگی رویدادی ondragstart زمانی رخ میدهد که در یک تگ html عمل کشیدن و رها کردن یا Drag and Drop به وسیله ماوس شروع شده باشد. خصوصیت ondragstartr یک رویداد عمومی تگ های html است.
معرفی صفت رویدادی ondragstart در سند اچ تی ام ال
صفت رویدادی ondragstart زمانی رخ میدهد که در یک تگ html عمل کشیدن یا Drag به وسیله ماوس شروع شده باشد. خصوصیت دراگ و دراپ در HTML5 معرفی شده و توسط چند ویژگی و رویداد کنترل می شوذ.
برای متخصص شدن در طراحی سایت فروشگاهی با وردپرس روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت فروشگاهی با وردپرس پروژه محور
برای متخصص شدن در طراحی بخش Front End سایت روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت با HTML5 و CSS3 و jQuery
که خاصیت رویدادی ondragstart و صفت draggable از جمله آنها می باشد. لینک ها و تصاویر برای کشیده شدن نیازی به صفت draggable ندارند.
ویژگی رویدادی ondragstart در دسته رویداد های ماوس قرار می گیرد. این رویداد هم جزء رویداد عمومی در تگ های html است.
ویژگی ها و رویدادهای دراگ و دراپ کردن تگ های html عبارتند از :
- ondragstart
- ondragend
- ondrag
- ondragenter
- ondragover
- ondragleave
- ondrop
رویداد ondragstart در HTML5 عمل شروع drag با ماوس
مثال در مورد استفاده از ویژگی ondragstart درون تگ p
<p style=”clear:both;”><strong>Note:</strong> drag events are not supported in Internet Explorer 8 and earlier versions or Safari 5.1 and earlier versions.</p>
<p id=”demo”></p>
<script>
function dragStart(event) {
event.dataTransfer.setData(“Text”, event.target.id);
document.getElementById(“demo”).innerHTML = “Started to drag the p element”;
}
function dragEnd(event) {
document.getElementById(“demo”).innerHTML = “Finished dragging the p element.”;
}
function allowDrop(event) {
event.preventDefault();
}
function drop(event) {
event.preventDefault();
var data = event.dataTransfer.getData(“Text”);
event.target.appendChild(document.getElementById(data));
}
</script>
بررسی ویژگی ondragstart درون سند html 4.0.1 و HTML5
خاصیت رویدادی ondragstart ، در نسخه HTML5 معرفی شده و HTML4.01 نسخه های قبلی وجود نداشته و پشتیبانی نمی شود.
برای متخصص شدن در طراحی سایت فروشگاهی با وردپرس روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت فروشگاهی با وردپرس پروژه محور
برای متخصص شدن در طراحی بخش Front End سایت روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت با HTML5 و CSS3 و jQuery
پشتیبانی مرورگرهای اینترنتی از ویژگی ondragstart
| رویداد html |  |  |  |  |  |
| ondragstart | ۴.۰ | ۹.۰ | ۳.۵ | ۶.۰ | ۱۲.۰ |
پیوندهای کاربردی و مفید
تگ های جدید HTML5 در سایت آموزی
صفات تگ های HTML در سایت آموزی
تگ های منسوخ شده HTML5 در سایت آموزی
تگ های block level و inline level در سایت آموزی
