« Поставить закладку » « Сделать стартовой »

« Форумы » « Блоги » « Статьи » « Новости » « Файлы » « Realcoding IRC » « Site map » « Поиск »


Главная Главная
Анонсы Анонсы
Форумы Форумы
Каталог Каталог
Поиск Поиск
Опросы Опросы
Книжный магазин Книжный магазин
Реклама на сайте
Публикации Публикации
Партнеры Партнеры
Карта Карта сайта
Рассылки Рассылки
RSS экспорт
Настройки Настройки
О нас пишут О нас пишут
Контакты Контакты
Гостевая книга Гостевая книга


ПнВтСрЧтПтСбВс
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31  
    Популярное
Создание панели инструментов

Microsoft SQL Server 2000. Наиболее полное руководство

Стиль оформления кода на vb

Загрузка битового образа из ресурса программы

Создание форм на основе пользовательских классов

Связывание OLE-объекта

Описание функций C (Си) / C++ - strset

Как взломать Ajax в ASP.NET MVC Framework

Вывод простейших фигур

Введение в xAjax




    Архив файлов



    Сообщества

    Документация

    Кто на сайте
Вы не зарегистрированы.
Имя:

Пароль:

Запомнить

Регистрация позволит Вам пользоваться дополнительными сервисами.
Сейчас на сайте:
Гостей: 105
Пользователей: 0

Статьи:: Интернет технологии :: Java Script :: Делаем перетаскивание



отправить ссылку другу версия для печати  Обсудить на форуме

Делаем перетаскивание



Как создать перетаскивающиеся изображения(JavaScript)
Для начала, как всегда, надо создать HTML шаблон:
<html>
<title>Drag'n'Drop</title>
<head>
<script language="javascript">

</script>
</head>
<body>

</body>
</html>
Разберёмся, как должна работаь наша программа:
Пользаватель щёлкает на изображение, тем самым активизирует его для перетаскивания, и перетаскивает его в нужную часть экрана, затем повторно щелкает на него,чем прекращает перетакивание.
Создадим две функции: первая отвечает за активизацию(деактивизацию) изображения, вторая непосредственно за перетаскивание.
Создаём первую функцию activate():

function activate() {
activate=!activate;
}

Функция activate() состоит из одной строки, для чего? Функция отвечает за активизацию(деактивизацию) изображений. Логическая переменная activate при каждом использовании функции меняет своё значение с true на false. В дальнейшем эта переменная сыграет одну из главных ролей.
Создаём вторую функцию grab():

function grab() {
if(activate) {
imgWdh=document.img.width;
imgHgt=document.img.height;
img.style.pixelLeft=event.x-imgWdh/2;
img.style.pixelTop=event.y-imgHgt/2;
}
}

Вот мы и используем нашу переменную activate.В строке if(activate) проверяется, какое значение принемает переменная activate.Если это значение true, то выполняются действия в операторных скобках, иначе ничего не происходит. ассмотрим действия в операторных скобках:

imgWdh=document.img.width;
imgHgt=document.img.height;

Строки определяют высоту и ширину изображения, где img- это имя(name) изображения.

img.style.pixelLeft=event.x-imgWdh/2;
img.style.pixelTop=event.y-imgHgt/2;

Функция отслеживает координаты мыши и перетаскивает за ней изображение(imgWdh/2 и imgHgt/2 нужны для того. чтобы курсор устанавливался в центр изображения)
Функция вызывается событием onMousemove, т.е. когда пользователь перемещает курсор по документу, но функционировать она начинает только тогда, когда переменная activate будет равнятся true. Для того чтоб при загрузке изображение не начало сразу двигаться за курсором, присвоим activate значение false , и поместим строку перед всеми функциями.
Ну вот вроде и всё, вот весь код программы:

<html>
<title>Drag'N'Drop</title>
<head>
<script language="javascript">
var activate=false;
function activate() {
activate=!activate;
}

function grab() {
if(activate) {
imgWdh=document.img.width;
imgHgt=document.img.height;
img.style.pixelLeft=event.x-imgWdh/2;
img.style.pixelTop=event.y-imgHgt/2;
}
}
</script>
<body onMousemove="grab()">
<img src="file.jpg" name="img" onClick="activate()" style="position:absolute;top:10;left:10">
</body>
</html>

Теперь вы можете сделать на своём сайте, например, мозайку, состоящую из нескольких таких функций, или ещё какое-нибудь интересное приложение, вперёд!!!(Приложение работает только в IE, но его не трудно модифицировать и для работы в Netscape Navigator)

По вопросам JavaScript и Flash 5, а так же программам связаными с web графикой обращаться на munchener@tut.by

Автор: © Andrew A
Источник: http://www.flasher.ru



Рубрика: Java Script




HTML 5: пять вещей вызывающих особый интер....

Html

HTML 5 — это грядущее обновление гипертекстового языка разметки, основного способа создания контента для размещения его во всемирной паутине. Разработка HTML остановилась в 1999 году, на версии HTML 4.01 и с тех пор web-содержимое изменилось так, что текущие спецификации HTML перестали соответствовать сегодняшним требованиям. HTML 5 нацелен на то, чтобы увеличить функциональную совместимость HTML и соответствовать растущим требованиям разнообразного и смешанного web-контента. HTML 5 так же нацелен на устранение недостатков четвертой версии. В этой статье мы взглянем на 5 новых интересных вещей в HTML 5.


