Đang chuẩn bị nút TẢI XUỐNG, xin hãy chờ
Tải xuống
Tham khảo tài liệu 'jquery in action phần phần 9', công nghệ thông tin, kỹ thuật lập trình phục vụ nhu cầu học tập, nghiên cứu và làm việc hiệu quả | 214 CHAPTER 7 Extending jQuery with custom plugins The settings variable is now available to both functions and we re finally ready to complete the implementation of the plugin function. We define the listeners that we listed earlier with the following code settings.thumbnails.click function showPhoto this.index settings.photoElement.click function showPhoto settings.current 1 settings.thumbnails.length settings.nextControl .click function showPhoto settings.current 1 settings.thumbnails.length settings.previousControl .click function showPhoto settings.thumbnails.length settings.current - 1 settings.thumbnails.length settings.firstControl .click function showPhoto 0 settings.lastControl .click function showPhoto settings.thumbnails.length - 1 Each of these listeners calls the showPhoto function with a thumbnail index determined either by the index of the clicked thumbnail the length of the list or computed relative to the current index. Note how the modulus operator is used to wrap the index values when they fall off either end of the list. We have two final tasks before we can declare success we need to display the first photo in advance of any user action and we need to return the original wrapped set so that our plugin can participate in jQuery command chains. We achieve these with showPhoto 0 return this Take a moment to do a short Victory Dance we re finally done The completed plugin code which you ll find in the file chapter7 photomatic jquery.jqia.photomatic.js is shown in listing 7.6. Listing 7.6 The complete Photomatic Plugin implementation function var settings .fn.photomatic function callerSettings settings .extend photoElement photomaticPhoto transformer function name Adding new wrapper methods 215 return name.replace thumbnail photo nextControl null previousControl null firstControl null lastControl null callerSettings settings.photoElement settings.photoElement settings.thumbnails this.filter img settings.thumbnails.each function n this.index n .