kein Scrollbar nach Laden mit AJAX

Torsten Baudisch

Grünschnabel
Hallo,

ich habe mich ein wenig mit AJAX beschäftigt und eine kleine Seite gebastelt doch leider habe ich nachdem ich einen Inhalt nachgeladen habe keinen Scrollbar.

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Ajax Test</title>
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="js/jquery.bgpos.js"></script>
<script type="text/javascript" src="js/self.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
</body>
<div id="content-wrapper">
	<ul id="d">
		<img src="images/leer.png" alt="" />
		<li><a href="#" onclick="contentloader();">Bilder</a></li>
	</ul></div>
<div id="content-wrapper">
<div id="div">
</div>
</div>
</html>

Code:
$(function(){
	$('#d a')
		.css( {backgroundPosition: "0 0"} )
		.mouseover(function(){
			$(this).stop().animate({backgroundPosition:"(0 -250px)"}, {duration:500})
		})
		.mouseout(function(){
			$(this).stop().animate({backgroundPosition:"(0 0)"}, {duration:500})
		})
});

var i=0;
$(window).load(
function()
{
  $(window).scroll(function()
                {
                  var margin=30;
                  if((($('body').scrollTop()+margin+$(window).height())-$(document).height())>0)
                  {
                    //hier müsstest du per AJAX nachladen
                    $('body').append('<br/>Nachladung#'+(i++));
                  }
                });
}
);

  function contentloader(dataid) {
    $("#div").load('bilder.php');
  }

Zu sehen ist das Ganze unter http://www.sukkurashu.de/Ajax/.

Hat da jemand eine Idee bzw. einen Vorschlag ?

THX im voraus
 
Zurück