[CSS][HTML]Div ustawia się pod divem, jw Opcje

[miras]

Witam, ma ktoś pomysł jak zrobić, żeby divy ustawiały się tak jak tutaj: http://fromlife.pl/ w sensie niezależnie od wysokości mają od siebie ten sam odstęp, jak ja próbuję u siebie z float: left; i overflow: hidden; to się wszystko rozjeżdza..

[Pyton_000]

np. tak: http://desandro.github.io/masonry/index.html

[miras]

Ogólnie muszę połączyć to:

[HTML] pobierz, plaintext 
<script>
$(document).ready(function() {
$('#content_one').masonry({
columnWidth: 320,
itemSelector: '.selfie'
}).imagesLoaded(function() {
$('#content_one').masonry('reload');
});
});
</script>
 
[HTML] pobierz, plaintext 

z tym

[HTML] pobierz, plaintext 
	$(document).ready(function() {
	var track_load = 0; 
	var loading  = false; 
	var total_groups = 5; 
	$('#results').load("include/ajax/autoload_process.php", {'group_no':track_load}, function() {track_load++;}); 
 
	$(window).scroll(function() { 
		if($(window).scrollTop() + $(window).height() == $(document).height())  
		{
			if(track_load <= total_groups && loading==false) 
			{
				loading = true; 
				$('.animation_image').show(); 
				$.post('include/ajax/autoload_process.php',{'group_no': track_load}, function(data){
					$("#results").append(data); 
					$('.animation_image').hide(); 
					FB.XFBML.parse(document.getElementById('results'));
					track_load++;
					loading = false; 
				}).fail(function(xhr, ajaxOptions, thrownError) { 
					alert(thrownError); 
					$('.animation_image').hide(); 
					loading = false;
				});
 
			}
		}
	});
});
 
[HTML] pobierz, plaintext 

chodzi o to, że te divy wczytują się za pomocą autoload: http://www.sanwebe.com/2013/05/auto-load-r...-on-page-scroll

i jak wyłącze autoload i wczytam je normalną pętlą to wszystko działa i ładnie wszystkie divy się ustawiają, natomiast jak włączę autoload to divy pojawiają się jeden pod drugim.. dlatego potrzebuję połączyć te 2 opcje.



Ten post edytował miras 4.03.2015, 18:03:24

[Pyton_000]

Przecież na stronie miałeś przykład z ajax

[miras]

[HTML] pobierz, plaintext 
<script src="../js/jquery-1.6.1.min.js"></script>
<script src="../jquery.masonry.js"></script>
<script src="../js/jquery.infinitescroll.min.js"></script>
<script>
  $(function(){
 
    var $container = $('#container');
 
    $container.imagesLoaded(function(){
      $container.masonry({
        itemSelector: '.box',
        columnWidth: 100,
        isAnimated: !Modernizr.csstransitions
      });
    });
 
    $container.infinitescroll({
      navSelector  : '#page-nav',    // selector for the paged navigation 
      nextSelector : '#page-nav a',  // selector for the NEXT link (to page 2)
      itemSelector : '.box',     // selector for all items you'll retrieve
      donetext  : 'No more pages to load.',
      loadingImg : 'http://i.imgur.com/6RMhx.gif',
      debug: false,
      errorCallback: function() { 
        // fade out the error message after 2 seconds
        $('#infscr-loading').animate({opacity: .8},2000).fadeOut('normal');   
      }
      },
      // call Masonry as a callback
      function( newElements ) {
        var $newElems = $( newElements );
        // position elements at the bottom center
        $newElems.css({
          left: $container.width() / 2,
          top: $container.height(),
        })
 
        // pause so it appears new items get added from bottom 
        setTimeout( function(){
          // ensure that images load before adding to masonry layout
          $newElems.imagesLoaded(function(){
            $container.masonry( 'appended', $newElems ); 
          });
 
        }, 2 );
 
      }
    ); 
 
  });
</script>
[HTML] pobierz, plaintext 

jest i działa tylko, że to pobiera dane z kolejnych podstron zapisanych w katalogu /pages a ja chciałbym pobierać te rekordy prosto z bazy tak jak miałem w powyższym kodzie, pomoże ktoś?

ref

Ten post edytował miras 5.03.2015, 22:07:53