我试图弄清楚如何扩展 BBQ 库以支持一些基本功能,但我发现目前无法做到。我正在创建一个 AJAX 加载投资组合站点,并遵循此示例http://benalman.com/code/projects/jquery-bbq/examples/fragment-basic/
我有一个同位素网格布局,当单击一个项目时,我希望网格淡出并且 AJAX 内容淡入。我正在使用 CSS3 过渡来实现硬件加速,所以不合时宜盒子示例并没有完全按照 id 的方式进行操作。
$(window).bind( 'hashchange', function(e) {
var url = $.param.fragment();
$( 'a.bbq-current' ).removeClass( 'bbq-current' );
// Hide any visible ajax content.
$( '.site-container' ).children( ':visible').hide();
if ( cache[ url ] ) {
// Since the element is already in the cache, it doesn't need to be
// created, so instead of creating it again, let's just show it!
cache[ url ].show();
} else {
// Show "loading" content while AJAX content loads.
$( '#load' ).show();
// Create container for this url's content and store a reference to it in
// the cache.
cache[ url ] = $( '<div class="ajax-item"/>' )
// Append the content container to the parent container.
.appendTo( '.site-container' )
// Load external content via AJAX. Note that in order to keep this
// example streamlined, only the content in .infobox is shown. You'll
// want to change this based on your needs.
.load(url+' .work-detail', function(){
// Content loaded, hide "loading" content.
$( '#load' ).hide();
$('.work-detail').addClass('work-detail-show');
});
}
})
// Since the event is only triggered when the hash changes, we need to trigger
// the event now, to handle the hash the page may have loaded with.
$(window).trigger( 'hashchange' );
});
理想情况下,我想这样做是为了隐藏/显示
$( '.site-container' ).children( ':visible').runSomeFunction();
cache[ url ].runSomeOtherFunction,''();
这些功能类似于
function runSomeFunction() {
$(this).addClass('fadeOut');//Adds class which changes scale and opacity
setTimeout(function(){$(this).hide();}, 700);//Removes div
});
目前,我在尝试执行上述示例时收到“runSomeFunction 不是函数”错误。