如何将“;“大”;图像和“;“小”;图像到一个文件夹-Caroufredsel缩略图

How to put "large" image and "small" image into one folder - Caroufredsel Thumbnail

本文关键字:图像 一个 文件夹 -Caroufredsel 略图      更新时间:2023-09-26

我想把缩略图和大图像放在一个文件夹中。我应该在脚本中更改什么?

我不理解这个sintax

src = src.split( '/large/' ).join( '/small/' );

我试着做了一些修改,但这些仍然不起作用。

这里是我使用的滑块的链接:

http://coolcarousels.frebsite.nl/c/61/

$(function() {
        var $carousel = $('#carousel'),
          $pager = $('#pager');
        function getCenterThumb() {
          var $visible = $pager.triggerHandler( 'currentVisible' ),
            center = Math.floor($visible.length / 2);
          return center;
        }
        $carousel.carouFredSel({
          responsive: true,
          items: {
            visible: 1,
            width: 1600,
            height: 'auto'
          },
          scroll: {
            fx: 'crossfade',
            onBefore: function( data ) {
              var src = data.items.visible.first().attr( 'src' );
              src = src.split( '/large/' ).join( '/small/' );
              $pager.trigger( 'slideTo', [ 'img[src="'+ src +'"]', -getCenterThumb() ] );
              $pager.find( 'img' ).removeClass( 'selected' );
            },
            onAfter: function() {
              $pager.find( 'img' ).eq( getCenterThumb() ).addClass( 'selected' );
            }
          }
        });
        $pager.carouFredSel({
          width: '100%',
          auto: false,
          height: 120,
          items: {
            visible: 'odd'
          },
          onCreate: function() {
            var center = getCenterThumb();
            $pager.trigger( 'slideTo', [ -center, { duration: 0 } ] );
            $pager.find( 'img' ).eq( center ).addClass( 'selected' );
          }
        });
        $pager.find( 'img' ).click(function() {
          var src = $(this).attr( 'src' );
          src = src.split( '/small/' ).join( '/large/' );
          $carousel.trigger( 'slideTo', [ 'img[src="'+ src +'"]' ] );
        });
      });

问题解决了!

我只是删除了脚本中的"/legal/"answers"/small/"。

所以,现在的脚本是这样的:

$(function() {
        var $carousel = $('#carousel'),
          $pager = $('#pager');
        function getCenterThumb() {
          var $visible = $pager.triggerHandler( 'currentVisible' ),
            center = Math.floor($visible.length / 2);
          return center;
        }
        $carousel.carouFredSel({
          responsive: true,
          items: {
            visible: 1,
            width: 1600,
            height: 'auto'
          },
          scroll: {
            fx: 'crossfade',
            onBefore: function( data ) {
              var src = data.items.visible.first().attr( 'src' );
              src = src.split( '' ).join( '' );
              $pager.trigger( 'slideTo', [ 'img[src="'+ src +'"]', -getCenterThumb() ] );
              $pager.find( 'img' ).removeClass( 'selected' );
            },
            onAfter: function() {
              $pager.find( 'img' ).eq( getCenterThumb() ).addClass( 'selected' );
            }
          }
        });
        $pager.carouFredSel({
          width: '100%',
          auto: false,
          height: 120,
          items: {
            visible: 'odd'
          },
          onCreate: function() {
            var center = getCenterThumb();
            $pager.trigger( 'slideTo', [ -center, { duration: 0 } ] );
            $pager.find( 'img' ).eq( center ).addClass( 'selected' );
          }
        });
        $pager.find( 'img' ).click(function() {
          var src = $(this).attr( 'src' );
          src = src.split( '' ).join( '' );
          $carousel.trigger( 'slideTo', [ 'img[src="'+ src +'"]' ] );
        });
      });