1 В избранное 0 Ответвления 0

OSCHINA-MIRROR/bszz-picfixed

Присоединиться к Gitlife
Откройте для себя и примите участие в публичных проектах с открытым исходным кодом с участием более 10 миллионов разработчиков. Приватные репозитории также полностью бесплатны :)
Присоединиться бесплатно
Клонировать/Скачать
Внести вклад в разработку кода
Синхронизировать код
Отмена
Подсказка: Поскольку Git не поддерживает пустые директории, создание директории приведёт к созданию пустого файла .keep.
Loading...
README.md

picfixed — это равновысотный и равноширинный водопад, который позволяет легко реализовать равновысотные и равноширинные водопады для изображений или div (здесь «равноширинный» означает равную ширину строк).

Особенности плагина:

  • равновысотность — все элементы в одной строке имеют одинаковую высоту;
  • равноширинность — общая ширина всех строк одинакова;
  • равное масштабирование — все изображения масштабируются с сохранением пропорций с помощью CSS, без деформации;
  • простота использования.

Способ применения (подробности см. в примере программы):

1. Сначала импортируйте jquery и файл fixedpic.js:

<script src="jquery.min.js"></script>
<script src="fixedpic.js"></script>

Основной способ использования:

HTML:

<div id="box-img">
		<img src="img/1.jpg" alt="">
		<img src="img/img.webp" alt="">
		...
	</div>

JavaScript:

// Указать высоту сближения
$('#box-img').fixedpic(300);
// Указать высоту и стандартную ширину сближения
$('#box-img').fixedpic(350,990);// Указать высоту, ширину сближения

Этот плагин также может быть применён к DIV:

    <div id="box-img">
		<div style="width:124px;height:300px;background-color: #ccc;padding:3px;">1</div>
		<div style="width:235px;height:367px;background-color: #233">2</div>
		...
		<div style="width:327px;height:399px;background-color:#949">6</div>
		...
	</div>

Оставить поля:

$('#box-img').fixedpicSet({
        paddingTop:11,paddingLeft:11,paddingRight:0,paddingBottom:0,
        borderTop:1,borderLeft:1,borderRight:1,borderBottom:1,
        borderStyle:"dotted"
    }).fixedpic(340,990);

Комментарии ( 0 )

Вы можете оставить комментарий после Вход в систему

Введение

Описание недоступно Развернуть Свернуть
MIT
Отмена

Обновления

Пока нет обновлений

Участники

все

Недавние действия

Загрузить больше
Больше нет результатов для загрузки
1
https://api.gitlife.ru/oschina-mirror/bszz-picfixed.git
git@api.gitlife.ru:oschina-mirror/bszz-picfixed.git
oschina-mirror
bszz-picfixed
bszz-picfixed
master