2016-03-04 5 views
0

Я проверил все возможные вопросы, которые могут быть связаны с этим, но я не могу найти что-либо, что подходит моему делу, либо ответы не были хорошими, либо неполными.Прокрутите страницу до конца, перезагрузите ее, затем повторите

В моем случае у меня есть страница html с некоторыми php, в результате чего результаты конкурса. По мере того, как соревнование проходит вживую, страница с результатами должна прокручиваться до нижней части страницы, а затем страница должна обновляться (поэтому появляются новые новые баллы), а затем повторяются снова и снова. Что было бы лучшим решением для моей проблемы?

Размер страницы/длина будут увеличиваться по мере того, как в таблицы, которые находятся на странице результатов, придут больше данных.

Изображение: Site preview

EDIT:

Этот код в настоящее время прокручивается в нижней части страницы, а затем перейти обратно наверх и повторить и его именно то, что я хочу, но я хотел бы страницу до refresh каждый раз, когда я ударяю дно и after this перейдите к началу.

$(function() { 


    var pageScan = { 
     speed : 10000, 
     loop : true, 
     delayRestart : 1000, 
     start : function(){ 
      pageHeight = $('body').height() - window.innerHeight; 
      pageScan.proc(pageHeight); 
     }, 
     proc : function(to){ 
      $("body").animate(
       {scrollTop: to}, 
       pageScan.speed, 
       "linear", 
       function(){ 
        if (pageScan.loop) { 
         setTimeout(function() { 
          window.scrollTo(0, 0); 
          pageScan.start(); 
         }, pageScan.delayRestart); 
        } 
      }); 
     } 
    }; 

    pageScan.start(); 

    }); 
+0

Это 2016 теперь используется AJAX .. угловой и т. Д. – Hardy

+0

Итак, скажем, у вас есть высота высотой 900 пикселей, вы хотите прокручивать ее донизу и теперь перезагружать страницу, а высота страницы увеличивается, скажем, 1300px теперь вы хотите продолжить прокрутку с 900 до 1300 или начать с вершины, т.е. 0-1300 ?? –

+0

Я хочу снова прокрутить сверху до бота. @ Reddy – cufare

ответ

0

Вы можете добавить JavaScript на страницу:

<script> 
window.scrollTo(0,document.body.scrollHeight); 
setTimeout(function(){location.reload()},5000); 
</script> 
+0

Это решение, похоже, не работает. @ danielenick89 – cufare

0

Это может быть то, что вы ищете:

// Test data, ignore 
for(i = 1; i < 21; i++) { 
    $('#results').append('<p>Test Result No.' + i + '</p>'); 
} 

// Check every second (for example) if there is new data 
// In this example there is always data 
window.setInterval(function(){ 
    update_results(); 
}, 1000); 

// Check for new results 
function update_results() { 
    $.ajax({ 
    type: 'POST', 
    // Test data, ignore 
    data: { 
     html: 'new result' 
    }, 
    // your ajax.php file 
    url: '/echo/html/', 
    success: function(data) { 
     // Append new results to $('#results'); 
     // You might want to give back an array and loop through it with $.each(data, function() {}); 
     // you might also want to check for "false" if there are no new results 
     $('#results').append('<p>' + data + '</p>'); 

     // Scroll to bottom smoothly 
     $('html, body').animate({ scrollTop: $(document).height() }, 'slow'); 
    } 
    }); 
} 

jsfiddle

В вашем ajax.php- Файл вы можете повторить новые оценки:

echo json_encode($scores); 

Учитывая, что $ scores - это массив ваших результатов, которые вы, вероятно, имеете в своей базе данных.

+0

Я не хочу обновлять результаты таким образом, я просто хочу обновить страницу, когда я ударил снизу. @WcPc – cufare

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