CSS – анимируем подписи к картинкам

CSS – анимируем подписи к картинкам

Ниже приводятся различные эффекты для раскрытия подписей к изображениям с использованием HTML тега <figcaption>. CSS cвойство transform используется для позиционирования (через translate3d()) и для вращения различных компонент внутри элемента <figure>…<figure>. В результате получаем довольно гибкую систему проявления подписей к изображениям с различными эффектами, которая работает с изображениями различных размеров без необходимости модифицировать CSS файл.

CSS – справочник, которым я пользуюсь

Хочу поделиться очень удобным справочником по CSS, в котором приводится не только синтаксис, но и даются разъяснения по атрибутам и  практическому использованию. Особенно полезным частенько бывают живые примеры (live demo)  

Yii2 – зависимые (каскадные) выпадающие списки

При создании доски объявлений понадобилось создать каскадные (зависимые) выпадающие списки дляя ввода и редактирования категорий объявлений. Диаграмма для таблиц показана ниже: Каждая категория содержит одну или несколько подкатегорий. В свою очередь подкатегория содержит один или несколько типов объявлений. Примером может служить система рубрикации на avito.ru:

Yii2 – как создать выпадающий список

Предположим, что имеется модель Category, соответствующая таблице в базе данных Category. В этой таблице хранятся, к примеру, разделы доски объявлений. Сами объявления хранятся в другой таблице, в которой есть чужое поле (foreign key) FK_IDCategory. При публикации объявления необходимо создать выпадающий список с этими разделами (категориями), чтобы пользователь смог выбрать тот раздел, которому соответствует его объявление. Если форма для объявления находится внутри ActiveForm, то тогда код для впадающего списка может примерно выглядеть так:

В выше приведенном коде $model – это модель самого объявления. ‘FK_IDCategory’ – это чужое поле в таблице объявлений, хранящее номер категории, к которой относится данное объявление. Далее вызывается метод dropDownList, создающий собственно выпадающий список. В качестве параметра ему передается массив, созданный на основе записей из таблицы категорий

Yii2 – скрытые поля

Предположим, что мы хотим создать внутри формы скрытое поле и установить его значение равным ID пользователя, который является, к примеру, автором поста блога. Пусть ‘author_id’– атрибут модели, который мы должны связать с ID пользователя, создающего данный пост. Есть два способа создать скрытое (hidden)  поле внутри формы. Первый способ – это вызвать метод field() класса yii\widgets\ActiveForm, который вернет объект класса yii\widgets\ActiveField. В качестве параметров передаем модель и атрибут модели, для которого устанавливается значение. В нашем примере – это ‘author_id’. В свою очередь в классе yii\widgets\ActiveField реализован метод hiddenInput. Это метод как раз и создаст необходимый нам объект – скрытое поле с заданными атрибутами. С использованием цепочечных вызов это будет выглядеть примерно так:

Последний вызов в цепочке подавляет вывод заголовка (label)

jQuery – создаем полосы прокрутки для блочного контента

Совсем недавно вышло обновление очень популярной статьи, посвященной прокрутке (скроллу) блочного контента. Речь идет о плагине для создания полос прокрутки для отдельных частей страницы (блоков). Ниже – перевод статьи “jQuery custom content scroller” Знакомьтесь – malihu-custom-scrollbar-plugin представляет собой настраиваемый jQuery плагин для прокрутки определенного контента (блока) на странице.

MySQL – найти дубликаты (повторяющиеся записи по одному или нескольким полям)

Привожу пример запроса, который выводит все записи таблицы, в которых значения одного или нескольких полей совпадают. Возьмем для примера имя таблицы table_name и поля field_1 и field_2. Пусть также первичный ключ имеет название id. Тогда запрос может выглядеть следующим образом: SELECT t1.id, t1.field_1 , t1.field_2 FROM table_name t1 INNER JOIN table_name t1 ON (t1.field_1 = t2.field_1 AND t1.field_2 = t2.field_2) WHERE t1.id<> t2.id