Jquery 每页多个图库-几乎正常工作

这可能对某人有所帮助，但并非100%有效

我试图通过把它们放在头上等来阻止IE中的主题“未发现错误”，但仍然没有真正的帮助

尽管这一切都可以实现，但单击按钮切换vars/gallery现在在jquery.min.js中给了我一个对象所需的错误，考虑到它实际可以工作，这很奇怪

<script type="text/javascript">
// <![CDATA[
var g0 = "<?php getFiles("gallery/Audience"); ?>";
var g1 = "<?php getFiles("gallery/Exhibition"); ?>";
var g2 = "<?php getFiles("gallery/registration"); ?>";
var g3 = "<?php getFiles("gallery/Speakers"); ?>";
// ]]>


$(".galleryButton").each(function (index) {
    $(this).click(function(){
        initiateGallery(eval('g'+index));
    }).mouseover(function() {
        $(this).css('cursor', 'pointer');
        $(this).css('backgroundColor', '#002E53');
    }).mouseout(function(){
        $(this).css('backgroundColor', '#000');
    });
});

var initiated = 'n';

$(document).ready(function() {
    initiateGallery(g3);
});

function initiateGallery(galleryRef){
    $('#galleria').html('');    
    $('#galleria').html(galleryRef);
    if (initiated == 'n'){
        Galleria.loadTheme('../Scripts/galleria.classic.min.js');
        initiated = 'y';
    }

$('#galleria').galleria({
        transition: 'fade',
        show_counter: true,
        imageCrop: true,
        thumbCrop: "height",
        thumbQuality: 'auto',
        autoplay: 3000,
        showInfo: true,
        easing: "galleriaOut"
    });
}
</script>

// 
$（“.galleryButton”）。每个（函数（索引）{
$（此）。单击（函数（）{
发起人名单（评估（'g'+指数））；
}).mouseover（函数（）{
$（this.css（'cursor'，'pointer'）；
$（this.css（'backgroundColor'，'#002E53'）；
}).mouseout（函数（）{
$（this.css（'backgroundColor'，'#000'）；
});
});
var=n；
$（文档）.ready（函数（）{
初级学院（g3）；
});
功能启动库（galleryRef）{
$（'#galleria'）.html（''）；
$（'#galleria'）.html（galleryRef）；
如果（已启动=='n'）{
Galleria.loadTheme（'../Scripts/Galleria.classic.min.js'）；
已启动='y'；
}
$（“#galleria”）。galleria({
过渡：“淡出”，
显示计数器：正确，
是的，
拇指修剪：“高度”，
thumbQuality:“自动”，
自动播放：3000，
showInfo：没错，
放松：“galleriaOut”
});
}

要切换主题，只需加载一个新主题即可

一种更优雅的书写方式：

$(function() {

    var themes = [
        '<?php getFiles("gallery/Audience"); ?>',
        '<?php getFiles("gallery/Exhibition"); ?>', 
        '<?php getFiles("gallery/registration"); ?>',
        '<?php getFiles("gallery/Speakers"); ?>'
    ];

    Galleria.loadTheme( theme[0] );

    $('.galleryButton').click(function() {
        var theme = themes[ $(this).index() ];
        Galleria.loadTheme( theme );
    }).hover(function() {
        $(this).css('cursor', 'pointer').css('background-color', '#002E53');
    }, function() {
        $(this).css('background-color', '#000');
    });

    $('#galleria').galleria({
        transition: 'fade',
        show_counter: true,
        imageCrop: true,
        thumbCrop: "height",
        thumbQuality: 'auto',
        autoplay: 3000,
        showInfo: true,
        easing: "galleriaOut"
    });

});

$（函数（）{
变量主题=[
'',
'', 
'',
''
];
Galleria.loadTheme（主题[0]）；
$（'.galleryButton'）。单击（函数（）{
var theme=themes[$（this.index（））；
Galleria.loadTheme（主题）；
}).hover（函数（）{
$（this.css（'cursor'，'pointer'）.css（'background-color'，'002E53'）；
}，函数（）{
$（this.css（'background-color'，'#000'）；
});
$（“#galleria”）。galleria({
过渡：“淡出”，
显示计数器：正确，
是的，
拇指修剪：“高度”，
thumbQuality:“自动”，
自动播放：3000，
showInfo：没错，
放松：“galleriaOut”
});
});

知道它可以简化，但就是没有时间好好工作！这可能不起作用，因为在阅读本文之后，问题是loadTheme命令实际上是Gallerias加载的方法是gallery skin js。我和你的代码的合并可能会很好。。。我正在做的是将一组新的图像加载到同一个元素中。我不明白为什么它不起作用，我只是使用Galleria.loadTheme（）从themes数组加载一个新主题。