Как сделать такую страницу

[mortido]

Всем привет. Захотел сделать на своей сайте страницу вот как эта: http://www.hearthstone-decks.com/carte . Но не совсем понятно как она устроена. Хотелось бы узнать у людей, которые делали что-то подобное, как выглядит структура такой страницы. То есть визуальную часть можно сделать в обычном редакторе wordpress, а как сделать так, чтобы фильтры начали работать и как добавить навигацию(которая внизу и вверху) именно в эту страницу. Понятно, что тут нужно скрипты какое-то писать, а как вот их подключить именно к этой странице. Я не прошу вас делать эту страницу за меня, просто помогите разобраться в самой ее структуре и что понадобиться чтобы ее сделать. Заранее благодарен.

[2chan]

>jQuery на сайте
Будешь его юзать - заебёшься. Или читай документацию, или переделай фичи под обычный JavaScript.

Алсо, там дофига всего, что именно тебя интересует? Не можешь же ты не знать всего.

[mortido]

ну я вообще разбираюсь более менее только html и css. Javascript начал учить буквально на днях. Вот меня интересует именно то, как работают фильтры. То есть я помечаю, что мне надо и он отыскивает нужную карту - вот это мне нужно узнать как делается. И еще есть какой нибудь способ запихнуть столько картинок в какой нибудь скрипт, чтобы не вставлять каждую по отдельности?

[2chan]

Скорее всего, скрипт отсылает форму на сервер. Т.е. когда ты выбрал нужное и нажал "Filtrer", то скрипт отправляет запрос, скорее всего асинхронный, с формой (<form>) на сервер.
Сервер может работать с базой данных, а выбрать из неё те параметры что ты отметил на странице - не составит труда. Дальше сервер может поступить по разному:
1) Он пересылает тебе данные батбазы в формате JSON (надеюсь, ты знаешь что это), а скрипт на твоей стороне уже преобразует это в HTML и парсит картинки.
2) Если сервер годный и выдержит доп. нагрузку, то он может сам парсит всё это в HTML и готовый продукт пересылает тебе.
В любом случает, потом скрипт просто вставляет на прежнее место то что получилось. А выглядит это всё красиво из-за CSS: opacity во время отправки и ожидания данных.

[mortido]

а сколько скриптов понадобиться для такой страницы?

[2chan]

Смотря что ещё тебе нужно. Можно справится чистым AJAX-запросом - это, если учитывать что запрос должен быть методом 'POST', где-то строк 20-40 стилизованного кода. Если нужно сделать это красиво, то больше - добавляется работа со стилями. Если не хочешь работать через атрибут "onclick", то ещё строка для того чтобы повесить событие.
А если ты решишь, что сервер должен возвращать JSON, то ещё строк десять его парсить в HTML.
Алсо, не забывай что тебе нужно куда-то отправлять запросы. Т.е. ещё написать обработчик на стороне сервера. Думаю выбрать из датбазы - пять строк с учётом подсоединения к ней. Сделать всё это в JSON - пару строк, не больше. А вот если хочешь сразу сделать HTML...
В обще, зависит от того какими методами делать будешь.

[kostyanet]

Я не прошу вас делать эту страницу за меня

Надо попросить и дать денег. ВОт и все.

[Safort]

mortido,
для такого тебе нужно знать работу с событиями, AJAX, немного DOM, и какой-нибудь серверный язык, тот же PHP.

Есть пара вариантов с отдачей готовой страницы(1) или же отдачей данных(2).

1. Пользователь отмечает нужные чекбоксы и жмёт на "Filter" (работа с событиями) -> ты берёшь данные из форм(работа с DOM) и отправляешь их на сервер(работа с AJAX) -> сервер формирует готовый HTML(работа с PHP) и отсылает его твоему JS -> получившееся ты вставляешь в нужный HTML-элемент (снова работа с DOM).

2. Всё тоже самое, что и в первом, за исключением того, что тут сервер отдаёт не готовый HTML, а данные в нужном формате(JSON, XML и т.д) по которым клиент строит страничку.

[Safort]

mortido,

а сколько скриптов понадобиться для такой страницы?

Смотря как делать будешь, можно и одним обойтись)

[mortido]

Если одним, то он будет большим?