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





Скачать 454.13 Kb.
НазваниеМеня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к
страница5/6
Дата публикации27.09.2014
Размер454.13 Kb.
ТипДокументы
100-bal.ru > Право > Документы
1   2   3   4   5   6
ОБЯЗАТЕЛЬНО дайте своему слою ИМЯ.!









Теперь давайте впихаем в слой картинку. Это делается как при вставке картинки в страничку (кликнули внутрь слоя, нажали кнопку вставки картинки и указали нужную картинку).






 




А теперь начинается самая веселуха. Выделяем объект (слой), кликаем правой кнопкой по палитре TimeLine и выбираем пункт AddObject (добавлять можно только картинки и слои)









После этого переходите на нужный кадр и создаете в нем ключевой кадр (см. рисунок). Ключевые кадры - это некие вехи на пути перемещения нашего объекта. Все промежуточные перемещения DreamWeaver сделает сам.

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









Осталось задать частоту кадров (я задал 20) и включить галочки AutoPlay и Loop.




Все, осталось лишь поглядеть на готовый результат. На самом деле можно делать гораздо более сложные анимационные вещи, перескакивать с кадра на кадр при нажатии определенных кнопок и многое другое.... До следующего урока!







Уф. Тринадцатый шаг (кстати, вы еще не устали шагать?). Кто-то считает это число несчастливым, для меня оно ничем не отличается от всех остальных. Так что за триннадцатым шагом обязательно последует четырнадцатый...









Ну, а разговор сегодня пойдет, как и обещано было, о менюшках как на microsoft.com. Делать точную скин-имитацию мы не будем.

Начнем с создания таблицы по параметрам указанным слева.









Раскрасим нашу таблицу в нужный цвет, зададим текст внутри ячеек, укажем размер этих ячеек (скажем пикселей по 100).









Да, кстати, я еще немного порулил CSS-ами. Переопределил внешний вид тегов и
. В принципе это можно и не делать...









Теперь обращаю ваше внимание, что до того, как начать работать со слоями, в нашем случае галочка у выделенного подпункта меню (пункт View) не должна стоять. Иначе мы не сможем нарисовать перекрывающиеся слои.









 

Нажав на эту кнопку мы нарисуем слой как показано на рисунке. После его отрисовки стоит заняться его внешним видом и прочими настройками.









Прежде всего как и в предыдущем примере нужно дать нашему слою уникальное имя.









Затем стоит указать в качестве параметра Vis - Hidden (наш слой сразу исчезнет) + указать цвет фона = цвету фона таблицы.











Не пугайтесь, когда ваши слои вдруг пропадут. Есть замечательная плавающая палитра в меню window, которая называется Layers.

Включите ее и увидите все ваши слои и их текущее состояние (показан или нет).









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

  • создать ссылку

  • избежать перехода на другую страницу, если пользователь нажмет на ссылку.

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









Пришло время заняться Behaviors. Для этого выберите нужную ссылку (можно, например нажать на тег в строке состояния). После этого вызовите палитру Behaviors и выберите пункт Show-Hide Layers. При наведении мышки на первый пункт мы должны показывать соответствующий слой и прятать все остальные.









Достигается это очень просто - посмотрите на картинку слева :)









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







Ну вот и результат. Можете сравнить с аналогичными меню на других сайтах. По моему все просто :) До следующего урока.







Писал что будет и четырнадцатый шаг? Писал. Вот он. Возможно он не раскроет перед вами каких-то новых супервозможностей DreamWeaver, но может здорово помочь в повседневной борьбе за место под солнцем :)















Речь сегодня пойдет о такой классной вещи как однопиксельные распорки. Те кто знает, что это такое, могут спокойно идти на другие разделы сайта. Те кто не знают могут спокойно читеть дальше :)

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

Предположим, что:

  1. Некий логотип. Он занимает всю площадь данной области

  2. Некая сменяющаяся текстовая информация, которая может не занимать всю площадь выделенной ей области

  3. Рубрикатор

  4. Контент конкретной странички

  5. Подвал (баннер, контактная информация и т.д.)

В нашу задачу входит достижение жесткого расположения всех элементов в областях 1 и 3. Кроме того, нужно добиться корректного расположения элементов в ячейках 2, 4 и 5 вне зависимости от выбранного разрешения (плавающий правый край).















Начнем, пожалуй с создания таблицы. Это вы уже достаточно хорошо знаете и умеете. Вот только табличку мы создадим маленько не такую как показано на картинке с модульной сеткой. Разница будет в том, что мы сделаем ее на один ряд больше.

Именно в этот ряд мы и будем заполнять нашими однопиксельными распорками. Но, сначала, давайте я вас с ними познакомлю.















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















Так вот возьмем мы эту точку и поместим в две нижние ячейки нашей таблицы. Для наглядности я опять вместо прозрачных пикселей буду использовать черные.

Как только вы поставите их внутрь ячеек они (ячейки) тут же сожмутся по высоте до 1 пикселя. Это еще один вариант применения подобных распорок. Например у меня на сайте все горизонтальные и вертикальные линии на страничках сделаны именно так.







 

 







Ну вот вставили мы эти пискели, ряд ячеек стал высотой в один пиксель. И что с этого?

