Автор Тема: Php + JavaScript = спойлеры на этот форум )  (Прочитано 12057 раз)

Оффлайн wut

  • Старший
  • ****
  • Сообщений: 531
  • Карма: +0/-0
 Итак, приступим :)
 Есть несколько пожеланий/жалоб. Впринципе, требуется скрыть смайлики в отдельный контернер, который называется спойлер. Покапался в инете - нашел внешний вид :) Поржал  :D Может мне попался не тот, который нужен, но то что попалось - сюда не попадет.
 Приступим :)
 Для полного счастья нам надо определиться с тем - что надо от спойлера ( контейнера ). Как я в голове себе выложил - это просто манипулирование свойством display.
 Примитивное style.display:none; не спасет, потому что нужен заголовок :)
 Мой мозг дошел до следующего:
 HTML
     <div class='spoiler' id='spoiler0'>
    <div class='spoiler_head' id='spoiler0_h' onClick='hide_show_Me(this.id)'>
     Заголовок спойлера
    </div>
    <div class='spoiler_content' id='spoiler0_hc'>
     Содержимое спойлера :)
    </div>
   </div>
 
JavaScript
     function hide_show_Me(id){
    var sp_head=document.getElementById(id);
    var sp_cont_id=id+'c';
    var sp_cont=document.getElementById(sp_cont_id);
    if(sp_cont.style.display=='none'){sp_cont.style.display='inline';}else{sp_cont.style.display='none';};
   };
 
В style.css или ином, отличном файле стилей пишем следующее:
    .spoiler{background:#eeeeee;width:100px;}
   .spoiler_content{display:none;}
   .spoiler_head{background:#dddddd;text-align:center;}
   div.spoiler_head:hover{background:#ff0000;}
 
И теперь осталось только в content поместить php код со смайликами  :)
 Проверил - работает :)
 PS: думаю вы сможете прикрутить css к php. Или хотябы в head прописать <style>...</style>
mb986

Оффлайн wut

  • Старший
  • ****
  • Сообщений: 531
  • Карма: +0/-0
Php + JavaScript = спойлеры на этот форум )
« Ответ #1 : 23-09-2008 11:25:18 »
Вот болле клевый результат :)
<HTML>
<HEAD>
 <script language='JavaScript' type='text/javascript'>
   function hide_show_Me(id){
    var sp_head=document.getElementById(id);
    var sp_cont_id=id+'c';
    var sp_cont=document.getElementById(sp_cont_id);
    var znak=document.getElementById('pm');
    if(sp_cont.style.display=='none'){
                  sp_cont.style.display='inline';
                  znak.innerText='-';
                                     }else{
                  sp_cont.style.display='none';
                  znak.innerText='+';
                                     };
   };
 </script>
 <style>
   .znak{width:15px;display:inline;}
   .spoiler{background:#dddddd;width:600px;}
   .spoiler_content{}
   .spoiler_head{background:#cccccc;text-align:left;}
   div.spoiler_head:hover{background:#ff0000}
 </style>
</HEAD>
<BODY>
   <div class='spoiler' id='spoiler0'>
    <div class='spoiler_head' id='spoiler0_h' onClick='hide_show_Me(this.id)'>
     <div id='pm' class='znak'>+</div> Заголовок
    </div>
    <div class='spoiler_content' id='spoiler0_hc' style='display:none;'>
     Содержимое спойлера<br/>
    </div>
   </div>
</BODY>
</HTML>
PS: обновил форум вручную :) Смотрим, делаем замечания :)
mb986

Оффлайн Requiem

  • Полноправный
  • ***
  • Сообщений: 136
  • Карма: +0/-1
Php + JavaScript = спойлеры на этот форум )
« Ответ #2 : 23-09-2008 23:28:44 »
я ничё не понял :sm: :bv: :bs8:


Оффлайн wut

  • Старший
  • ****
  • Сообщений: 531
  • Карма: +0/-0
Php + JavaScript = спойлеры на этот форум )
« Ответ #3 : 24-09-2008 08:39:46 »
я ничё не понял :sm: :bv: :bs8:
Еще бы.
 Вместо спойлеров решил использовать иной способ.
mb986

Оффлайн ArS

  • Новичок
  • *
  • Сообщений: 37
  • Карма: +0/-0
    • ArStudio.ru
Php + JavaScript = спойлеры на этот форум )
« Ответ #4 : 24-09-2008 10:51:19 »
PS: обновил форум вручную :) Смотрим, делаем замечания :)
Высоту окна можно сделать побольше, чтоб прокрутки небыло.

Оффлайн junkies

  • Новичок II
  • **
  • Сообщений: 73
  • Карма: +0/-0
Php + JavaScript = спойлеры на этот форум )
« Ответ #5 : 02-03-2009 22:29:10 »
не понятно, причем тут вообще php?

Оффлайн wut

  • Старший
  • ****
  • Сообщений: 531
  • Карма: +0/-0
Php + JavaScript = спойлеры на этот форум )
« Ответ #6 : 03-03-2009 08:34:49 »
не понятно, причем тут вообще php?
Изначально я делал спойлеры на php+JS (echo с переменными форума, чтобы все было как надо ). Получилось забавно, но зачем мучаться, когда оказалось весьма простое решение :)
mb986