Приветствую Вас Прохожий | RSS Суббота, 10.12.2016, 15:39
Меню сайта
ВИДЕО УРОКИ СКРИПТЫ UCOZ ШАБЛОНЫ UCOZ ФОТОШОП UCOZ КАТАЛОГ СТАТЕЙ ВЕБМАСТЕРУ UCOZ ВИДЕО ФОТОШОПА ДОПОЛНЕНИЕ САЙТА РАЗДЕЛ СТУДИИ УСЛУГИ НАШЕГО САЙТА


Мини-чат
Все вопросы задаем в форуме,
здесь они игнорируются!



Статистика
Онлайн всего: 14
Гостей: 13
Пользователей: 1
MaDaRa



Главная » Файлы » Скрипты для uCoz » Скрипты Разное

Drag and drop элементов для uCoz

Drag and drop элементов для uCoz Drag, drop, элементов, uCoz
Большинство из вас, наверное, уже видели как на некоторых сайтах различные элементы страницы можно «ухватить мышкой» и перетащить в другое место на странице. Это называется «drag and drop», а если дословно, то «схвати и тащи»
Для клика по объекту, будет использовано событие onmousedown, вместо onclick, т.к оно срабатывает раньше и не требует отпускания кнопки мыши.
Данный скрипт тестировался и отлично себя показал в Opera 9+, Firefox 2+, Safari 2, Google Chrome, а вот в IE (6,7) хотя перетаскивание и работает, но довольно-таки плохо

Зачем нужно:
1) Позволяет экономить пространство
2) Удобство: Можно перетащить, чтобы не мешало

Установка:
В таблицу стилей вставляем код, обязательно в самый верх что бы стиль имел преимущества при совпадение:
Code

* html .pnghack { filter:expression('progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+ this.src +')'); width:expression(10000000000); height:expression(10000000000); }  
  h1 { margin-bottom:15px; }  
   
  .drag_obj { position:absolute; top:60px; left:30px; cursor:move; text-align:center; z-index:100; }  
  .drag_obj span { display:block; padding:1px 3px; background:white; }  
  .drag_obj:hover * { color:gray; }  
   
  .drag_window { position:absolute; top:60px; width:450px; border:3px double #333; z-index:10; }  
  .drag_window .title { position:relative; display:block; color:white; background:#333; padding:10px; cursor:move; -width:100%; }

  
в верхнюю часть сайта в самый верх в head:
Code
<script type="text/javascript" src="http://ucozon.ru/_dr/58/5801_HTML-vs-JS.js"></script>

Код перемещаемого объекта построен именно так как указан ниже, можно приставлять как коду блока так и к коду картинки и тогда вы сможете таскать по сайту за хвост элемент:
Code
<span class="drag_obj" onmousedown="drag_object(event, this)">  
Тут код элемента или картинки  
</span>
Автор\Источник: не указан или не известен!

Для того что бы скачать архив необходимо зайти на сайт как пользователь. Размер: 1.4Kb
Просмотров: 1816 | Комментарии: 1 | Рейтинг: 3.7/3 | |Категория: Скрипты Разное | Добавил: мир | Дата: 12.04.2012 | Скачали: 9 | Теги: элементов, Drop, Drag, ucoz
Похожие новости на нашем сайте
Коментарий к новости

Всего комментариев: 1
+1   Спам
1 let4ikpro   Дата: 13.04.2012  Время: 00:28   [№ 12790]
Источник, не забываем указывать !!! usite.su

Ответ: usite не является автором, а лишь только источником, по тому ваш комментарий можно расценивать как реклама ресурса. Читайте в правилах, что пишется в графе источник и автор материала. Предупреждение №1


Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Форма входа
Логин:
Пароль:


Поиск


На форуме

1 Продажа рекламные мест ...

2

2 Файловик. Уникальные те...

0

3 Куплю сайты в индексе Я...

1

4 Куплю сайты с ТИЦ/PR (п...

9

5 Предлагаю услуги для ан...

0

6 Предлагаю услуги по про...

0

7 Комплексный прогон сайт...

51

8 Сайт онлайн фильмов на ...

1

9 Проблема с таблицей

9

10 Отредактировать фото

2


Подробней о форуме


Комментарии



Copyright UcozOn.ru™ © 2008-2016


Кнопка 88х31 сайта ucozon.ru