Fullscreen con "Galleria Javascript"

huckmx · #1 (**permalink**) 20/10/2010, 15:27

Hola amigos!!!, le mucho el foro, y realmente me saca de muchos problemas.

Estoy trabajando en un galeria de fotos personal, quiero usar "Galleria", esta trabajada en javascript ([URL="http://galleria.aino.se/"]http://galleria.aino.se/[/URL]).

Este es el codigo:

Código HTML:

<!DOCTYPE html>
<html lang="sv">
    <head>
        <meta charset="utf-8">
        <title>Galleria Classic Theme Demo 01</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script src="../src/galleria.js"></script>
        <script src="../src/plugins/galleria.flickr.js"></script>
        <style>
            html,body{background:#111}
            .content{color:#ccc;font:14px/1.4 arial,sans-serif;width:600px;margin:20px auto}
            h1{line-height:1.1;letter-spacing:-1px;}
            #galleria{height:400px;}
        </style>
    </head>
<body>
    <div class="content">
        <h1>A classic Galleria gallery using Flickr images</h1>
        <div id="galleria"></div>
        <p id="nav">
            <a id="g_prev" href="#">Previous</a> 
            <a id="g_next" href="#">Next</a> 
            <a id="g_play" href="#">Play</a> 
            <a id="g_pause" href="#">Pause</a> 
            <a id="g_fullscreen" href="#">Fullscreen</a>
        </p> 
        <p>This example is a classic gallery that fetches images from a Flickr user stream using the Flickr plugin.
            We also added external links to navigate, pause, play and enter fullscreen mode.</p>
        <p>View source for comments and code.</p>
    </div>
    
    <script>
    
    // Load theme
    Galleria.loadTheme('../src/themes/classic/galleria.classic.js');
    
    // intiialize flickr plugin
    var api_key = 'fddd7bc223fe37295faace93a4f2d8fc'; // get your API key at Flickr
    var flickr = new Galleria.Flickr(api_key);
    
    // inject a user's photostrem photset into galleria
    flickr.getUser('lukewoodford', { 
        size: 'big',
        description: true // set this to true to fetch flickr descriptions				
    }, function(data) {
        $('#galleria').galleria({
            data_source: data, // add the flickr data
            show_imagenav: true, // remove the prev/next arrows
            extend: function() {
                var gallery = this; // save the scope
                $('#nav a').click(function(e) {
                    e.preventDefault(); // prevent default actions on the links
                })
                // attach gallery methods to links:
                $('#g_prev').click(function() {
                    gallery.prev();
                });
                $('#g_next').click(function() {
                    gallery.next();
                });
                $('#g_play').click(function() {
                    gallery.play();
                });
                $('#g_pause').click(function() {
                    gallery.pause();
                });
                $('#g_fullscreen').click(function() {
                    gallery.enterFullscreen();
                });
            }
        });
    });
    
    </script>
    </body>
</html>

Todo me carga perfectamente, pero lo que yo quiero es que la cargar la pagina, entre en modo de "Fullscreen", sin necesidad de darle click al link "Fullscreen" (ummm espero me haya hecho entender).

Debe ser algo sencillo, como llamar la funcion al momento de cargar la pagina en la etiqueta <body onload="">, mas no se como hacerlo, e intentado de algunas formas, pero no he podido hacer que funcione.

Por aqui seguro que hay alguien que me pueda ayudar, y me parece que no le tomara mas de 2 minutos.

Saludos a todos y muchas gracias!!!

Huckmx

danis8 · #2 (**permalink**) 06/12/2010, 04:05

Hola buenas, estaba buscando el code para integrar flickr a "galleria" y he copiado entero tu codigo cambiando mi user y api key de flickr, pero no me sale la galería ni me sale nada. ¿por qué? :S

IsaBelM · #3 (**permalink**) 06/12/2010, 06:47

los navegadores no admiten de entrada lo que pretendes, esa facultad solo se le permite a ventanas flotantes

totono · #4 (**permalink**) 14/03/2011, 15:43

hola webmasters, estoy trabajando con esa libreria pero necesito adaptar la galeria "galleria.classic.js" para que cuando pulse el teclado con las flechas pase a la siguiente pagina..
alguien sabe algo??? si se puede le agredezco.
trate de adaptar la galeria fullscreen y no pude

Naahuel · #5 (**permalink**) 14/03/2011, 16:08

No entiendo a qué te referís cuando decís "pase a la siguiente página". ¿O sea a la siguiente foto? Eso ya lo hace... podés usar las teclas derecha e izquierda para pasar las fotos.
Para iniciar en pantalla completa, a mi me funcionó esto:

Código Javascript:

Ver original$(document).ready(function(){
                // iniciar galeria
                $('#galleria').galleria();
                //obtener primer galeria
                var gallery = Galleria.get(0);
                //iniciar en pantalla completa cuando la galeria carga
                $(window).load(function(){gallery.enterFullscreen();});
        });

En el sitio del plugin podés leer la documentación, es muy detallada y completa.

totono · #6 (**permalink**) 22/03/2011, 10:57

no, la idea es que desde la galeria.clasic, pase a la siguente foto cuando pulse las flechas del teclado.

pues , en fullscreen lo hace , pero yo necesito que lo haga con la galeria .clasic,,,, o sea sin entrar a modo fullscrean

http://www.eltiempo.com/pauta/pp.html