|
|
Line 849: |
Line 849: |
| $pxs_loading = $('.pxs_loading',$pxs_container), | | $pxs_loading = $('.pxs_loading',$pxs_container), |
| $pxs_slider_wrapper = $('.pxs_slider_wrapper',$pxs_container); | | $pxs_slider_wrapper = $('.pxs_slider_wrapper',$pxs_container); |
- |
| |
- | //first preload all the images
| |
| var loaded = 0, | | var loaded = 0, |
| $images = $pxs_slider_wrapper.find('img'); | | $images = $pxs_slider_wrapper.find('img'); |
Line 864: |
Line 862: |
| //one images width (assuming all images have the same sizes) | | //one images width (assuming all images have the same sizes) |
| var one_image_w = $pxs_slider.find('img:first').width(); | | var one_image_w = $pxs_slider.find('img:first').width(); |
- |
| |
- | /*
| |
- | need to set width of the slider,
| |
- | of each one of its elements, and of the
| |
- | navigation buttons
| |
- | */
| |
| setWidths($pxs_slider, | | setWidths($pxs_slider, |
| $elems, | | $elems, |
Line 897: |
Line 889: |
| }); | | }); |
| } | | } |
- | //hovering the thumbs animates them up and down
| |
| $this.bind('mouseenter',function(){ | | $this.bind('mouseenter',function(){ |
| $(this).stop().animate({top:'-10px'},100); | | $(this).stop().animate({top:'-10px'},100); |
Line 905: |
Line 896: |
| }); | | }); |
| | | |
- | //make the first thumb be selected
| |
| highlight($thumbs.eq(0)); | | highlight($thumbs.eq(0)); |
- |
| |
- | //slide when clicking the navigation buttons
| |
| $pxs_next.bind('click',function(){ | | $pxs_next.bind('click',function(){ |
| ++current; | | ++current; |
Line 947: |
Line 935: |
| o.easingBg); | | o.easingBg); |
| }); | | }); |
- |
| |
- | /*
| |
- | clicking a thumb will slide to the respective image
| |
- | */
| |
| $thumbs.bind('click',function(){ | | $thumbs.bind('click',function(){ |
| var $thumb = $(this); | | var $thumb = $(this); |
Line 967: |
Line 951: |
| o.easingBg); | | o.easingBg); |
| }); | | }); |
- |
| |
- |
| |
- |
| |
- | /*
| |
- | activate the autoplay mode if
| |
- | that option was specified
| |
- | */
| |
| if(o.auto != 0){ | | if(o.auto != 0){ |
| o.circular = true; | | o.circular = true; |
Line 980: |
Line 957: |
| },o.auto); | | },o.auto); |
| } | | } |
- |
| |
- | /*
| |
- | when resizing the window,
| |
- | we need to recalculate the widths of the
| |
- | slider elements, based on the new windows width.
| |
- | we need to slide again to the current one,
| |
- | since the left of the slider is no longer correct
| |
- | */
| |
| $(window).resize(function(){ | | $(window).resize(function(){ |
| w_w = $(window).width(); | | w_w = $(window).width(); |
Line 1,052: |
Line 1,021: |
| $pxs_next, | | $pxs_next, |
| $pxs_prev){ | | $pxs_prev){ |
- | /*
| |
- | the width of the slider is the windows width
| |
- | times the total number of elements in the slider
| |
- | */
| |
| var pxs_slider_w = w_w * total_elems; | | var pxs_slider_w = w_w * total_elems; |
| $pxs_slider.width(pxs_slider_w + 'px'); | | $pxs_slider.width(pxs_slider_w + 'px'); |
| //each element will have a width = windows width | | //each element will have a width = windows width |
| $elems.width(w_w + 'px'); | | $elems.width(w_w + 'px'); |
- | /*
| |
- | we also set the width of each bg image div.
| |
- | The value is the same calculated for the pxs_slider
| |
- | */
| |
| $pxs_bg1.width(pxs_slider_w + 'px'); | | $pxs_bg1.width(pxs_slider_w + 'px'); |
| $pxs_bg2.width(pxs_slider_w + 'px'); | | $pxs_bg2.width(pxs_slider_w + 'px'); |
| $pxs_bg3.width(pxs_slider_w + 'px'); | | $pxs_bg3.width(pxs_slider_w + 'px'); |
- |
| |
- | /*
| |
- | both the right and left of the
| |
- | navigation next and previous buttons will be:
| |
- | windowWidth/2 - imgWidth/2 + some margin (not to touch the image borders)
| |
- | */
| |
| var position_nav = w_w/2 - one_image_w/2 + 3; | | var position_nav = w_w/2 - one_image_w/2 + 3; |
| $pxs_next.css('right', position_nav + 'px'); | | $pxs_next.css('right', position_nav + 'px'); |
Line 1,135: |
Line 1,090: |
| <script> | | <script> |
| jQuery.easing['jswing'] = jQuery.easing['swing']; | | jQuery.easing['jswing'] = jQuery.easing['swing']; |
- |
| |
| jQuery.extend( jQuery.easing, | | jQuery.extend( jQuery.easing, |
| { | | { |