ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как реализовать такую галерею?
7 сообщений из 7, страница 1 из 1
Как реализовать такую галерею?
    #38072797
son6ka
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
son6ka
Участник
Смысл следующий: по клику на превью фото открывается попап-окно с оригиналом. Здесь все просто. Но кроме этого в попапе нужно реализовать листание фото. Для этого в попапе вместе с оригиналом активного изображения справа выводим край второго, кликнув по которому происходит листание(горизонтально справа налево).

Подскажите, пожалуйста, где смотреть и куда бежать.
...
Рейтинг: 0 / 0
10.12.2012, 16:32
| Ответить | Цитировать | Написать  
Как реализовать такую галерею?
    #38072940
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Паганель
Участник
image gallery
...
Рейтинг: 0 / 0
10.12.2012, 17:32
| Ответить | Цитировать | Написать  
Как реализовать такую галерею?
    #38072960
son6ka
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
son6ka
Участник
Паганель,

не то.

Меня интересует именно момент, когда в попапе выводится не только текущее фото, но и часть следующего в списке.
...
Рейтинг: 0 / 0
10.12.2012, 17:40
| Ответить | Цитировать | Написать  
Как реализовать такую галерею?
    #38073041
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
son6ka, а с чем собственно проблемы: с алгоритмом, вёрсткой...?
...
Рейтинг: 0 / 0
10.12.2012, 18:20
| Ответить | Цитировать | Написать  
Как реализовать такую галерею?
    #38073057
son6ka
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
son6ka
Участник
skyANA, собственно, больше наверное алгоритм.

как показать не только "кликнутое" фото, но и следующее(часть)?
...
Рейтинг: 0 / 0
10.12.2012, 18:28
| Ответить | Цитировать | Написать  
Как реализовать такую галерею?
    #38073110
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
son6ka, к примеру так:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
<!DOCTYPE HTML>
<html>
<head>
  <style>
    ul {        
      list-style-type: none;
      margin: 0;
      padding: 0;
      white-space: nowrap;
      width: 655px;        
    }
    
    li {
      border-width: 10px;
      display: inline-block;
      height: 333px;
      overflow: hidden;
    }
      
    li.current {        
      width: 500px;
    }
      
    li.next {
      width: 150px;
    }
  </style>
</head>
<body>
  <ul>
    <li class="current">
      <img src="http://farm5.static.flickr.com/4058/4252054277_f0fa91e026.jpg" alt="">
    </li>
    <li class="next">
      <img src="http://farm3.static.flickr.com/2489/4234944202_0fe7930011.jpg" alt="">
    </li>
  </ul>  
</body>
</html>
...
Рейтинг: 0 / 0
10.12.2012, 19:00
| Ответить | Цитировать | Написать  
Как реализовать такую галерею?
    #38095729
rustornado
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
rustornado
Гость
skyANAson6ka, к примеру так:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
<!DOCTYPE HTML>
<html>
<head>
  <style>
    ul {        
      list-style-type: none;
      margin: 0;
      padding: 0;
      white-space: nowrap;
      width: 655px;        
    }
    
    li {
      border-width: 10px;
      display: inline-block;
      height: 333px;
      overflow: hidden;
    }
      
    li.current {        
      width: 500px;
    }
      
    li.next {
      width: 150px;
    }
  </style>
</head>
<body>
  <ul>
    <li class="current">
      <img src="http://farm5.static.flickr.com/4058/4252054277_f0fa91e026.jpg" alt="">
    </li>
    <li class="next">
      <img src="http://farm3.static.flickr.com/2489/4234944202_0fe7930011.jpg" alt="">
    </li>
  </ul>  
</body>
</html>


выдает ошибку :(
...
Рейтинг: 0 / 0
28.12.2012, 09:16
| Ответить | Цитировать | Написать  
7 сообщений из 7, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как реализовать такую галерею?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38072797&tid=1448914]:
 0ms
get settings:
 7ms
get forum list:
 13ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 156ms
get topic data:
 7ms
get forum data:
 2ms
get page messages:
 37ms
get tp. blocked users:
 1ms
others: 208ms
total:  435ms
созд. / загр.: 435ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]