2014-10-25 2 views
0

как можно добавить больше ptag2, ptag3, ... для этого кода, когда добавить больше DIV это отобразить все в одном DIV и времена и расстраивает Отображать мой код:FadeIn в Див JQuery

<div class="latest_news"> 
    <strong>Latest<br>news</strong> 

    <div id="ptag1"> 
    There are many variations of passages of Lorem Ipsum available, but the <a href="#">majority 
</div> 
<div id="ptag2"> 
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has 
</div> 

JQuery код:

добавить больше DIV и установить в коде Jquery:

<script type="text/javascript"> 
    $(document).ready(function() { 
     setTimeFor2Hide(); 
    }); 

    function setTimeFor1Hide() { 
     setTimeout("$('#ptag1').fadeIn(500)", 1200); 
     setTimeout("$('#ptag2').fadeOut(500)", 700); 
     setTimeout("setTimeFor2Hide();", 5000); 
    } 

    function setTimeFor2Hide() { 
     setTimeout("$('#ptag1').fadeOut(500)", 700); 
     setTimeout("$('#ptag2').fadeIn(500)", 1200); 
     setTimeout("setTimeFor1Hide();", 5000); 
    } 


</script> 

добавить больше DIV и SetTimeout:

 <div id="ptag3"> 
    3Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys <a href="#">standard dummy text</a> ever since the 1500s, when an unknown printer. 
</div> 
    <div id="ptag4"> 
    4Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys <a href="#">standard dummy text</a> ever since the 1500s, when an unknown printer. 
</div> and more... 
     function setTimeFor1Hide() { 
     setTimeout("$('#ptag1').fadeIn(500)", 1200); 
     setTimeout("$('#ptag2').fadeOut(500)", 700); 
     setTimeout("$('#ptag3').fadeOut(500)", 600); 
     setTimeout("$('#ptag4').fadeOut(500)", 500); 
function setTimeFor2Hide() { 
     setTimeout("$('#ptag1').fadeOut(500)", 700); 
     setTimeout("$('#ptag2').fadeIn(500)", 1200); 
     setTimeout("$('#ptag3').fadeIn(500)", 1100); 
     setTimeout("$('#ptag4').fadeIn(500)", 1000); 

Не работает должным образом

ответ

0

Something like this

function setTimeFor1Hide() 
{ 
    setTimeout(hide1, 1500); 

    setTimeout(setTimeFor2Hide, 5000); 
} 

function setTimeFor2Hide() { 
    setTimeout(hide2, 1500); 

    setTimeout(setTimeFor1Hide, 5000); 
} 

function hide1() { 
    $('div[id^="ptag"]').fadeOut(500); 
    $('#ptag1').fadeIn(500); 
} 

function hide2() { 
    $('div[id^="ptag"]').fadeIn(500); 
    $('#ptag1').fadeOut(500); 
} 
+0

Спасибо, но как я могу добавить больше ptag3, ptag4, ptag5 ... HTTP: //jsfiddle.net/kj5eft82/ – lock

+0

о, извините, я неправильно понял - используйте «^ =» для поиска элементов по атрибуту. Это решение - http://jsfiddle.net/kj5eft82/1/ –

+0

не работает :(, ptag3 дисплей с ptag2, мне нужно preg3 link preg 1 и 2 показывать только preg3 после него preg4 и перезагружать preg1 и ... – lock

Смежные вопросы