/* /js/sweetPages.js */ /******* SWEETPAGES ********/ (function($){ // Creating the sweetPages jQuery plugin: $.fn.sweetPages = function(opts){ // If no options were passed, create an empty opts object if(!opts) opts = {}; var resultsPerPage = opts.perPage || 5; console.log("sweet..."+opts); console.log("sweet..."+resultsPerPage); // The plugin works best for unordered lists, // although OLs would do just as well: // 페이지분할 리스트는 무조건 ul>li 형식을 지킨다. var ul = this; var li = ul.find('li'); li.each(function(){ // Calculating the height of each li element, // and storing it with the data method: var el = $(this); el.data('height',el.outerHeight(true)); console.log("li..."); }); // Calculating the total number of pages: var pagesNumber = Math.ceil(li.length/resultsPerPage); console.log("sweet resultsPerPage..."+resultsPerPage); console.log("sweet pagesNumber..."+pagesNumber); // If the pages are less than two, do nothing: if(pagesNumber<2) return this; // Creating the controls div: var swControls = $('
'); // 리스트를 페이지분량씩 잘라서 wrap 해준다. for(var i=0;i'); // Adding a link to the swControls div: swControls.append(''+(i+1)+''); } ul.append(swControls); var maxHeight = 0; var totalWidth = 0; var swPage = ul.find('.swPage'); swPage.each(function(){ // Looping through all the newly created pages: var elem = $(this); var tmpHeight = 0; elem.find('li').each(function(){tmpHeight+=$(this).data('height');}); if(tmpHeight>maxHeight) maxHeight = tmpHeight; totalWidth+=elem.outerWidth(); elem.css('float','left').width(ul.width()); }); swPage.wrapAll('
'); // Setting the height of the ul to the height of the tallest page: //ul.height(maxHeight); var swSlider = ul.find('.swSlider'); swSlider.append('
').width(totalWidth); var hyperLinks = ul.find('a.swShowPage'); hyperLinks.click(function(e){ // If one of the control links is clicked, slide the swSlider div // (which contains all the pages) and mark it as active: $(this).addClass('active').siblings().removeClass('active'); swSlider.stop().animate({'margin-left': -(parseInt($(this).text())-1)*ul.width()},'slow'); e.preventDefault(); }); // Mark the first link as active the first time the code runs: hyperLinks.eq(0).addClass('active'); // Center the control div: swControls.css({ 'left':'50%', 'margin-left':-swControls.width()/2 }); return this; }})(jQuery);