To jest tylko wersja do druku, aby zobaczyć pełną wersję tematu, kliknij TUTAJ
phpBB2 by Przemo
Support forów phpBB2 modified by Przemo
1.12.7 i starsze - Chowany / animowany tag [code]
Seba123 - 08-12-2010, 12:21
Temat postu: Chowany / animowany tag [code]
Chowany, animowany tag code - domyślnie wszystko w code jest schowane, aby pokzać trzeba kliknąć na tekst. Rozwija się z animacją, nie ma również problemu z google - wszystko chowane jest za pomocą jQuery. Po kliknięciu tekst "kod - kliknij aby pokazać" się ukrywa, wraz z pokazaniem się treści. Lekkie i przyjemne :)

Kod:
##############################################################
## MOD Author: Seba123
## MOD Title: Chowany / Animowany tag CODE
## MOD Description: Domyślnie ukrywa tag CODE. Jeżeli chcemy zobaczyć zawartość należy kliknąć na "Kliknij aby pokazać"
##                  Wtedy pokaże nam się kod. Wszysco jest zaaranżowane animacją.
## MOD Version: 1.0.0
##
## Installation Level: Easy
## Installation Time: 1 Minute
##
## Files To Edit: templates/styl/overall_header.tpl
##                templates/styl/nazwastylu.css
##                templates/styl/bbcode.tpl
##
## Included Files: n/a
##############################################################


Co modyfikacja potrafi:
:arrow: Jeśli chcemy zobaczyć zawartość tagu [code] klikamy na napis "Kliknij, aby pokazać" i wtedy animacyjnie pokazuje nam się zawartość.



Dobra wiadomość dla stylerów: nie ma tu żadnej modyfikacji plików, więc możecie zamieszczać to we własnych stylach czyniąc je atrakcyjniejszymi.
PablooS - 08-12-2010, 12:33
Ja nie mam jQuery ale mam troszkę inny ten kod:
Kod:
    <script language="Javascript" type="text/javascript">
    <!--
    var factive_color = '{T_ACTIVE_COLOR}';
    var faonmouse_color = '{T_ONMOUSE_COLOR}';
    var faonmouse2_color = '{T_ONMOUSE2_COLOR}';
    var l_empty_message = '{L_EMPTY_MESSAGE}';
    var no_text_selected = '{L_NO_TEXT_SELECTED}';
    var cname = '{UNIQUE_COOKIE_NAME}';
    var cpath = '{COOKIE_PATH}';
    var cdomain = '{COOKIE_DOMAIN}';
    var csecure = '{COOKIE_SECURE}';
    <!-- BEGIN switch_enable_pm_popup -->
    if ( {PRIVATE_MESSAGE_NEW_FLAG} )
    {
        window.open('{U_PRIVATEMSGS_POPUP}', '_phpbbprivmsg', 'HEIGHT=225, resizable=yes, WIDTH=400');
    }
    <!-- END switch_enable_pm_popup -->
    <!-- BEGIN switch_report_popup -->
    report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT}, resizable=yes, scrollbars=yes, WIDTH={switch_report_popup.S_WIDTH}');
    report.focus();
    <!-- END switch_report_popup -->
    <!-- BEGIN switch_enable_greeting_popup -->
    var greeting_flag = {GREETING_FLAG};
    if ( greeting_flag )
    {
        window.open('{U_GREETING_POPUP}', '_phpbbprivmsg', 'HEIGHT=225, resizable=yes, WIDTH=400');
    }
    <!-- END switch_enable_greeting_popup -->
    //-->
    </script>

Mógłbyś napisać co mam w takim przypadku zrobić?
To jest (chyba) z pozdrowienia mod ;] (pisze coś greeting)
Seba123 - 08-12-2010, 12:35
Możesz dodać pod tym.

[ Dodano: 08-12-2010, 12:48 ]
Jeżeli chcesz pierwsze kilka linijek pokazanych, a po kliknięciu wszystkie, to zmodyfikuj to tak (ale nie będzie animacji):

Do overall_header.tpl
Kod:
    <script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>       
   <script type="text/javascript">
      $(document).ready( function() {
        $('div#codebox').each( function() {           
         
          var child = $(this).children('div#content');   
                 
          if($(child).html().length > 250)
          {           
              var text = $(child).html();
              var cut = $(child).html().substring(0, 250) + '... <br><br><b>Kliknij na tekst, aby rozwinąć kod</b>';
              $(child).html(cut);               
              $(child).click ( function() {
                    $(child).html(text);                     
              });
          }
        });
      });
    </script>
do bbcode.tpl
Kod:
<!-- BEGIN code_open --><div id="codebox"><div id="content"><!-- END code_open -->
<!-- BEGIN code_close --></div></div><!-- END code_close -->
Shellerini - 08-12-2010, 12:49
DEMO: http://shellerini.xaa.pl/...pic.php?p=51#51
Fajny dodatek ;)
Seba123 - 08-12-2010, 13:00
Mały update, bo zdarza się chować przy kopiowaniu.

Shellerini, dziękuję, wykonaj jeszcze update (w overall_header.tpl).
Shellerini - 08-12-2010, 13:23
Seba123, Dałem update ;)
PablooS - 08-12-2010, 14:43
Jak dla mnie modyfikacja super ale prosiłbym o poprawkę i dodanie zwijania z powrotem...



EDIT:
Nie jest to od stylu? Masz tutaj mój css jakbyś mógł go zrobić bo akurat muszę lecieć.
Temat który jest na ss'ie to TEN

Styl.css w załączniku


EDIT:
Dodałbyś przycisk który automatycznie zaznacza zawartość tagu [code]?
MagicalFire - 08-12-2010, 15:22
Seba123, fajny dodatek ale czy da rade go połaczyc z BBM ??
PablooS - 08-12-2010, 16:22
Może mi ktoś powiedzieć jak to wyżej naprawić? Bo jest to pewnie przez styl tylko że ja nie wiem co w tych 3 stylach kodu zmienić ;]

Mod jest bardzo fajny tylko brakuje przycisku zaznaczania całego kodu i ew. chowania.
xlesiu - 08-12-2010, 16:56
PablooS, już w którymś temacie Seba tłumaczył, że efekt taki o jaki wy prosicie ma spoiler a to nie jest spoiler.
PablooS - 08-12-2010, 16:58
xlesiu, ale mnie też chodzi o tego screena czyli to że jak się kliknie to rozwija ale tekst najeżdża na inne posty i tekst.
Widać to na screenie.
Seba123 - 09-04-2011, 09:11
Czemu to wisi nadal w propozycjach, a przestarzałe kody typu tu -> http://www.przemo.org/php...ic.php?t=110155 są w modyfikacjach ?
xlesiu - 09-04-2011, 09:19
Seba123, pewnie dlatego, że nie wybrałeś tagu tematu [gotowa modyfikacja] lub [dodatek] :P
Seba123 - 09-04-2011, 16:27
Hm, rzeczywiście.. ;)
emiloski94 - 09-04-2011, 21:36
demo nie działa


Powered by phpBB modified by Przemo © 2003 phpBB Group