[es] - Kako ubaciti counterdown timer u slider

mladja037
Mladen Petrovic
tonac

Član broj: 161462
Poruke: 84
*.dynamic.isp.telekom.rs.

Profil

Kako ubaciti counterdown timer u slider

^{01.03.2014. u 19:09 - pre 123 meseci}

Dakle, imam sajt gde kad se otvori index.html veliki deo zauzme slider:

Kod za slider je sledeci:

Code:


<section class="sectionhome fade-down">

    
    <div class="tp-banner-container">
        <div class="tp-banner tp-banner-full-width" >
            <ul>

                
                <li data-transition="fade" data-slotamount="7" data-masterspeed="1000" >
                    <img src="img/rev-slider/1/slide1.jpg" style='background-color:#b2c4cc' alt=""  data-bgfit="cover" data-bgposition="center top" data-bgrepeat="no-repeat">

                    <div class="tp-caption lfr"
                        data-x="300"
                        data-y="100"
                        data-customin="x:50;y:150;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.5;scaleY:0.5;skewX:0;skewY:0;opacity:0;transformPerspective:0;transformOrigin:50% 50%;"
                        data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
                        data-speed="2000"
                        data-start="200"
                        data-easing="Power4.easeOut"
                        data-endspeed="500"
                        data-endeasing="Power4.easeIn"
                        style="z-index: 3"><img src="img/rev-slider/1/model.png" alt="">
                    </div>
                    <div class="tp-caption lfr"
                        data-x="300"
                        data-y="250"
                        data-customin="x:50;y:150;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.5;scaleY:0.5;skewX:0;skewY:0;opacity:0;transformPerspective:0;transformOrigin:50% 50%;"
                        data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
                        data-speed="2000"
                        data-start="200"
                        data-easing="Power4.easeOut"
                        data-endspeed="500"
                        data-endeasing="Power4.easeIn"
                        style="z-index: 3"><img src="img/rev-slider/1/model2.png" alt="">
                    </div>
                    <div class="tp-caption lfr"
                        data-x="300"
                        data-y="70"
                        data-customin="x:50;y:150;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.5;scaleY:0.5;skewX:0;skewY:0;opacity:0;transformPerspective:0;transformOrigin:50% 50%;"
                        data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
                        data-speed="2000"
                        data-start="200"
                        data-easing="Power4.easeOut"
                        data-endspeed="500"
                        data-endeasing="Power4.easeIn"
                        style="z-index: 3"><img src="img/rev-slider/1/model3.png" alt="">
                    </div>




                </li>
                
                

            </ul>
            <div class="tp-bannertimer"></div>
        </div>
    </div>

Potrebna mi je skripta u uputstvo kako counterdown timer u ovaj slider da se pojavljuje kao sto se pojavljuju ovaj model1 2 i 3...samo da tu bude skripta koja ce da odbrojava vreme do pocetka.

Unapred hvala

Odgovor na temu

Zeberdee
Misel Tekinder
Freelance Web Designer/Front-End
Developer
Niš

Član broj: 177025
Poruke: 59

Sajt: www.behance.net/MiselTeki..

+4 Profil

Re: Kako ubaciti counterdown timer u slider

^{05.03.2014. u 21:22 - pre 123 meseci}

Da li bi mogao molim te da bacis taj kod u jsFiddle pa da postavis? Ovako ne vidim pored svih ovih tagova, sta taj slider zaista radi.

Moguce je postaviti mali timer koji ce da odbrojava.

Evo ti prost primer kako mozes da napravis kontinuirani countdown timer:

var counter = 5;

setInterval(function(){
counter--;
$("span").text(counter);
if(counter === 0){ // testira da li je counter 0
counter = 6; // pa zadaje novu vrednost, 6 da ne bi otisao u minus
}
}, 1000);

a u html kodu imas samo <span></span> u koji putem jquery-a ubacijes broj.

http://www.behance.net/MiselTekinder

Odgovor na temu