phpBB2 by Przemo

[Gangst3r]

Nowa szybka odpowiedź

Dodaje nowy wygląd szybkiej odpowiedzi w tematach

Kod:

################################################################# ## MOD Title: Nowa szybka odpowiedź ## MOD Version: 1.0 ## MOD Author: Gangst3r ## MOD Description: Dodaje nowy wygląd szybkiej odpowiedzi w tematach. ## ## Installation Level: Easy ## Installation Time: 1 Minute ## Files To Edit: (0)    ## Included Files: (1)    ##                       templates/*/viewotpic_body.tpl ##          #################################################################

Co modyfikacja potrafi:
Dodaje nowy wygląd szybkiej odpowiedzi w tematach.

Jedyne co musimy zrobić to nadpisać plik quick_reply.tpl z załącznika.

[Gadatliwa Kasia]

[Polaczek]

musze przyznac ze fajne. Takie troche wzorowane na IPB?

[Gangst3r]

Nie To był mój pomysł jakoś miałem taka wizję
Chociaż pasuje poprawić ten pasek idący od opcji dodatkowych pod emotami Myślałem także dać z prawego boku button więcej i w javascript odkrywałyby się te emotki oraz przyciski wszystkie emoty i cyt. sel.

[emiloski94]

Gangst3r, jak zrobic takiecos? http://screenshooter.net/6097656/hlxhcbo

[M4g!k]

[Gangst3r]

Dokładnie to jest to co podał Otycha, ale jak już offtopujemy to podam cały kod co i do czego

Jak na wszystkich stronach forum to edytujesz plik overall_header.tpl:
OTWÓRZ:

Kod:

templates/Twój_styl/overall_header.tpl

DODAJ PRZED:

Kod:

</head>

Kod:

<script type='text/javascript' src='images/jQuery.js'></script>     <script type="text/javascript">     $(document).ready(function() {         //Show the paging and activate its first link         $(".paging").show();         $(".paging a:first").addClass("active");         //Get size of the image, how many images there are, then determin the size of the image reel.         var imageWidth = $(".window").width();         var imageSum = $(".image_reel img").size();         var imageReelWidth = imageWidth * imageSum;         //Adjust the image reel to its new size         $(".image_reel").css({'width' : imageReelWidth});         //Paging  and Slider Function         rotate = function(){             var triggerID = $active.attr("rel") - 1; //Get number of times to slide             var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide             $(".paging a").removeClass('active'); //Remove all active class             $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)             //Slider Animation             $(".image_reel").animate({                 left: -image_reelPosition             }, 500 );         };         //Rotation  and Timing Event         rotateSwitch = function(){             play = setInterval(function(){ //Set timer - this will repeat itself every 7 seconds                 $active = $('.paging a.active').next(); //Move to the next paging                 if ( $active.length === 0) { //If paging reaches the end...                     $active = $('.paging a:first'); //go back to first                 }                 rotate(); //Trigger the paging and slider function             }, 7000); //Timer speed in milliseconds (7 seconds)         };         rotateSwitch(); //Run function on launch         //On Hover         $(".image_reel a").hover(function() {             clearInterval(play); //Stop the rotation         }, function() {             rotateSwitch(); //Resume rotation timer         });            //On Click         $(".paging a").click(function() {             $active = $(this); //Activate the clicked paging             //Reset Timer             clearInterval(play); //Stop the rotation             rotate(); //Trigger rotation immediately             rotateSwitch(); // Resume rotation timer             return false; //Prevent browser jump to link anchor         });             });     </script>         <style type="text/css">     /*--Main Container--*/     .main_view {         position:relative;     }     /*--Window/Masking Styles--*/     .window {         margin: 0 auto;         height:270px;            width: 700px;         text-align: center;         overflow: hidden; /*--Hides anything outside of the set width/height--*/         position: relative;     }     .image_reel {         position: absolute;         top: 0; left: 0;     }     .image_reel img {float: left;}     /*--Paging Styles--*/     .paging {         position: absolute;         bottom: 10px; right: 92px;         width: 178px; height:47px;         z-index: 100; /*--Assures the paging stays on the top layer--*/         text-align: center;         line-height: 40px;         background: url(templates/Twój_styl/images/paging_bg2.png) no-repeat;         display: none; /*--Hidden by default, will be later shown with jQuery--*/     }     .paging a {         padding: 5px;         text-decoration: none;         color: #fff;     }     .paging a.active {         font-weight: bold;         background: #920000;         border: 1px solid #610000;         -moz-border-radius: 3px;         -khtml-border-radius: 3px;         -webkit-border-radius: 3px;     }     .paging a:hover {font-weight: bold;}     </style>

DODAJ (w odpowiednim miejscu):

Kod:

<div class="main_view" align="center" width="100%">                         <div class="window">                             <div class="image_reel">                                 <a href="http://adres_odnośnika"><img src="templates/Twój_styl/images/image1.jpg" alt="" /></a>                                 <a href="http://adres_odnośnika"><img src="templates/Twój_styl/images/image2.jpg" alt="" /></a>                                 <a href="http://adres_odnośnika"><img src="templates/Twój_styl/images/image3.jpg" alt="" /></a>                             </div>                         </div>                         <div class="paging" align="center" width="100%">                             <a href="#" rel="1">1</a>                             <a href="#" rel="2">2</a>                             <a href="#" rel="3">3</a>                         </div>                     </div>

ZAPISZ I ZAMKNIJ.

Jeśli chcesz aby się to wyświetlało tylko na stronie głównej wykonaj to samo w index_body.tpl co z plikiem overall_header.tpl tylko wsadź to wszystko w odpowiednim miejscu

Bardzo leciutki i stabilny rotator bannerów jeden z niewielu, który radzi sobie z linkowaniem i dużymi obrazkami

[emiloski94]

Dzięki ;p

[def]

Gdzie wrzucić te quick_reply.tpl?

[tartut]

[paweo]

Może zmienić wygląd innych stylów!

[Gadatliwa Kasia]

[lui754]

Zwykły HTML.

ZAMYKAM