LINUX.ORG.RU
решено  
CYB3R

[js] сделать вид динамической подгрузки


0

2

Понимаю, что не туда зашёл, но всё равно прошу помочь с такой траблой: хочу написать простенькую html-страничку. С кнопочками (1, 2, 3, 4) и какой-то информацией для каждой из них (форматированной в HTML).
Вот зашёл пользователь со включёнными скриптами:

 ---------------------------
 |  ---   ---   ---   ---  |
 | | 1 | | 2 | | 3 | | 4 | |
 |  ---   ---   ---   ---  |
 |                         |
 | Lorem ipsum über alles. |
 ---------------------------
Вот он нажал первую кнопку:
 ---------------------------
 |  ---   ---   ---   ---  |
 | | 1 | | 2 | | 3 | | 4 | |
 |  ---   ---   ---   ---  |
 | - Section 1 -           |
 | --------------          |
 | | table | HN |     ---  |
 | --------------    |img| |
 | | porn  | no |     ---  |
 | --------------          |
 | | money | 10 |          |
 | --------------          |
 |                         |
 | Lorem ipsum über alles. |
 ---------------------------
А теперь третью:
 ---------------------------
 |  ---   ---   ---   ---  |
 | | 1 | | 2 | | 3 | | 4 | |
 |  ---   ---   ---   ---  |
 |  - Section 3 -          |
 |    -----------------    |
 |    |               |    |
 |    |               |    |
 |    |               |    |
 |    | bigimage.jpg  |    |
 |    |               |    |
 |    |               |    |
 |    -----------------    |
 |                         |
 | Lorem ipsum über alles. |
 ---------------------------
