Несколько галерей на странице - почти работает - PullRequest
Новая
       6

Несколько галерей на странице - почти работает

0 голосов
/ 24 марта 2011

Это может помочь кому-то, но это не на 100% работает.

Я пытался остановить ошибку темы, не найденную в IE, поместив их в голову и т. Д., Но это все равно не помогло.

Хотя все это работает, нажатие на кнопки для переключения vars / galleries теперь дает мне ошибку Object Required в 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>

1 Ответ

0 голосов
/ 10 апреля 2011

Для переключения тем вам просто нужно загрузить новую.

Гораздо более элегантный способ написать это: 

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

});
...