С этого - почти ничего. Но мы можем задать нашим распоркам нужное значение ширины. Так давайте это сделаем. Выделяем нашу первую точку (в левой нижней ячейке). Проще всего это сделать просто переведя курсор до или после этой ячейки, а затем вернуться в нужную ячейку при помощи курсорных клавиш.















Для первой ячейки я указал ширину в 100pix. Вторую оставил без изменений. Кроме того, я задал ширину всей колонки (левой) 100pix, а правой 100%.

Ну и зачем нам тогда эти распорки, если мы так или иначе устанавливаем размеры ячеек?

А затем, что это РАСПОРКА. То есть она не даст (при любой моличестве и размере контента в правом столбце) сжать наш левый столбец менее 100 пикселей.







 







При этом я могу размещать в левой колонке не только графические изображения (которые сами по себе являются распорками), а и просто текстовый дизайн.

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









~ 43 байта



~ 156 байт







Ну и можно использовать однопиксельные картинки для создания "плашек" - областей прямоугольной формы, залитых каким-либо одним цветом. Выигрыш от подобного метода вы можете увидеть на картинке слева.

Еще подобные однопиксельные картинки очень часто применяют в качестве фона у таблиц, ячеек, целых страниц. Иногда этот метод помогает бороться с различиями отображения цвета в разных браузерах.







Вот такие они, эти маленькие однопиксельные помошники. Следующий 15-тый шаг скорее всего быдет поледним. Вы уже знаете о DreamWeaver практически все. Остальное - либо рассказывать не интересно, либо вам ничего не останется изучать в этом замечательном пакете. Пример того, что мы делали сегодня вы можете увидеть здесь. До следующего - 15-го и последнего шага :)




Ну вот и настало время для последнего, решительного шага :) Сам не знаю почему, но на душе моей стало гораздо легче. Теперь вы знаете про DreamWeaver почти столько же сколько о нем знаю я. Правда я работаю в нем все реже и реже. Единственный сайт, который я по-прежнему делаю только в DW - это "Дизайн и графика". Почему? Просто чтобы экономить свое рабочее время.

Довольно трепаться - приступим.

 




1   2   3   4   5   6

Похожие:

Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconФилософская мысль Европы не смогла понять во всей глубине тот факт,...
Распространено было убеждение, что победа уже давно одержана и никаких сомнений в этом быть не может. Лишь позднее в Англии и Франции...
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconМоя будущая профессия
А для меня такого вопроса уже не существует. Почему? Да потому, что уже давно знаю, чем буду заниматься. Я буду переводчиком
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconПривет всем! Меня зовут Максим, можно просто Макс. Мне всего 16 лет...
Оловянная принцесса", и " Граф Карлштайн ". Cоветую вам прочитать эти книги, я понял, что и сам могу создать шедевр. Я написал книгу...
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconУрок 7
Что могут сделать родители для того, чтобы их сын или дочь выбрали здоровый образ жизни? И можно ли сделать еще что-то, чего Вы еще...
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconВ израильском зоопарке срочно переименовывают крокодила Каддафи....

Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconРешение и мотивация поступают от взрослого. А от ребенка требуется...
Ответственность и послушание – это два различных типа поведения. Различие состоит прежде всего в том, кто решает, что нужно сделать...
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconДомашнее задание на 11 марта 2014 года 5 "А" класс
Русский язык: написать сочинение объемом не более 1 листа на тему "Мой питомец" (собака или кошка). Придумать стихотворение о питомце,...
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconПедагогическая практика оказалась для меня очень интересной и важной....
Маоу сош №1 села Акъяр муниципального района Хайбуллинский район Республики Башкортостан
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconПрограмма по формированию навыков безопасного поведения на дорогах...
Но если можно учить легко и успешно, то что мешает вам сделать это? Когда вы закончите чтение, возможно, у вас появятся свои собственные...
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconПрограмма по формированию навыков безопасного поведения на дорогах...
Тема: Слова которые обозначают действия предметов и отвечают на вопросы что делать? что сделать? что делает? что сделает? что делал?...
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconКонцепция анализа кризисных явлений 8 Стратегические риски 10
Процесс глобализации международных отношений набирает силу. Мир становится все более взаимозависим и все более уязвим для проявлений...
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconТема : «Как проверить орфограммы слабых позиций в падежных окончаниях»
Да. Об окончаниях мы немало знаем. Может это позволит сделать нам предположения по решению нашей задачи. Что мы можем сделать?
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconПосле потери целого дня на попытки придумать и сделать что-то самому...
Я не пытался сделать все скопипастить и использовать все тоже самое, но стремился добиться похожего результата
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconПосле потери целого дня на попытки придумать и сделать что-то самому...
Я не пытался сделать все скопипастить и использовать все тоже самое, но стремился добиться похожего результата
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconВывод: Труд имеет значимость для каждого из нас. С помощью трудовой,...
Учитель говорит о том, что дети приходят на занятия по химии, чтобы сделать открытия, чтобы узнать что то новое
Меня уже давно просили сделать доброе дело и написать не заумные типсы для людей, которые разбираются в различных пакетах, а сделать что-то более приближенное к iconАнкета для Радикального Прощения
Лорен, а меня совершенно игнорирует. Он винит во всем, меня и говорит, что я просто эмоционально неуравновешенная. Из-за него я чувствую...


Школьные материалы


При копировании материала укажите ссылку © 2013
контакты
100-bal.ru
Поиск