- PVSM.RU - https://www.pvsm.ru -

HTML5: Drag-and-Drop. Кроссбраузерный? Более чем…

image
Сегодня я запускаю первую версию js-скрипта DND v 1.0. Данный скрипт предоставляет возможность перетаскивать элементы на странице и помещать их в какую-либо область.
Перейти на сайт [1]

Пролог

В современном web мы все привылки использовать такую прекрасную javascript-библиотеку как jQuery. Но для того, чтобы создавать у себя на странице какие-то динамические эффекты приходиться еще прибегать к jQuery UI, не все слегкостью смогут осилить, разобраться с какими-то премудростями javascript-инициализации. В тем более теперь есть современный HTML5, который, со своим API, может дать легкий подход к разработке. Но как мы все знаем, HTML5 не поддерживается старыми браузерам, однако, это легко исправляется собственными решениями. В итоге я решил написать javascript библиотеку, которая дает возможность использовать HTML5 drag-and-drop у себя на сайте с поддержкой всех браузеров, включая десктопных. При этом технологию можно не изучать, привыкнуть и применять во благо, это все, что от нас требуется.

Особенности

  • Легкое использование
  • Легковесный скрипт -5 кб
  • Не требует сторонних js библиотек
  • Сочетается HTML5 и JS совместимость
  • Работает на всех компьютерах и на планшетах
  • От программиста требуются только знания CSS

Применение

1. Подключаем в любое место свое страницы dnd.js
2. Указываем на своей странице перемещаемый объект. Это делается с помощью атрибута class, в нем вы должны указать класс под названием dnd
3. Указываем на своей странице принимающий объект. Это делается с помощью того же атрибута class, указываем — cor

Нашли ошибку

Напишите об этом автору скрипта — maxefect@yandex.ru. Также вы можете связаться с ним, если хотите помочь в данном проекте — личная страница [2]

Автор: maxefect

Источник [3]


Сайт-источник PVSM.RU: https://www.pvsm.ru

Путь до страницы источника: https://www.pvsm.ru/javascript/54598

Ссылки в тексте:

[1] Перейти на сайт: http://mdes.pro/dnd/index.htm

[2] личная страница: http://vk.com/maxefect

[3] Источник: http://habrahabr.ru/post/211957/