Как да преобразувате изображения в Dreamweaver CS5
Стъпка 1
Изтеглете файла с предварително определена светлинна кутия по ваш избор и го разархивирайте. Ще намерите серия от четири папки и файл index.html. Папките са "css", която има файлове с каскадни стилови листа, "снимки", която съдържа две копия от всяка от снимките, които ще използвате, една с миниатюри, друга с пълна разделителна способност, "изображения" Той съдържа иконите, използвани за бутоните и контролите, и "JS", който съдържа Javascript файловете, които ще използвате.
Стъпка 2
Копирайте свои собствени изображения и миниатюри в папката "photos", уверете се, че в миниатюрите предварително името на изображението е "thumb_". Например, "car.jpg" ще има миниатюра на "thumb_car.jpg". Уверете се, че всяко изображение има съответната миниатюра.
Стъпка 3
Копирайте светлинната кутия в работната директория, за да направите локалното копие на уебсайта си и отворете уеб страницата си в Dreamweaver. Използвайте опцията "Изображения за свързване", за да свържете миниизображенията на уеб страницата си с местата, където искате да бъдат.
Стъпка 4
Кликнете върху всяко миниатюрно изображение и погледнете областта на свойствата на елемента на приложението Dreamweaver и ще намерите опция за създаване на връзка около него. До текстовото поле има икона "директно към файл". Кликнете там и плъзнете стрелката, която прави изображението по-голямо в изображението на тази миниатюра. Повторете тази процедура, докато не свържете миниизображението на всяко изображение.
Стъпка 5
Кликнете върху прозореца на кода на HTML файла и превъртете до заглавката. Вътре в главата и напишете етикет, който изглежда така:
Стъпка 6
Добавете втори маркер на скрипт, както следва:
Маркерът на скрипта, който добавите, показва лентата с инструменти "jQuery" и спира специфичния javascript код. Името на кода може да варира в зависимост от светлинната кутия, която използвате.Стъпка 7
Задайте функцията "кука" във вашия lightbox от дадения изходен код, във функцията Javascript, която изглежда така:
Стъпка 8
Превъртете надолу и намерете всеки етикет, който заобикаля етикета , Въведете следния текст във всеки етикет:
class = "lightbox"
малко преди затварянето на табелата. Например, може да е така:
Стъпка 9
Свържете файла CSS, който придружава светлинната кутия, до заглавката на вашия HTML документ, можете да направите това с помощта на функцията "Прикачи стилов лист" на Dreamweaver в панела "Файлове". Намерете файла jQuery.css и го свържете.