2011-01-12 2 views
0

간단한 스크립트를 사용하여 일련의 html 상자를 표시하는 배열을 탐색합니다. 초기 함수는 PHP를 통해 mysql 데이터베이스에서 요소의로드를 반향 출력 한 다음 jquery 배열에 넣습니다.jquery의 요소 배열을 되감습니다.

next3 함수는 완벽하게 작동하지만 나에게있어서 3 번째까지 되감기는 불가능합니다.

은 ...

function createTicker(){ 
tickerItems = new Array(); 
<?php 
for($i = 0; ($rs=mysql_fetch_array($detail4conferences)); $i++) { 

    $confid = '<a href=\"../'.$rs['confid'].'\" class=\"forthcomingBox\">'; 

    if(!empty($rs['strapline'])){ 
    $strapline = '<span class=\"prefixPages\">'.$rs['strapline'].'</span><br />'; 
    } else { 
    $strapline = ''; 
    } 

    $title = '<span class=\"hpTitle\">'.$rs['title'].'</span><br/>'; 

    if(!empty($rs['subtitle'])){ 
    $subtitle = '<span class=\"subtitlePages\">'.$rs['subtitle'].'</span><br />'; 
    } else { 
    $subtitle = ''; 
    } 

    $dateline = '<span class=\"dateandlocationPages\">'.$rs['dateline'].'</span></a>'; 

    echo "tickerItems[$i] = '$confid$strapline$title$subtitle$dateline';"; 
    } 
?> 
i = 0; 
tickerIt(); 
    } 

    function next3(){ 
if(i >= tickerItems.length){ 
    i = 0; 
} 

$('#tickerHolder').fadeOut(300, function(){ 
    $('#ticker1').html(tickerItems[i]); 
    $('#ticker2').html(tickerItems[i+1]); 
    $('#ticker3').html(tickerItems[i+2]); 
    $('#tickerHolder').fadeIn("slow"); 
    i = i + 2; 
    i++; 
}); 
    } 

나는 다음 할 무슨 생각을 하나 도움이되지 수 - 아무것도 아무리 내가 무엇을하려고 반복 올바른 마지막 세에 나를 착륙없는 것 같다 ...

function prev3(){ 
if(i >= tickerItems.length){ 
    i = 0; 
} 

$('#tickerHolder').fadeOut(300, function(){ 
    $('#ticker1').html(tickerItems[i-4]); 
    $('#ticker2').html(tickerItems[i-5]); 
    $('#ticker3').html(tickerItems[i-6]); 
    $('#tickerHolder').fadeIn("slow"); 
    i--; 
}); 
    } 
+0

을 부여 무엇 우리가하는 VHS 플레이어? 친절하게 되감 으십시오. j/k 문제의 코드를보다 쉽게 ​​읽을 수 있도록 형식을 지정하면보다 빠른 응답을 얻을 수 있습니다. S.O에 오신 것을 환영합니다! –

+0

지금은 조금 나아질 것입니다 ... 환영합니다. – MarkBeharrell

답변

0

는 ...이 시도

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Test</title> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
    </head> 
    <body> 
    <div class="container"> 
     <div class="line1"></div> 
     <div class="line2"></div> 
     <div class="line3"></div> 
    </div> 
    <a class="prev">Prev</a> 
    <a class="next">Next</a> 
    </body> 
    <script type="text/javascript"> 
    function showPage(pageNum, arr) 
    { 
     $(".container").fadeOut(300, function() { 
     $(".line1").html(""); 
     $(".line2").html(""); 
     $(".line3").html(""); 

     i = (pageNum - 1) * 3; 
     $(".line1").html(arr[i]); 
     $(".line2").html(arr[i + 1]); 
     $(".line3").html(arr[i + 2]); 
     $(".container").fadeIn("slow"); 
     }); 
    } 

    $(function() { 

     var tickers = [ 
     "Item 1", 
     "Item 2", 
     "Item 3", 
     "Item 4", 
     "Item 5", 
     "Item 6", 
     "Item 7", 
     "Item 8" 
     ]; 

     var numPages = Math.round(tickers.length/3); 
     var currentPage = 1; 

     showPage(currentPage, tickers); 

     $(".next").click(function() { 
     if (currentPage + 1 > numPages) return; 

     currentPage++;  
     showPage(currentPage, tickers); 
     }); 

     $(".prev").click(function() { 
     if (currentPage - 1 < 1) return; 

     currentPage--; 
     showPage(currentPage, tickers); 
     }); 
    }); 
    </script> 
</html> 
+0

와우 주셔서 감사합니다 - 아침에 이런 일이 생기면 오늘 내 머리를 흡수 할 수있는 충분한 코딩을했습니다 ... – MarkBeharrell

+0

마침내 이걸 시험해보기에 좋았습니다. 페이지에있는 다른 기능을 추가하기 시작했습니다.하지만 와우! - 당신이 그것을 한 방법을 알아 내기 위해 여전히 코드를 골라 내고 있습니다 ... – MarkBeharrell

+0

다행이라면 유용하다는 것을 알게되었습니다. 늦은 시간에 너무 많은 IT 관련된 것들을하고, 꽤 조금 코딩을 떠난 후에 나를 위해 좋은 상쾌한 운동 :). –