jquery

УрокИзменение состояний формы в Drupal 7

Нередки ситуации, когда в зависимости от нажатия элемента на форме появляются/исчезают/меняются элементы этой самой формы. И если для обычных полей это можно сделать модулем conditional fields, то для своих форм придётся всё писать самому. В Друпале это можно сделать либо через ajax (об этом более подробно можно почитать тут) либо же через параметр #states в Forms API. И сейчас речь пойдёт именно о втором варианте.

Итак, #states. По сути, это PHP обёртка для простейших функций jQuery, которые изменяют состояние формы при совершении с ней заранее заданных действий.

Состояние элемента #states является ассоциативным массивом такого вида:

УрокДелаем popup логин на jquery.ui.dialog

В ядре Drupal 7 появились дополнительные js библиотеки, которые можно подключать по необходимости (по умолчанию они отключены). В частности, библиотка jquery.ui, которая в 6й версии Друпала была отдельным модулем. Теперь же достаточно вызвать функцию drupal_add_library() с нужными параметрами - и необходимые скрипты и стили будут подключены автоматически.

УрокСкрипт, который меняет цвет первого слова в строке

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

Собственно, сам скрипт:

УрокКак обновить jQuery в Drupal на более позднюю версию

Вам нравятся сайты, которые содержат в себе красивые слайдшоу, раскрывающиеся менюшки, в меру динамичные плюшки? Конечно, кто ж не любит. С этим очень успешно справляется javascript, в частности его библиотека jQuery. Она создана чтобы упростить разработчикам жизнь при работе со скриптами. В ней имеется огромный набор полезных функций, благодаря которым в несколько строк можно написать поразительные вещи. Более того, имеется огромное количество уже готовых решений, подключив которые можно практически без знаний js получить желаемый результат в виде довольно неплохих визуальных эффектов.

По умолчанию Drupal 6 содержит в своём ядре библиотеку jQuery версии 1.2.6 (Drupal 7 - jQuery 1.4.4). Я предлагаю 2 варианта решения этой проблемы:

Вариант 1. Включение модуля jQuery Update.

УрокВыпадающее праймари (секондари) горизонтальное меню

В прошлом уроке я писал о создании вертикального меню. Однако оно только при клике. И без закруглений. Кому-то оно может быть очень полезным, но большинству сайтов требуется более стандартное меню - горизонтальное, выпадающее, с закруглениями. Причём эти закругления должны подгружаться без задержек.

Итак, сначала выводим меню также как и в предыдущем уроке (в page.tpl.php):

<?php if ($primary_links): ?>
  <div id = "menu"><?php print menu_tree('primary-links'); ?></div>
<?php endif; ?>
?>

Важное замечание: чтобы выводилось подменю, надо перейти в раздел /admin/build/menu-customize/primary-links и у пунктов, имеющих подменю, поставить галочку напротив развёрнутое(expanded), иначе оно не покажется.

Урок"Умное" раскрывающееся вертикальное меню на jquery за 2 минуты

Сейчас поговорим о том, как за 2 минуты сделать своё выпадающее меню, не обделённое мозгами, на скриптах, не прибегая к дополнительным модулям.

Допустим, у нас есть такое праймари меню:

  • Топ 100
  • Графика
    • Абстракция
    • Кино
    • Компьютерная графика

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

Решение
Сначала выводим в нужное нам место праймари меню. Можно через блок, можно через page.tpl.php, кому как удобнее. Я обычно вывожу вторым способом:

<?php if ($primary_links): ?>
  <div id = "menu"><?php print menu_tree('primary-links'); ?></div>
<?php endif; ?>