Это цитата сообщения MissKcu Оригинальное сообщение

 

Урок по отображению картинок в окне при наведении курсора на миниатюру.

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

Для урока нам потребуются 5 изображений с размерами 400 х 300 пикселей, и 5 их уменьшенных копий с размерами  80 х 60 пикселей. Желательно последние отредактировать в каком-либо графическом редакторе (например, в Фотошопе), с тем, чтобы эти миниатюры были ярче и контрастнее. Вы можете выбрать другие размеры и количество изображений, потому, что  с помощью этого урока Вам станет, понятен принцип, как это делается, и Вы сможете вставлять в свой клип любое количество изображений. Важно лишь учесть при этом, что, чем больше их будет – тем больший размер холста нужно предусмотреть при создании нового документа.

Итак, приступим: я задаю размеры документа 600 х 500 пикселей. Делается это, если кто-то не знает, или забыл, на панели свойств (см. рисунок ниже)

[257x129]

Цвет фона я выбрал светло-желтый (можно выбрать какой Вам нравится)  

Далее: импортируем в библиотеку наши подготовленные изображения, для чего выбираем в меню файл командуImport to Library.
 

[224x369]

Далее нажимаем сочетание клавиш Ctrl + F8 или в меню Insert выбираем команду New Symbol, и в открывшемся диалоге выбираем Movie Clip.
 

[364x175]

Имя мувиклипа можно выбрать любое. Если у Вас уже существует в библиотеке символ с таким именем, программа сама Вас поправит и предложит присвоить символу другое имя.

После того, как мы нажмем кнопку ОК, мы окажемся в окне редактирования символов. 
Там помещаем наше первое изображение в первый кадр на первом слое. Далее создаем в этом же слое еще четыре пустых ключевых кадра, и помещаем в каждый из них  соответственно 2,3,4 и 5-е изображения. Все пять изображений необходимо отцентрировать. Для этого воспользуйтесь панелью Transform и выставьте координаты, такие как на рисунке ниже:

[242x118]

Создаем новый слой, для чего в меню Insert выбираем добавить слой

[217x129]

И в этом новом добавленном слое в первый кадр на панели Action вставляем такой код:

[211x67]

Вот, как к этому времени будет выглядеть временная шкала в окне редактирования мувиклипа:

[310x60]

А вот такую примерно картинку мы будем наблюдать в окне проводника:

[200x255]

Символы 4, 6, 8, 10 и 12 – это соответственно наши изображения 1-5 с размерами 400 х 300 пикселей.  На панели проводника Movie Explorer наглядно видно, что, в каком кадре, и на каком слое расположено.

Первая треть урока закончена, и теперь мы переходим к созданию кнопок, при  наведении на которые в основном окне будет отображаться большое изображение.

Опять нажимаем Ctrl + F8, или в меню Insert  выбираем команду New Symbol, но на этот раз в открывшемся диалоге выбираем  Button.

[364x178]

Нажимаем кнопку ОК и оказываемся в окне редактирования символа. Перемещаем в первый кадр из библиотеки на холст нашу первую миниатюру размером 80 х60 пикселей.
Центрируем её с помощью панели Transform. Как это делается, смотри первую часть урока.

Кликаем во втором кадре (Over) и нажимаем клавишу F6. То же самое проделываем в 3-м (Down) и 4-м (Hit) кадре.

Вот как выглядит к этому времени временная шкала:

[493x42]

То же самое проделываем для оставшихся четырех миниатюр. Теперь давайте (по желанию) для разнообразия и эффекта добавим каждой кнопке некий блик во втором кадре. Как делается такой блик смотри в других разделах с уроками. Выглядеть это буде примерно так:

Для этой цели в окне редактирования наших кнопок на временной шкале добавляем новый слой (Insert Layer)  и во втором кадре вставляем ключевой кадр. 1(Up), 3(Down), и 4-й(Hit),кадры делаем пустыми. И в кадр Overперемещаем из библиотеки мувиклип с бликом.

Полезный совет для тех, кто только начинает пользоваться программой Sothink SWF Quicker. Для того чтобы найти какой-либо объект в библиотеке, необходимо щелкнуть по нему правой кнопкой мыши, и в открывшемся списке выбрать Locate in Library (Расположение в библиотеке) Объект в библиотеке сразу же выделится. Смотри рисунки ниже:

[238x375]

[207x179]

После того как мы добавили во второй слой мувиклип с бликом временная шкала будет выглядеть следующим образом:

[476x60]

Переходим к заключительной, третьей части урока.

В основной сцене добавляем второй слой и размещаем на нем все наши 5 кнопок.

Подготовленные кнопки размещаем на рабочем холсте примерно так, как показано на рисунке:

[348x331]

Перемещаем подготовленные кнопки на рабочий холст и на панели свойств (Properties)присваиваем  им  имена.  Соответственно btn1, btn2 , btn3, btn4, btn5.

Вот, как это выглядит для первой кнопки:

[229x93]

Наконец, добавляем на временной шкале основной сцены третий слой и переименовываем его в Action Layer. В первый кадр вставляем такой код:

function showing(frame) { myScreen_mc.gotoAndStop(frame); } // End of the function function opening(frame) { getURL(frame + ".jpg", "_blank"); } // End of the function btn1.onRollOver = function () { showing(1); }; btn1.onPress = function () { opening(1); }; btn2.onRollOver = function () { showing(2); }; btn2.onPress = function () { opening(2); }; btn3.onRollOver = function () { showing(3); }; btn3.onPress = function () { opening(3); }; btn4.onRollOver = function () { showing(4); }; btn4.onPress = function () { opening(4); }; btn5.onRollOver = function () { showing(5); }; btn5.onPress = function () { opening(5); };

Вы можете использовать любое количество изображений, соответственно добавив в код необходимое количество строк для этого.

Вот, что у нас должно получиться: