Дегейм для Верстальщиков @ DeForum.ru

12 Сообщения: 971 Зарегистрирован: 27.09.05

Здрасьте.
В соседнем топике (Идеальный сайт) начали затею с игрой в хтмл.

Все прекрасно, но, извините, это все равно, что бы я в типичный дегейм рисовал пейнтом и выкладывал в bmp - качество кода - отстой.

Предлагаю игру для матерых и знающих.

Чтобы избежать проблем c постингом кода и вообще - я накидал небольшой скриптик на коленке (не ругать)

http://geky.ru/ideal/

И уже начал игру:

http://geky.ru/ideal/1.htm

Требования к коду:
- Валидный XHTML
- Валидный CSS (Варнинги... Допускаются, но не желательны, конечно)
- Какая-никакая кроссбраузерность (Ие6,Опера8, ФФ, остальные не рассматрииваем браузеры, иначе не интересно будет)
- Минимум (Отсутствие) Хаков.
- Делаем одну страничку
- Цсс вшиваем в страничку, как сделано у меня. Смотрите последнюю версию - сохраняете сорцы, загружаете через форму. Усе.

Допускаются просто исправления ошибок. Не обязательно добавлять что-то свое.
ы!

1NV1Z0R,

. Поддерживаю, такой игры в ДеГеймсах я не припомню :-)

Я включился. Правда, косо описАл изменения, но понятно... title.

84 Сообщения: 1562 Зарегистрирован: 13.01.05

tentoys, блин, одновременно добавили )))
косяк вышел, пришлось впопыхах исправлять :-)

41 Сообщения: 6574 Зарегистрирован: 18.12.05

Поправлены варнинги css

12 Сообщения: 971 Зарегистрирован: 27.09.05

Товарищи, давайте без рекламы, а?

Сделать загрузку картинок? А то если взбредет в голову загрузить картинку

.talisman, :beer:

Я еще одну добавку сделал. Еэто, если, забыли тайтлы. Кстати, хочется ужинать, а потому не проверил свою добавку на предмет работоспособности под ИЕ.…
блин, чего-то не сработало...

12 Сообщения: 971 Зарегистрирован: 27.09.05

tentoys,
оно в ие не робит, но нормально

Рекламный блок уже не добавляем, а то некрасиво. Партейку в старкрафт сыграю и тоже что-ниьудь добавлю

41 Сообщения: 6574 Зарегистрирован: 18.12.05

1NV1Z0R писал(а):

Товарищи, давайте без рекламы, а?

Сделать загрузку картинок? А то если взбредет в голову загрузить картинку

Сделать.
Тайтлы не всплывают.

Kirill L., где не всплывают? О, кстати, да, не всплывают... кто-то внес исправления, но позабыл про тайты. Что-то не вносятся исправления и изменения.… исходник так и лежит 1341 байт. Хотя у меня уже 1974.

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
   <title>Internet Explorer 5-Free Zone</title>
   <style media="screen" type="text/css">
      * {padding:0; margin:0;}
      body,html {height:100%; }
      h1 {
         border-bottom: .5em solid #f0f8ff;
         color: #333;
         font: normal 30px/5px serif;
         margin: 5px 10px;
         background-color:inherit;
      }
      #wrap {
         border: 1px solid #ccc;
         margin: -40px auto 0 auto;
         width:90%;
         position:relative;
         top:50%;
         padding: 30px 15px;
      }
      #wrap a {
         font:normal 9px/10px Verdana, Arial, Helvetica, sans-serif;
         color:#ccc;
         text-decoration:none;
         display:block;
         background-color:inherit;
      }
#wrap a span {
         display: none;
         }
         
      #wrap a:hover {
         color:#000;
         background-color:inherit;
      }
     #wrap a:hover span {
         display: block;
         position:absolute;
         top: -50px;
         right: 50px;
         width: 200px;
         padding: 5px;
         margin: 10px;
         border: 1px dotted #000;
         z-index: 100;
         color: #aaa;
         background-color: #ccc;
         font: 10px Verdana, sans-serif;
         color: #000;
         text-align: center;
         }      
      #wrap ul {
         list-style-type:none;
         position:absolute;
         top:-10px;
         right:0;
      }
      #wrap li {
         float:left;
         margin:0 0 0 10px;
      }
   
   </style>