Т.е. с нажатием на новую кнопку, текст, показанный предыдущей кнопкой пропадает и появляется текст, соответствующий нужной кнопке. Надеюсь, объяснил наглядно. НО: весь размеченный текст для каждой кнопки хранится всё в том же html-файле, извне ничего не подгружается.
А если зайдёт пользователь с отключённым js, то увидит он такое:
 ---------------------------
 |  ---   ---   ---   ---  |
 | | 1 | | 2 | | 3 | | 4 | |
 |  ---   ---   ---   ---  |
 | - Section 1 -           |
 | --------------          |
 | | table | HN |     ---  |
 | --------------    |img| |
 | | porn  | no |     ---  |
 | --------------          |
 | | money | 10 |          |
 | --------------          |
 |                         |
 | - Section 2 -           |
 |        STOP SOPA!       |
 |                         |
 | - Section 3 -           |
 |    -----------------    |
 |    |               |    |
 |    |               |    |
 |    |               |    |
 |    | bigimage.jpg  |    |
 |    |               |    |
 |    |               |    |
 |    -----------------    |
 |                         |
 | - Section 4 -           |
 | Nothing here :(         |
 |                         |
 | Lorem ipsum über alles. |
 ---------------------------
т.е. всё и сразу (т.к. не работает этот самый скрывающий скрипт).
Теперь сразу вопрос: Возможно ли такое? Целесообразно ли такое? Как это сделать? Много кто сидит с отключёнными скриптами?


[#]  
lazyklimm
>>-----Цитата---->>

Возможно ли такое?

<<-----Цитата----<<

да

>>-----Цитата---->>

Целесообразно ли такое?

<<-----Цитата----<<

нет

>>-----Цитата---->>

Как это сделать?

<<-----Цитата----<<

rtfm

>>-----Цитата---->>

Много кто сидит с отключёнными скриптами?

<<-----Цитата----<<

я

**** ()
[#]  
>>-----Цитата---->>

Много кто сидит с отключёнными скриптами?

<<-----Цитата----<<

Едва ли один процент наберется.

anonymous ()
[#]  

предлагаю сделать не скрывающий, а показывающий скрипт. т.е. в теге <noscript> писать что-нибудь типа "Включите Javascript или проследуйте в пешее эротическое"

anonymous ()
[#] Ответ на: комментарий от CYB3R 31.01.2012 20:38:02  
demmsnt

Пользуйся. Если что надо подсказать пиши demmsnt at gmail.com тока я тут пока безработный и читаю почту в будке самоубийств раз в неделю (день).

* ()
[#] Ответ на: комментарий от CYB3R 31.01.2012 20:37:52  

так, как ты и написал — вывалятся вверху ссылки/кнопки, под ними контент по слоям

(или как ты там css-иной раскрасишь :)

P.S. Пользователь NoScript

()
[#]  
>>-----Цитата---->>

Много кто сидит с отключёнными скриптами?

<<-----Цитата----<<

Я бы задал вопрос по другому, ты готов забить на тех, кто выключает JavaScript (я бы вообще блокировал по IP прямо на файрволе тех, кто зашел с установленным NoScript). Хитрость в том, что создавая интерфейс удобный одним и неудобный другим, ты привлекаешь к себе тех, кто тебе нужен и отталкиваешь кто не нужен. Тебе нужны параноики? Не нужно делать проект для всех и прогибаться под всех (прогибать других тоже не надо), нужно делать проект для тех, кто ТЕБЕ нужен, с кем ты хочешь работать.

Прежде, чем реализовывать такое, пойми, что это очень неудобное для поисковиков решение. Если тебе нужно, чтобы страница находилась поисковиком, то так делать не надо. Поясню - на кнопе 3 у тебя висит описание, как приготовить курицу в винном соусе, а на кнопке 1 как пожарить яичницу. Поисковик, проиндексирует все содержимое страницы (и про курицу и про яичницу), и пользователь, вбив в поиск про курицу - найдет твою страницу, но ссылка для страницы будет одна (для содержимого всех четырех кнопок) и нажав в поиске результаты про курицу чувак что увидит?

Если с поисковиком заморачиваться не нужно (страница не индексируемая), то такое легко реализовать на JQuery (на простом JavaScript тоже можно написать, но быстрее разобраться с JQuery). Пишешь страницу как есть, при загрузке страницы скриптом закрываешь все блоки, кроме кнопок, а при нажатии на кнопку открываешь только нужный блок. У человека без JS блоки при открытии страницы не закроются (т.е. он увидит все, как ты и хотел).

http://api.jquery.com/category/effects/basics/

anonymous ()
[#] Ответ на: комментарий от anonymous 01.02.2012 2:25:28  
>>-----Цитата---->>

Прежде, чем реализовывать такое, пойми, что это очень неудобное для поисковиков решение. Если тебе нужно, чтобы страница находилась поисковиком, то так делать не надо.

<<-----Цитата----<<

Для решения придумали HTML History API, и есть js для его эмуляции в старых браузерах. Впрочем, нужно будет городить много сервер-сайда на пустом месте.

anonymous ()
[#] Ответ на: комментарий от anonymous 01.02.2012 2:53:37  

> Для решения придумали HTML History API, и есть js для его эмуляции в старых браузерах. Впрочем, нужно будет городить много сервер-сайда на пустом месте.

все зависит от того как у тебя все изначально спланировано. Может там бэкенд генирирует XML/JSON, а фронтенд просто накладывает шаблон. Хотя у топикпастера вряд ли такое.

** ()
[#] Ответ на: комментарий от zili 01.02.2012 12:14:39  
CYB3R

Хотя там вот эта беда:

>>-----Цитата---->>

У такого решения есть одна проблема: если на странице есть вертикальная полоса прокрутки, а верхняя граница таба находится ниже верхней границы экрана, то при нажатии на закладку таба страница промотается так, что таб окажется наверху — точно так же, как при нажатии на якорь страница проматывается до содержимого, указанного в адресе после хеша.

<<-----Цитата----<<
* ()
[#] Ответ на: комментарий от demmsnt 01.02.2012 22:37:12  
tazhate
>>-----Цитата---->>

На фотке не мой мот. Он стоит 700 т.р. Уже продали. Хороши аппарат.

<<-----Цитата----<<

вот видишь, смог бы даже не только инет оплатить, но и еды купить.

***** ()
[#] Ответ на: комментарий от demmsnt 01.02.2012 22:59:42  
tazhate
>>-----Цитата---->>

Зациклило тебя чтоли? Как я могу продать то чего нет?

<<-----Цитата----<<

да, мы входим в рекурсию. как нет? есть же. точно есть. поищи в гараже.

***** ()
[#] Ответ на: комментарий от tazhate 01.02.2012 23:04:42  
demmsnt

Вот ведь блин. У меня нет гаража. У меня единственный мот это скутер Keeway за который я еще должен 30т.р.

Я с удовольствием прокатился на BMW k1200 который на фотке BMW 1000rr, на Suzuki Bandit 600, На Honda Hornet, на Honda CRF450, на Suzuki DRZ 450. На Yamaha WR250x и что, то вроде еще было.

Но Yamaha WR250 стоит 280 т.р. А я получаю 30 т.р. в МЕСЯЦ. И я при всем своем желании не могу себе позволить купить сей пепелац! Хочу, но не могу! А да еще был Djebel и Ковровец уродец калька с хонды.

* ()
[#] Ответ на: комментарий от demmsnt 01.02.2012 23:14:23  
tazhate
>>-----Цитата---->>

Давай так. Ты мне находишь 60. И я тебе первые пол года отдаю 20 ежемесячно?

<<-----Цитата----<<

о, да без проблем. cv где твой?

***** ()
[#] Ответ на: комментарий от tazhate 01.02.2012 23:13:42  
demmsnt

Ага знаю я их. На испытательный срок 50% потом это 40 белая. А на руки - 13% и ту ты не получишь ибо вылетишь. Но думаю напишу для интереса.

Если не так, то с меня штуки три отстегну 100% просто за наводку. А может и больше.

* ()
[#] Ответ на: комментарий от demmsnt 01.02.2012 23:17:47  
tazhate
>>-----Цитата---->>

Если не так, то с меня штуки три отстегну 100% просто за наводку. А может и больше.

<<-----Цитата----<<

давай просто дурацкую аватарку уберешь, этого достаточно.

***** ()
[#] Ответ на: комментарий от tazhate 01.02.2012 23:25:14  
demmsnt

В смысле? Мот чтоли? Да могу и убрать. В МСК не хочу. Тоесть судя по всему надо, но не хочу. А мот был хороший. Там квикшифтер и т.п. А что тебе в нем не нравится? Мне приятно, я вспоминаю и чувствую типа въехал в тред.

* ()
[#] Ответ на: комментарий от demmsnt 01.02.2012 23:29:25  
tazhate

http://hh.ru/vacancy/5357164?query=системный администратор

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

***** ()
[#] Ответ на: комментарий от tazhate 01.02.2012 23:24:34  
demmsnt

Да и для МСК ЗП маленькие. У нас тут и 150 есть. Но не у программистов. Хотя может и повезет. У нас квартира стоит 20, у вас 30. И так далее... ЗП надо в два раза увеличить. Хотя я возможно и не прав.

* ()
[#] Ответ на: комментарий от tazhate 01.02.2012 23:32:40  
demmsnt

Спасибо. Напиши свои ЯД я из чисто человеческого чувства тебе завтра 100р на пиво закину. Я тут хоть и безработный но могу пока заработать. А поддержка дорого стоит... Спасибо.

А чем тебе аватар не понравился?

* ()
[#] Ответ на: комментарий от demmsnt 01.02.2012 23:35:26  
tazhate
>>-----Цитата---->>

Напиши свои ЯД я из чисто человеческого чувства тебе завтра 100р на пиво закину

<<-----Цитата----<<

забей, аватарку лучше бэ.

>>-----Цитата---->>

А чем тебе аватар не понравился?

<<-----Цитата----<<

ужасный он. дорогой мотоцикл, ты и всё это непонятно зачем. парни мы тут простые, линуксовые, мотоциклы нам не нужны.

***** ()
[#] Ответ на: комментарий от demmsnt 01.02.2012 23:36:01  
tazhate
>>-----Цитата---->>

написать можно в demmsnt at gmail.com

<<-----Цитата----<<

лор удобнее %) в общем, я дал тебе вектор - главное крупная компания + то, в чем ты шаришь. сядь да разошли резюме нормально. но я бы на твоем месте точно переехал бы.

***** ()
[#] Ответ на: комментарий от tazhate 01.02.2012 23:36:49  
demmsnt
>>-----Цитата---->>

ужасный он. дорогой мотоцикл, ты и всё это непонятно зачем. парни мы тут простые, линуксовые, мотоциклы нам не нужны.

<<-----Цитата----<<

И кстати открою тебе секрет жудко неудобный в вождении. Но есть свои плюсы.

А мотоциклы нужны. Ну ладно щас.

* ()