每页多个画廊 - 几乎正常工作

时间:2011-03-24 15:58:24

标签: jquery galleria

这可能对某些人有所帮助,但并非100%正常工作。

我试图通过将它们放在头部等等来阻止IE发现主题未找到错误,但它仍然没有真正帮助。

虽然这一切都可以点击按钮切换变量/画廊现在给了我jquery.min.js中的一个Object Required错误,这很奇怪,考虑到它确实有效。

<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>

1 个答案:

答案 0 :(得分:0)

要切换主题,您只需要加载一个新主题。

更优雅的写作方式:

$(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"
    });

});