CSS галерея

[Zombier]

CSS

#gallery {
  padding:0;
  margin:0;
  list-style-type:none;
  overflow:hidden;
  width:320px;
  height:425px;
  border:1px solid #888;
  background:#fff url(windows/win_back.gif);
  }
#gallery li {
  float:left;
  }
#gallery li a {
  display:block;
  height:30px;
  width:320px;
  float:left;
  text-decoration:none;
  border-bottom:1px solid #fff;
  cursor:default;
  }
#gallery li a img {
  width:320px;
  height:30px;
  border:0;
  }
#gallery li a:hover {
  background:#eee;
  height:239px;
  }
#gallery li a:hover img {
  height:239px;
  }

XHTML

<ul id="gallery">
<li><a href="#nogo">
<img src="windows/win7.jpg" alt="#1" title="#1" /></a></li>
<li><a href="#nogo">
<img src="windows/win8.jpg" alt="#2" title="#2" /></a></li>
<li><a href="#nogo">
<img src="windows/win9.jpg" alt="#3" title="#3" /></a></li>
<li><a href="#nogo">
<img src="windows/win10.jpg" alt="#4" title="#4" /></a></li>
<li><a href="#nogo">
<img src="windows/win11.jpg" alt="#5" title="#5" /></a></li>
<li><a href="#nogo">
<img src="windows/win12.jpg" alt="#6" title="#6" /></a></li>
<li><a href="#nogo">
<img src="windows/win13.jpg" alt="#7" title="#7" /></a></li>
</ul>

Собственно не пойму что такое: <a href="#nogo">, а точнее #nogo.

Это определенный класс заданный W3C? (Встречал похожее в создании кнопок, в css всё ясно, а в html прописывается её класс (class1, class2, class3) и она меняется)

А так же вопрос. Возможно ли создание галереи на css по типу превьюшки, но только что бы картинка открывалась не в новом окне, а там же, где и остальные картинки? И только скрипты?

[Vlad]

Это ссылка на якорь или элемент, у которого id="nogo". Может указываться для разных целей, например, чтобы ссылка была, но никуда не шла, чтобы скрипты делали какое-то действие при переходе к этому элементу.

[Zombier]

Vlad, но разве не достаточно просто # поставить? Да и скриптов, вроде, здесь нет.

[Vlad]

Достаточно. Но если это галерея, уверены, что нет скриптов?

[Zombier]

Да. Я собственно создал такой стиль css и в html документе прописал точно так же (Естественно меняя название картинок). Только вот в превьюшке галерея была горизонтальной, а у меня получилась вертикальной. Вот и не пойму.

[Softlink]

Да. Я собственно создал такой стиль css и в html документе прописал точно так же (Естественно меняя название картинок). Только вот в превьюшке галерея была горизонтальной, а у меня получилась вертикальной. Вот и не пойму.

А можно взглянуть на такую галерею, как она у вас работает? Есть ссылка на пример рабочий или код сюда весь выложите, чтобы можно было воспроизвести. Как-то любопытно, что вы там сделали.

[Zombier]

А можно взглянуть на такую галерею, как она у вас работает? Есть ссылка на пример рабочий или код сюда весь выложите, чтобы можно было воспроизвести. Как-то любопытно, что вы там сделали.

Это и есть тот, хм... рабочий код :]

Вот пару скриншотов:

Не трогая ничего

При наведении

Собственно код содрал отсюда: http://takein.ru/css/13-prosteyshaya-fotogalereya-s-pomoschyu-css.html

Там, как видно на картинке, галерея горизонтальная. Я плохо понимаю эти манипуляции в css, с помощью которых оно получается так, как получается. Разве что как и в случае со стилями к ссылкам. (Какие они обычные, при наведении и нажатии)

А по запросу в гугле a href="#nogo". Выдает кучу ссылок на подобные галереи, хотя по первой довольно красивая, хоть и не такая плавная, как при помощи скриптов :]

Вот собственно и интересуют галерея на css и интересные манипуляции с тегами (которые я с другом могу собрать в простенький сайт) :]

[WeezyF]

Интересный вариант галереи