0

ビューをアニメーション化しようとしています。このコードをjsに挿入していますが、84行目に問題があります:

function trigger_accordion(item-slide) {
if(!(item-slide.is(':animated'))) {
    item-slide.trigger('open');
}
}

エラーが出力されます: Uncaught SyntaxError: Unexpected token function

完全なコードを添付します。

(function ($, Drupal) {

    var animation = {
        'auto_animate': true,
        'auto_animate_delay': 8000,
        'auto_animate_id': '',
        'caption_speed': 'fast',
        //'panel_speed': 'slow',
        'panel_speed': 1000,
        'panel_easing': 'easeInOutCubic'
    }

Drupal.behaviors.pamh_theme = {
    attach: function(context, settings) { 

$(document).ready(function(){

    var i = 1;
    $('.item-slide').each(function(key, value) {
        $(value).attr('id', 'item-slide-'+i);
        i++;
    });

    $('.slide_caption').hide();
    $('#item-slide-1 > .slide_caption').show();
    $('#item-slide-1').addClass('active');
    $('.item-slide').not('.active').children('.slide_image_slice').show();

    });



    $('.item-slide')
    .bind('open', function(){       
        if(! $(this).hasClass('open')){
            $(this).next().trigger('open');
            $(this).addClass('open');
            $(this).animate({right: "-=769px"}, animation.panel_speed, animation.panel_easing, function(){display_slices();});
        }
        else{
            $(this).prev().trigger('close');
        }
        $(this).siblings().removeClass('active');
        $(this).addClass('active');
        setTimeout(function(){hide_slices()},1);


        display_caption();
    })
    .bind('close', function(){
        if($(this).hasClass('open')){
            $(this).removeClass('open');
            $(this).animate({right: "+=769px"}, animation.panel_speed, animation.panel_easing, function(){display_slices();});
            $(this).prev().trigger('close');
        }
    });

$('.item-slide')
    .hoverIntent(
        function() {
            animation.auto_animate = false;
            trigger_accordion($(this));
        },
        function() {
            animation.auto_animate = true;
            clearInterval(animation.auto_animate_id);
            animation.auto_animate_id = setInterval('slideshow_animate()', animation.auto_animate_delay);
        }
    )
    .click(function() {
        trigger_accordion($(this));
    });

animation.auto_animate_id = setInterval('slideshow_animate()', animation.auto_animate_delay);

};

function trigger_accordion(item-slide) {
if(!(item-slide.is(':animated'))) {
    item-slide.trigger('open');
}
}

function display_caption() {
    $('.slide_caption').each(function() {
        if(!($(this).parent().hasClass('active'))) {
            $(this).fadeOut('fast', function() {
                $('.item-slide.active >     .slide_caption').fadeIn(animation.caption_speed);
            });
        }
    });
}

function hide_slices() {
    $('.slide_image_slice').each(function() {
        if($(this).parent().hasClass('active')) {
            $(this).fadeOut('fast');
        }
    });
}

function display_slices() {
    $('.slide_image_slice').each(function() {
        if(!$(this).parent().hasClass('active') && !$(this).is(":visible")) {
            $(this).fadeIn('fast');
        }
    });
}

function slideshow_animate() {
    if(!animation.auto_animate) return;

    var next_slide = $('.item-slide.active').next();
    if(!next_slide.length) {
        next_slide = $('#item-slide-1');
    }

    next_slide.click();

}
};
})(jQuery, Drupal);
4

1 に答える 1

0

2つのこと:

  • -のように文字で JavaScript 変数に名前を付けることはできませんitem-slide。CSS クラスでは問題ありませんが、javascript では別のものを見つける必要があります。
  • 閉じ括弧の位置が間違っていました}。これが私のために働く完全なコードです:

    (function ($, Drupal) {
    
    var animation = {
        'auto_animate': true,
        'auto_animate_delay': 8000,
        'auto_animate_id': '',
        'caption_speed': 'fast',
        //'panel_speed': 'slow',
        'panel_speed': 1000,
        'panel_easing': 'easeInOutCubic'
    }
    
    Drupal.behaviors.pamh_theme = {
        attach: function(context, settings) { 
    
            $(document).ready(function(){
    
                var i = 1;
                $('.item-slide').each(function(key, value) {
                    $(value).attr('id', 'item-slide-'+i);
                    i++;
                });
    
                $('.slide_caption').hide();
                $('#item-slide-1 > .slide_caption').show();
                $('#item-slide-1').addClass('active');
                $('.item-slide').not('.active').children('.slide_image_slice').show();
    
            });
    
    
    
            $('.item-slide')
            .bind('open', function(){       
                if(! $(this).hasClass('open')){
                    $(this).next().trigger('open');
                    $(this).addClass('open');
                    $(this).animate({right: "-=769px"}, animation.panel_speed, animation.panel_easing, function(){display_slices();});
                }
                else{
                    $(this).prev().trigger('close');
                }
                $(this).siblings().removeClass('active');
                $(this).addClass('active');
                setTimeout(function(){hide_slices()},1);
    
    
                display_caption();
            })
            .bind('close', function(){
                if($(this).hasClass('open')){
                    $(this).removeClass('open');
                    $(this).animate({right: "+=769px"}, animation.panel_speed, animation.panel_easing, function(){display_slices();});
                    $(this).prev().trigger('close');
                }
            });
    
            $('.item-slide')
            .hoverIntent(
                function() {
                    animation.auto_animate = false;
                    trigger_accordion($(this));
                },
                function() {
                    animation.auto_animate = true;
                    clearInterval(animation.auto_animate_id);
                    animation.auto_animate_id = setInterval('slideshow_animate()', animation.auto_animate_delay);
                }
            )
            .click(function() {
                trigger_accordion($(this));
            });
    
            animation.auto_animate_id = setInterval('slideshow_animate()', animation.auto_animate_delay);
        }
    };
    
    function trigger_accordion(itemSlide) {
        if(!(itemSlide.is(':animated'))) {
            itemSlide.trigger('open');
        }
    }
    
    function display_caption() {
        $('.slide_caption').each(function() {
            if(!($(this).parent().hasClass('active'))) {
                $(this).fadeOut('fast', function() {
                    $('.item-slide.active >     .slide_caption').fadeIn(animation.caption_speed);
                });
            }
        });
    }
    
    function hide_slices() {
        $('.slide_image_slice').each(function() {
            if($(this).parent().hasClass('active')) {
                $(this).fadeOut('fast');
            }
        });
    }
    
    function display_slices() {
        $('.slide_image_slice').each(function() {
            if(!$(this).parent().hasClass('active') && !$(this).is(":visible")) {
                $(this).fadeIn('fast');
            }
        });
    }
    
    function slideshow_animate() {
        if(!animation.auto_animate) return;
    
        var next_slide = $('.item-slide.active').next();
        if(!next_slide.length) {
            next_slide = $('#item-slide-1');
        }
    
        next_slide.click();
    
    }
    })(jQuery, Drupal);
    
于 2013-08-20T15:57:35.600 に答える