<div id="timeline">
<ul class="grow" id="grown"><li>One</li><li>Two</li><li>Three</li><li>Four</li><li>Five</li><li>Six</li><li>Seven</li><li>Eight</li><li>Nine</li><li>Ten</li><li>Eleven</li><li>Twelve</li><li>Thirteen</li><li>Fourteen</li><li>Fifteen</li><li>Sixteen</li><li>Seventeen</li><li>Eighteen</li><li>Nineteen</li><li>Twenty</li><li>Twentyone</li><li>Twentytwo</li><li>Twentythree</li><li>Twentyfour</li><li>Twentyfive</li><li>Twentysix</li><li>Twentyseven</li><li>Twentyeight</li><li>Twentynine</li><li>Thirty</li><li>Thirtyone</li><li>Thirtytwo</li><li>Thirtythree</li><li>Thirtyfour</li><li>Thirtyfive</li><li>Thirtysix</li><li>Thirtyseven</li><li>Thirtyeight</li><li>Thirtynine</li><li>Forty</li><li>Fortyone</li><li>Fortytwo</li><li>Fortythree</li><li>Fortyfour</li><li>Fortyfive</li><li>Fortysix</li><li>Fortyseven</li><li>Fortyeight</li><li>Fortynine</li><li>Fifty</li><li>Fiftyone</li><li>Fiftytwo</li><li>Fiftythree</li><li>Fiftyfour</li><li>Fiftyfive</li><li>Fiftysix</li><li>Fiftyseven</li><li>Fiftyeight</li><li>Fiftynine</li><li>Sixty</li><li>Sixtyone</li><li>Sixtytwo</li><li>Sixtythree</li><li>Sixtyfour</li><li>Sixtyfive</li><li>Sixtysix</li><li>Sixtyseven</li><li>Sixtyeight</li><li>Sixtynine</li><li>Seventy</li><li>Seventyone</li><li>Seventytwo</li><li>Seventythree</li><li>Seventyfour</li><li>Seventyfive</li><li>Seventysix</li><li>Seventyseven</li><li>Seventyeight</li><li>Seventynine</li><li>Eighty</li><li>Eightyone</li><li>Eightytwo</li><li>Eightythree</li><li>Eightyfour</li><li>Eightyfive</li><li>Eightysix</li><li>Eightyseven</li><li>Eightyeight</li><li>Eightynine</li><li>Ninety</li><li>Ninetyone</li><li>Ninetytwo</li><li>Ninetythree</li><li>Ninetyfour</li><li>Ninetyfive</li><li>Ninetysix</li><li>Ninetyseven</li><li>Ninetyeight</li><li>Ninetynine</li></ul>
</div>
<script>
$(document).ready(function(e) {
alert("hi");
stroll.bind('.grow');
});
</script>
このコードは、この html をブラウザーにロードすると機能します。しかし、サーバー側のphpにAJAXリクエストを行うたびに
タイムライン.php コード
<?php
$pg = pg_connect("host=localhost user=postgres password=vinit dbname=postgres");
//or die("Can't connect to database.");
if (!$pg)
{
echo "Couldn't make a connection!";
}
$page=$_GET['page'];
$sql1="select year,year_description,page_link from timeline48 where year<2020 order by year asc ";
echo "<ul class='grow' id='grow'>";
while ($row1 = pg_fetch_array($result1, NULL, PGSQL_ASSOC))
{
$year =$row1['year'];
$desc=$row1['year_description'];
$link=$row1['page_link'];
echo "<li>".$year." ";
echo "".$desc." <a href='".$link."' target='_blank'>more..</a></li>";
$count++;
}
echo "<ul>";
echo "</nav>";
?>
リストのコンテンツを動的に追加した後、stroll.bind('.grow')
機能しません! stroll.bind
(リストにスクロール効果を追加するために使用したい)