</head>
<body>
   <div id="wrap">
      <h1>
      Код &mdash; это Поэзия.
      </h1>
      <ul>
         <li><a href="http://validator.w3.org/check?uri=referer" id="xhtml" title="проверить код">xhtml<span>Если тыкнете мышОй по этой ссылке, то сможете удостовериться (или нет) в валидности кода</span></a></li>
         <li><a href="http://jigsaw.w3.org/css-validator/" id="css" title="проверить css">css<span>Если тыкнете мышОй по этой ссылке, то сможете удостовериться (или нет) в валидности css</span></a></li>
      </ul>
   </div>
</body>
</html>

12 Сообщения: 971 Зарегистрирован: 27.09.05

Добавил пушкина. Вопрос с оптимизацией еще открыт

1NV1Z0R, что такое "пушкин"? Кстати, файл по ссылке сверху -- без изменений :-(

игра как-то тогось... а картинки, imsho, не стОит добавлять, интерес пропадает :-)

41 Сообщения: 6574 Зарегистрирован: 18.12.05

оффтопик:

tentoys писал(а):

1NV1Z0R, что такое "пушкин"? Кстати, файл по ссылке сверху -- без изменений :-(

игра как-то тогось... а картинки, imsho, не стОит добавлять, интерес пропадает :-)

Пушкин - это великий поэт :laugh:

Смотреть надо не ссылку на htm файл, а ссылку на сайт, она чуть выше.

12 Сообщения: 971 Зарегистрирован: 27.09.05

tentoys,
Со всеми игрками, где все одно что то правят возникают несуразицы.

Но это издержки и не стоит перед ними складывать руки, имхо.

Kirill L. писал(а):

Пушкин - это великий поэт

Смотреть надо не ссылку на htm файл, а ссылку на сайт, она чуть выше.

Дадад. Теперь вижу. Кстати, я спросил не "кто", а "что" за Пушкин. :laugh:

Гуд. А скачивать что -- файл, который смотрим по ссылкам изменений? Ну, понятно, без картиннок. А если косяки с наложением, как у нас с .talisman?

12 Сообщения: 971 Зарегистрирован: 27.09.05

Последний кто запостил берет изменения из предыдущего и дополняет своими.

+ Изменил тултипы (давно, забыл отметить, теперь красивее)
+ Перевел на статику

12 Сообщения: 971 Зарегистрирован: 27.09.05

+ Сделал изменение цвета пушкина по наведению

http://geky.ru/ideal/13.htm

1NV1Z0R, Пушкин в ФФ не меняется. Я немного добавил для затравки про копирайты и дисклеймер. Чё-то при постинге не отразились мои замечания.…

12 Сообщения: 971 Зарегистрирован: 27.09.05

tentoys,
наверное два раза на форме кликнул, каюсь, моя дурацкая инициатива.

12 Сообщения: 971 Зарегистрирован: 27.09.05

http://geky.ru/ideal/17.htm
По-моему получается неплохо

1. код не валиден.
2. после "мы" запятую не надо.
3. я б этот блок сдвинул вправо ибо на этом месте и такой же шириной я б пустил вертикальное меню или новости, или объявления, типа, приглашаем авторов -- наполнится же контентов странички :-)

4. проверка на валидность хтмл и цсс -- ну не списком её пускать. Мне кажется, достаточно маленького дива, а списки пригоднятся для меню.
5. всё поднять выше, Пушкина в лого :laugh:

6. делать будем исключительно на хтмл, никакого пхп?
7. я б использовал подчеркивание ссылок, примерно. как описано тут: http://webmascon.com/topics/coding/39a.asp
8. Я не понял -- внесённые изменения -- кто их, 1NV1Z0R, лопатит вручную? ;-)

8. таки картинки можно? Если да, то первым делом фон сменить, отбивки-плашки...

12 Сообщения: 971 Зарегистрирован: 27.09.05

tentoys,
Тентойз, у нас явное недопонимание.

17ая версия - валидна