Подробнее... | Рубрика: Html | Добавлено: 22.12.2008

asp.net: ListView с разных сторон.

.NET компоненты

Элемент управления ListView был представлен в .Net Framework 3.5 как замена устаревшему GridView. Новый элемент имеет более расширенный функционал, чем его предшественник, но в тоже время лишен некоторых внутренних механизмов, что впрочем целиком следствие из расширенной универсальности ListView. Среди отличий ListView и GridView можно назвать и гибкую настройку разметки, что позволяет выводить данные не только в табличном виде, но и вообще в любом каком пожелает программист. Благодаря шаблонам ItemTemplate, EditItemTemplate, InsertItemTeplate можно настроить внешний вид при любом из состояний ListView: редактировании или выборе элемента.


Подробнее... | Рубрика: .NET компоненты | Добавлено: 22.12.2008

Создание кросс-таб отчета в Stimulsoft Rep....

.NET компоненты

Компания Стимулсофт предоставляет для разработчиков мощный набор инструментов для создания отчетов для Microsoft Visual Studio .Net 2005 и 2008; эти инструменты доступны как для Windows Forms, так и для Web Forms. Это генератор отчетов Stimulsoft Reports.Net. Генератор отчетов Stimulsoft Reports.Net имеет ряд особенностей: простая работа с дизайнером отчетов, полная поддержка экспорта в PDF, Word, Excel и многие другие форматы. Crystal Report и Microsoft Reporting Service – очень хорошие программные продукты для повседневной работы, но, если Вам необходимо создать отчеты с поддержкой кросс-табов, drill down, Ajax, штрих-кодов и возможностью подключения одновременно более одного источника данных, то Stimulsoft Reports.Net поможет Вам сэкономить массу времени. Также, данный генератор отчетов позволяет пользователям создавать свои собственные отчеты любой сложности. И все эти особенности делают Stimulsoft Reports.Net хорошим выбором в сфере программных продуктов для Business Intelligence.


Подробнее... | Рубрика: .NET компоненты | Добавлено: 22.12.2008

Остальные статьи:

VivaMP - инструмент для OpenMP
Создаем контекстно-зависимое WPF-приложени...
Windows Vista SP2: что внутри и что важно?
Вышел MySQL 5.1.30, первый стабильный рели...
Тестирование параллельных программ
Архитектура AMD64 (EM64T)
Платформа 2009. Определяя будущее
Windows Vista Bridge Sample Library - упра...
Оптимизация 64-битных программ
Подгрузка через AJAX HTML-кода, содержащег...
Обзор нового релиза самой мощной Ajax библ...
Firebug 1.3 и 1.4 alpha — что нового и инт...
Релиз Microsoft Silverlight 2.0. Что новог...
XML документация в C#
Курсоры в MySQL 5
Microsoft опубликовала подробности о сесси...
Microsoft делится подробностями о том, что...
Тестируем новый javascript от нового брауз...
MySQL Query Cache
Использование провайдеров компиляции в As...


Цитата дня (все,добавить):

Портал фрилансеров

работа на дому


    Рубрикатор

Программирование

C/С++
Обучение
Windows API
XAML
Моделирование
Паттерны
Visual Basic 7 .NET
WxWidgets
Функции WinApi
Функции С++
Разработка под Mac OS
Eiffel
Visual Studio 2008
UI дизайн
Алгоритмы
Конкурсные статьи
Turbo Pascal
Visual Studio
CASE-средства
Visual Studio 2005
Без VCL
Delphi
Тех. документация
Тестирование
Software Testing
ООП
TCP/IP
Google Android
Windows Installer
.NET Framework
Драйвера
C# C Sharp
Справка
Проектирование
Информ. системы
Visual Basic
Assembler
Оптимизация кода
Gtk+
Компоненты
Реинжиниринг
Управление проектами
Extreeme programming
Lotus Notes
Алгебраическое проектирование


Интернет технологии

PHP
Perl
ASP
WAP
Cookies
SSI
CGI
Web Servers
VB Script
DNS
CSS
XML
Html
Java Script
Java2ME
Firewall
Flash
.htaccess
Apache
VRML
Протоколы
Поисковые системы
Технология JAVA
Учебник по PHP
Учебник по JavaScript
Учебник по XML
Java Q&A
AJAX
DHTML
XHTML
Dreamweaver
Web 2.0
Python
Вебмастеру
Cisco
Ruby on Rails
Silverlight

Базы данных

Access
InterBase
MySQL
Oracle
ADO .NET
Основы SQL
Учебник по Access 2002
MS
Microsoft FoxPro
Доступ к данным
XML в MS SQL Server 2000
ODBC и MyODBC
Обучение
Caché
DB2
PostgresSQL
Sybase
Теория
Хранилища данных
Безопасность
Реляционные данные
MySQL и mSQL

Остальное:

Разное
Обзоры книг
Безопасность
Графика и дизайн
Юмор
Linux
Фракталы
Microsoft Axapta
Многоядерность
Сети
Microsoft Office
Работа
MS-DOS
Криптография
Графика и игроделание
Новости SDK
Системы защиты
Учебник по AutoCad
CVS
Windows XP
Windows Server 2003
Windows Vista
Windows 7
Мероприятия