Question

我正在开发我的第一个主要项目，在我的HTML中实现了jQuery函数。我正在建立一个图片库。

我的HTML页面上有一个jQuery函数，可以在我的标题和缩略图之间滑动面板。注意 - 缩略图是用HTML和CSS创建的;不是任何种类的数组。

我想拥有它，以便无论最终用户点击哪个缩略图，它都会调用该功能来滑动面板，问题是该功能一次只能被一个缩略图调用（通过给它一个“id”属性）。当我将id属性赋予所有缩略图时，只有在单击第一个缩略图时才会调用该函数。

这是jQuery函数：

jQuery.fn.blindToggle = function(speed, easing, callback) {
var h = this.height() + parseInt(this.css('paddingTop')) +                                            
    parseInt(this.css('paddingBottom'));
return this.animate({marginTop: parseInt(this.css('marginTop')) <0 ? 0 : -h}, speed, 
    easing, callback);  
};

$(document).ready(function() {
    var $box = $('#box')
    .wrap('<div id="box-outer"></div>');
    $('#blind').click(function() {$box.blindToggle('slow');  
});    
});


<div class=thumbbox>
     <div class="thumb" id="blind";></div>
</div>

Answer 1

为什么不使用课程而不是ID？

像这样：

$('.blind').click(function() {$box.blindToggle('slow');

在你的标记中：

<div class=thumbbox>
     <div class="thumb blind"></div>
</div>

单击库中的任何缩略图时调用Jquery函数

1 个答案: