我创建了一个幻灯片并添加了一些jQuery,我希望它能在项目处于活动状态时禁用叠加层这是我正在使用的脚本:
$('.overlay').css('display', 'block');
$('.overlay').css('opacity', 1.0);
$('.views_slideshow_jcarousel_pager_item').hover(function() {
$('.overlay', this).stop().animate({opacity:0.0},500);
},
function() {
$('.overlay').stop().animate({opacity:1.0},500);
}).click(function() {
$(this).closest('.view-content').find('.active').removeClass('active');
$(this).addClass('active');
});
CSS是:
.overlay {
position:absolute;
display:none;
background:url(images/work_img.png) no-repeat 0 0;
padding:15px 0 0 15px;
width:285px;
height:185px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
color:#FFF;
font-size:18px;
z-index:2;
cursor:pointer;
}
您可以在http://dev.sb.sbdesign1.co.uk
查看开发网站如果有人对如何做到这一点有任何想法,那就太棒了。
干杯