焦点选择

Question

这里是我使用的产品创建扩展盒我JS提琴：使用此代码

http://jsfiddle.net/wpneily/vsnag7ja/ ：

var $container = $('#iso-container'), 
    $items = $('.item'); 

$container.isotope({ 
itemSelector: '.item', 
masonry: { 
    columnWidth: 60 
}, 
getSortData : { 
    selected : function($item){ 
    // sort by selected first, then by original order 
    return ($item.hasClass('selected') ? -500 : 0) + $item.index(); 
    } 
}, 
sortBy : 'selected' 

}) 

$items.click(function(){ 
console.log('ee') 
var $this = $(this); 
// don't proceed if already selected 
var $previousSelected = $('.selected'); 
if (!$this.hasClass('selected')) { 
    $this.addClass('selected'); 
} 

$previousSelected.removeClass('selected'); 

// update sortData for new items size 
$container 
    .isotope('updateSortData', $this) 
    .isotope('updateSortData', $previousSelected) 
    .isotope(); 

}); 


$('.noclick').click(function(e){ 
console.log('dd') 
e.stopPropagation(); 
}); 

这只是伟大工程，如果用户向下滚动并在当前“开放”选择下选择其中一个框，新选择在上面查看。换句话说，新选定的产品框不在焦点中。我希望所选框不仅可以打开，而且还可以将页面滚动到容器的顶部，在这种情况下，id =“iso-container”。任何人都可以请帮忙。

Answer 1

试着在你$item.click处理程序的末尾添加下面的代码：

$('html,body').animate({scrollTop: $("#iso-container").offset().top}, 'slow'); 

更新您的fiddle