PHP 事件日历

Question

我有一个事件日历，可以从 MySQL 中提取数据并使用 PHP 将其显示在页面上。现在，客户希望当人们打开页面时，它会滑动到下一个即将发生的事件。过去的日期会保留，但会滑至下一个即将举行的事件。

这是一个实例:http://www.sv-filipjakov.hr/en/calendar-events .

这是日期代码:

<article class="KalendarDogadjanjaBox KalendarCrveni">
    <div class="KalendarDogadjanjaBoxDatum">
        <div class="KalendarDogadjanjaBoxDatum1">21. June</div>
        <div class="KalendarDogadjanjaBoxDatum2"> 09h</div>
    </div>
    <div class="KalendarDogadjanjaBoxOpis">
        <h3>World music day, Sv. Filip i Jakov</h3>
        <p>:)</p>
    </div>
    <div class="clear"></div>
</article>

也许要日期我文章的数据属性，格式化它，然后用 jQuery 滑动？有人有什么建议吗？

Answer 1

这是我的解决方案。我将日期作为 id 添加到文章中:

    <article id="23-05-15" class="KalendarDogadjanjaBox ">
      <div class="KalendarDogadjanjaBoxDatum">
        <div class="KalendarDogadjanjaBoxDatum1">23. May</div>
        <div class="KalendarDogadjanjaBoxDatum2">23.-31.05 h</div>
      </div>
      <div class="KalendarDogadjanjaBoxOpis">
                  <a class="right" style=" position:relative; top:10px; right:-20px;" href="/slike/18052015_6377721205.jpg" rel="prettyPhoto[100]" title="Izložba radova 8.Likovne kolonije  „Svibanj 2015“"><img style="width:130px; height:100px;" src="/slike/male/18052015_6377721205.jpg"> </a>
                <h3>Izložba radova 8.Likovne kolonije  „Svibanj 2015“</h3>
        <p>Likovna kolonija Maj 2015 Turanj , okuplja umjetnike iz društava Slovenaca „Triglav“ iz Splita, „Istra“ iz Pule, Slovenski dom iz Karlovca, Slovenski dom iz Zagreba , „Bazovica“ iz Rijeke, i  „Lipa“ iz Zadra,  a pridružuju im se i likovni umjetnici iz Zadra i Sv. Filip i Jakova, Turnja i Zagreba.<br />
Svoje sudjelovanje na likovnoj koloniji potvrdili  su i slikari  umjetnici  iz Sežane i Dolenjskih toplic  iz Slovenije.</p>
      </div>
    <div class="clear"></div>
    </article>

并创建 php 函数来调用即将发生的事件:

<?php 
function KalendarSlideTo(){
global $link;
$rezultat = mysqli_query($link, "SELECT * FROM kalendar_dogadjanja WHERE KalendarDatum >= '".date('Y-m-d')."' LIMIT 1");
$redak = mysqli_fetch_array($rezultat);
echo date('d-m-y', strtotime($redak['KalendarDatum']));
}?>

和这个 jquery 代码:

$('html, body').animate({
    'scrollTop':   $('#<?php KalendarSlideTo(); ?>').offset().top
}, 1);