Дык, меняй-загружай, а мы посмотрим

Я лопачу только то, что мне кажется стоит перелопатить

12 Сообщения: 971 Зарегистрирован: 27.09.05

http://geky.ru/ideal/666.htm
Альтернативный вариант :lol:

Не стал публиковать, потому что
1) несерьезно
2) куча багов в разных браузерах - фф не хавает гифку пушкина (показывает только последний кадр)
- В фф статичного размера блок стал
- В Опере захлопнувшись единажды пушкин больше не открывается.

Так просто, полет фантазии

1NV1Z0R, =)))))))))))))))) валялси.…. :lol:

добавил. Валидно и все такое. Комменты там.

12 Сообщения: 971 Зарегистрирован: 27.09.05

x0bbit,
хорошо :beer:

Кстати, надо ссылку на CSS валидатор поправить на http://jigsaw.w3.org/css-validator/check/referer... Ща сделаю.

Нужны идеи и их реализации

вообще идеи мало - нет простора.

Нужно было сочинить некую фирму (допустим "ЗАО Ассенизатор"), выложить пару страниц текста о ее подвигах и пучок фоток с трудовых плацдармов.
Вот тогда бы можно было бы развернуться: тут тебе и верстка и логотипы и графика :dandy:

12 Сообщения: 971 Зарегистрирован: 27.09.05

x0bbit,
тут ведь только дегейм для верстаков. Фичи из кода и все такое.

1NV1Z0R писал(а):

x0bbit, тут ведь только дегейм для верстаков. Фичи из кода и все такое.

Снова не понял -- кто перекрасил Пушкина? ФФокс видит черную фотографию.
Кстати -- контент писАть будем? Ну, там, справа от "а мы лишь знаем, как писать хорошие стихи". Меню надо -- связь, полезные ссылки, о нас, карта сайта, и прочая ерунда. :-)

tentoys писал(а):

Снова не понял -- кто перекрасил Пушкина? ФФокс видит черную фотографию.

Похоже это у тебя глюки - у меня у самого фокс, и все в норме.

tentoys писал(а):

Кстати -- контент писАть будем? Ну, там, справа от "а мы лишь знаем, как писать хорошие стихи". Меню надо -- связь, полезные ссылки, о нас, карта сайта, и прочая ерунда. :-)

Вот про это я и говорил. Надо было сразу ТЗ составить и материал дать. Ну и что, что для кодеров конкурс. Зато было бы интереснее.
А то сейчас дело застопорится, когда неясно о чем писать =)

1NV1Z0R писал(а):

x0bbit,
тут ведь только дегейм для верстаков. Фичи из кода и все такое.

у меня фичи появляются не раньше, чем того требует задача. Сейчас там остобо негде изгалятся.

x0bbit писал(а):

Похоже это у тебя глюки - у меня у самого фокс, и все в норме.

Нет, это у Вас что-то не то. Пройдите по ссылке наверну этой страницы, убедитесь. А насчёт контента -- именно эту, конкретную страничку можно и без ТЗ. :dandy:

Ссылка наверху (если говорить о второй) ведет на первую версию. А сейчас уже 19-ая общими усилиями =) Ходить надо с страницы игры (первая ссылка). Там тоже выбирать верхнюю, на данный момент 19-ую версию.

12 Сообщения: 971 Зарегистрирован: 27.09.05

Вообсчем, я за безконтентье, но на этом далеко не уедешь, так что начинайте стругать, я подключусь.

Вкратце: вот для затравки добавил немного контента. Как идея -- рядом со ступеньками сдеать квадратики монотонные с цифрами внути, типа пунктов меню. При наведении на которые цифры (или стрелочки) становились бы жирнее и появлялось бы описание пункта меню, типа тултипа. А пока... вот такие абсолютно позиционированные блоки... грю ж -- для затравки. И, господа, перед фигурной скобкой, закрывающей описание свойств селектора css ставьте ; -- не забывайте последнее значение закрывать :-)

Да, блин -- Пушкин так и остался чернильно-чёрным, не перекрашивается под ним фон. ФФокс 1.5.0.1.

DeДверь
Логин:
Пароль:
	Автологин