X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Резиновая галерея изображений
stvord
stvord
Topic Starter сообщение 31.8.2011, 12:14; Ответить: stvord
Сообщение #1


Необходимо создать галлерею где число работ в зависисоти от разрешения растягивается.

Отступы между картинками резиновые, по мере уменьшения разрешения число представленных изображений уменьшается пропорционально.
Нечто подобное можно наблюдать на сайте студии Лебедева.
Скорее это имеет отношение и к css но первично интересует решение на javascript.

Заранее спасибо за вашу помощь. :rolleyes:
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
pavelsc
pavelsc
сообщение 31.8.2011, 12:50; Ответить: pavelsc
Сообщение #2


[JS]
/*
* Author: Mamaevsky Vasily
*/

function Abracadabra() {
var min_item_w = 244;
var stretch = 2;

var s_teaser = $('.teaser');
var s_teasers = $('.teasers').css('width', stretch * 100 + '%');
var s_teasers_holder = $('.teasers_holder');
var _window = $('body');

var window_w = _window.width();
var window_w_tmp = 0;

var items = 0;
var items_tmp = 0;

var delimiter = $('<div class="clear" id="del"></div>');

function _init() {
$(window).resize(function(){
window_w = _window.width();
items_tmp = Math.floor(window_w / min_item_w);

if (items_tmp != items) {
if (items_tmp > 0) items = items_tmp;
new_w = 100 / items / stretch;
new_w = new_w.toFixed(3);

s_teaser.css('width', new_w + '%');
delimiter.insertBefore(s_teaser.eq(items));

s_teaser.each(function(index) {
if (index > items * 2 - 1) $(this).hide();
else $(this).show();
});
}
});

$(window).resize();
}

return {
init: _init
}
}

$(function(){
var ruberTeasers = new Abracadabra();
ruberTeasers.init();
$(window).resize();
});[/JS]

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Продается сайт фотосток ИИ изображений
Хороший вариант!
20 alexey 3279 25.6.2023, 15:28
автор: alexey
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыКорректность показа вёрстки изображений на разных гаджетах
Не сохраняются пропорции изображений на смартфонах
1 master-vek 37258 25.3.2021, 13:22
автор: tedder
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыЛичный фотосток, много бесплатных изображений
15 Ultrastalker 5980 30.3.2020, 10:15
автор: Ultrastalker
Открытая тема (нет новых ответов) Продам 120 изображений с фотостока DepositPhotos
Выгодное предложение
6 Морфин 1790 20.1.2020, 20:36
автор: Морфин
Открытая тема (нет новых ответов) Обработка фотографий и изображений для сайтов, и не только …
0 DarkUnicorn 2137 4.6.2019, 22:57
автор: DarkUnicorn


 



RSS Текстовая версия Сейчас: 24.4.2024, 20:51
Дизайн